The Public Sector Bodies (Websites and Mobile Applications) Accessibility Regulations 2018 puts digital inclusion in the spotlight. It’s waving the diversity flag, calling for greater attention to digitally inclusive practice.
For a number of years I’ve had an eye condition called Uveitis. It’s treated with steroid drops and
in the eye
I see the needle coming!
The pupil is dilated, letting in too much light and blurring my vision. It’s a first-class experience of sight impairment.
For several years, I helped people with sight loss to use the internet. Before that I set up DITTO (Disabled Information Technology Training Opportunities) at Centre 88, in Hull. Experiences like these showed how inclusive practices are essential for digital equality.
Inclusion matters, not just to function in a digital society but to maintain independent living, one of those things where – as Joni Mitchell sang – you don’t know what you’ve got till it’s gone.
Borrow my eyes
Share the fog.
Font, size, colour and contrast make all the difference.
Before anyone shouts browser controls, let’s be clear from the start, they’re no guaranteed solution. You could even say they’re abjuration of responsibility, peddled by those with high digital skills and low experience of discrimination.
Browser controls need users to be digitally literate and read small print. Even more importantly, to work effectively they require content to be accessibly designed in the first place. So before I get dismissed yet again for saying browser controls are not the answer – hear me out.
Many of those with vision impairment are unable to read the browser menus.
These are often unresponsive to zoom (see examples further down) and not everyone with sight loss uses a screen reader which accesses content ‘hidden’ in the html.
Assumptions are dangerous.
It’s a perfect storm.
Text unresponsive to resizing line length I often work with high magnification so it’s really frustrating when enlarged body text size on websites doesn’t wrap around the screen. If I have to scroll horizontally to find the end of the line I soon give up. Also, scroll bars themselves don’t magnify – their colour merges rather than stands out – and the largest size mouse pointer isn’t large enough. All this makes scrolling difficult. I need text to be responsive.
The image below shows a typical text heavy content.
Image One – typical page
Image Two shows the text has magnified perfectly because the designer has chosen a responsive layout option. The ‘Word Art;’ appearance of the title text is best avoided. Tired eyes struggle with shadow and 3D effects. I’ve also changed the colour contrast using a Chrome app. .
Note how the text in the Chrome Contrast App menu remains too small to read.
Image Two – differential text size
Associated with this is the issue of printing.
Many web pages send content to print using font size which is 10 pt or less. It’s too small!
This can be fixed at the design stage by creating a print version.. Better still would be a user control option whereby I can state my preferred text print size. Is this possible? I don’t know but it would be helpful if Chrome. Microsoft or Apple took this on as standard practice.
WordPress have a plugin whereby blog pages convert to readable font for printing. If you use WordPress please add this BUT the free WordPress option – like this Digital Academic blog – doesn’t allow plugins. It’s so frustrating.
The images below show another example of menu text which does not resize. this time it’s Windows.
Come on Microsoft. It’s such an obvious issue.
Image Three – default windows display colours
Image Four below is using Windows ‘High Contrast #1’ option. Image Three above is the Default Display with no contrast added. Compare the Header/Title Bar and Footer/Taskbars.
For me, the High Contrast #1 option is more difficult to see. It’s unclear how Image Four can be considered an improvement on the default settings shown in Image Three.
Image Four – high Contrast Windows display options
The version of Windows I’m using offers four high contrast display options. Image Five below shows an option while Image Six shows the Google search page and WordPress Dashboard are resistant to these styles.
Image Five – high Contrast Windows theme
Image Six – High Contrast theme with Google and WordPress
Where the contrasts appear to work (Office programmes like Word) the effects are local so a PowerPoint prepared using a High Contrast theme will lose all its colours when opened elsewhere. There should be ways round this but how many people are digitally literate enough to work it out?
i haven’t gone into the issue of digital skills and capabilities in this post but it needs saying – to create and access digitally inclusive content requires a digital literate practice. Where do people go to learn this?
Other sources of frustration…
Using the Tooltips option to give additional information can be useful, in particular for screen readers, but I don’t use one and because the font size doesn’t respond to magnification, I can’t read Tooltips text.
Image Seven – tooltips text
Too often, accessibility tools are tokenistic rather than realistic.
Windows offers a magnifer but have you tried using it?
It’s mouse controlled (which comes with its own accessibility issues). It’s annoyingly jumpy and the text pixellates on high zoom (see Image Eight below). This is something Microsoft really could and should have sorted.
Image Eight – text pixellates with the Windows magnifier
Differential magnification has been referred to with regard to menu text. It’s also an issue with programmes, for example Outlook (Image Nine) and NVivo (Image Ten) where only text in the ‘working’ window is resizable.
Image Nine – Outlook
I’m currently using NVivo for thematic data analysis. It’s a powerful programme but doesn’t support increasing text size anywhere other than the reading pane.
Image Ten – NVivo
The same applies to Webinars (Connect, Collaborate etc) where the chat window doesn’t support increasing font size and these are only a few examples!
Image Eleven below shows a gmail message magnified to a size I can read BUT the left menu column expands with the right. I can’t reduce it, fix it or close it – even though I don’t need it. What I find is the enlarged reading pane has no scroll bars for moving up and down or across. Why not? For all scroll bars tend to be too small with poor colour contrast, not having them at all renders the page inaccessible.
Image Eleven – gmail
While on the topic of Google, Image Twelve below is from my laptop. Google have one of those annoying header banners which resizes along with the text. As a result it takes up 50% of the screen, defeating the value of increasing the text size of the content.
Image Twelve – google header size
Have I mentioned the scroll bars!
In early versions of Windows there was a customised option whereby you could select individual features like scroll bars and buttons and change their appearance. I haven’t seen that for years. Why aren’t commercial giants like Microsoft and Google doing more to offer practical, day-to-day customisation options.
Put the term ‘browser controls’ into Google and you’ll get a host of links about parental controls – any immediate association with accessibility is missing from the algorithm.
Following standard advice, I search for help. The suggestion is to install accessibility extensions (See Image thirteen below)
How many people know what these are? The instruction highlighted in blue in Image Thirteen below is not helpful – how do you know what extension you want? It comes back to the point I started with. Most users know what they need to know to do what they need to do. The language of accessibility is unfamiliar.
Image Thirteen – accessibility extensions
The full list of extensions can be seen here Take a look…are the titles meaningful for you? I can guess what a Color Contrast Analyzer is but the Chrome Automaton Inspector? More intuitive language would be helpful.
These days a thin grey font on a white background seems to be the fashion but the poor contrast between foreground and background means I struggle to read it. The same for text over images and content which is fully or centre justified. When your eyes are tired, text needs to be easy to read. Left justification takes one click to do and makes all the difference.
A final grumble…(for now!)
For years I’ve relied on the keys Ctr+ and Ctrl- to adjust the size of digital text and images. Quick, easy and free, I prefer it to the zoom controls because it gives me control over text size which seems fundamental in terms of access. Lately I’ve noticed a new practice creeping in. Ctrl+ scrolls down the page instead of zooming in. WHY?
Why is always a good question.
Why does digital exclusion matter?
Why isn’t accessibility the start and end point for all digital design courses, programmes and modules – teaching and training – policy and practice?
Why the invisibility?
lack of status?
A topic the next blog post maybe…
I’ve been asked to include scanning text documents and sending them as pdf – this creates an image which can’t be read by any text to speech software and cant be enlarged without losing clarity.
Also – please – no text over images. The example below uses capital letters (which research shows takes longer to read and understand). The best practice is to put the text in a block of colour instead.
Check all content resizes on zoom – I still see examples which are unresponsive where text overlays other text on high magnification. Ctrl+ and Ctrl- is a quick way to zoom in and out.