The online world can be an unfriendly place for users with disabilities. While access technology has come on leaps and bounds, with a range of options available to users with visual or motor impairments, many websites still do not make it easy for users of assistive technologies.
Here we discuss some of the more common assistive technologies for blind and visually impaired users and how you can optimise your to website for these.
A screen reader is a piece of software that allows blind and visually impaired users to engage with websites. They read out text and HTML code to give the user an understanding of the structure and content of the site.
The two most common screen readers on desktop are JAWS, Job Access with Speech, and NVDA. NVDA is freely available for anyone while JAWS comes with a small price tag.
VoiceOver is Apple’s offering to the screen reader world that is build into the operating system of both their Macs and iPhones, while Android phones use TalkBack.
The RNIB offer a great review of different screen readers for Windows.
What does this mean for your website
Screen readers rely on the website being coded correctly to work properly. Unfortunately, too often this is not the case and as a result, screen reader users have a poor experience online. There are a number of key issues that crop up again and again:
- Interactive components are not keyboard accessible. Screen reader users rely on tabbing through a website using a keyboard as they cannot see where to point a mouse. If a page element, such as a button or a link, is not included in the keyboard order it will be missed completely by the screen reader meaning users cannot use those parts of the site.
- Headings need to use h tags and be in the correct order. According the latest WebAIM survey of assistive technology users, nearly 70% of screen reader users primarily navigate using page headers. If these are incorrectly coded or used non-sequentially not only is this incredibly frustrating for users but may also cause them to miss crucial site content.
- Alternative text is required for all descriptive non-text content. Are you using an infographic to convey key information or a video to tell you customer about your product? The visual content may look great but is completely useless to your visually impaired audience unless there is suitable alternative text that accurately conveys the same information as the image.
- Headings should be front loaded with key information. An experienced screen reader user will zip down lists of headings so quickly you won’t be able to keep up with where they are on the site. As they do this, they are listening out for keywords that might give them an indication of where they will find the information they need. If this key information is not at the start of a sentence or heading, users are likely to skip past it before they hear the crucial part and miss the content they are looking for.
Screen magnifiers allow users to zoom in on webpage to see the content at very high magnification (500%+). Screen magnifiers are used by individuals with some vision but who cannot use a website at normal magnification levels. Often these users have a restricted field of view, tunnel or peripheral, or a visual impairment that causes distortion in their field of vision. There are a huge range of screen magnifiers on offer today, from the built-in browser zoom to specialist screen magnifers such as Dolphin SuperNova and ZoomText.
These third party softwares not only provide high powered magnification, they can also rearrange page content into a single column that makes it easier for software to scan down page content, change colour contrast to meet user’s specific needs and alter how the cursor is presented on screen.
What does this mean for your website
Like screen readers, screen magnifiers are to some extent reliant on how a website is coded. WCAG 2.1 requires that low vision users should be able to read all content without having to scroll horizontally, for all zoom sizes at least up to 400%. On a responsive design web page with media queries, at 400% zoom users see the layout for small screen mobile phones, so all content must continue to be shown in some way on the mobile layout.
In addition, screen magnifiers are reliant on the visual design and layout of the web page. Highly intricate, complex pages can be difficult to navigate using a screen magnifier. Users can become disorientated and miss key content so where possible keep your website design clean and simple.
WCAG 2.1 guidelines comprehensively lay out everything a website must do to be accessible for users of these technologies. Conducting an accessibility audit and identifying where your site needs to improve is the first step to making your website accessible to all your users.