You must be familiar with the Americans with Disabilities Act [ADA]. The federal government passed it in 1990 to protect individuals with disabilities from discrimination in all areas of public life, including schools, jobs, and transportation. In 2010, the ADA compliance was extended to websites as well. The law states that all electronic and information technology needs to be accessible to users with disabilities.
By ‘disabilities,’ they refer to audio-visual impairments and differences in cognitive, auditory, neurological, verbal, and visual processing. There are legal requirements regarding how perceivable, operable, understandable, and robust the website is.
So, your website may not be discriminating based on not having a ramp or an elevator; however, not using appropriate colors, fonts, and file types can discriminate against people with visual impairments.
On this page
Conducting ADA compliance website tests
In the US, one in four adults has some form of disability, and ten percent of those cases are severe. You could be spending ample time and resources on website SEO to gain traffic, but are you even reaching everyone you should?
Moreover, major search engines such as Google and Bing consider whether or not a website is ADA-compliant while determining how they rank online.
Therefore, you need to ensure your website is accessible for practical, business, and legal reasons. But it can be hard to know where to start, especially if testing is not your forte. To make the process simpler, here are five simple tests you can conduct yourself on your website to test whether it is ADA-compliant:
1. Keyboard navigation
For the visually-impaired, site navigation typically happens with the keyboard, rather than the mouse, and relies on on-site hierarchy logic.
You thus need to make sure that your site tabs and menus are ordered in a sequence and layout that makes sense and that every link, control, and feature on the website can be operated using only a keyboard.
Therefore, to test it for keyboard navigation, unplug your mouse and see how well you can navigate the site using the ‘Tab’ key to go forward, the ‘Tab’ and ‘Shift’ keys at once to go backward, and the ‘Enter’ key to follow links.
If you can conduct all interactions with the keyboard, and if the sequence of interaction points matches the intended interaction order, you are set. But if you can’t, there might be web accessibility issues that you need to take care of at the earliest.
2. Alt text for images
For assistive technologies (e.g., screen readers) to interpret and communicate images, they require alt text. That is because differently-abled people who use screen readers will hear “image” when an image is encountered on the site.
However, that alone does not give any information on whether the image is essential to the site interaction or merely decorative. Thus, you should make sure that all your informative images have suitable alt text so that the screen reader knows what to say.
Here is an example:
Alt = “Business school professor, pointing to a student’s computer screen.”
The key is to describe the image and give it context to fit with the rest of the content on the website. Since it is UCLA’s website, merely writing “woman pointing to a person’s computer screen” won’t do any justice to both the website or the differently-abled individual.
For decorative images, you can set them to null (alt=”) so that the reader ignores them. To check for alt text, use a screen reader or similar assistive technologies on desktop and mobile. Review the code and check if the descriptions make sense.
3. Color contrast on the website
For web accessibility, color contrast is essential. Those who have impaired vision (such as low-contrast vision, color vision deficiency, low vision) appreciate not having to necessarily strain their eyes to unnecessarily strain their eyes and may use high-contrast mode with resized text to read the website content. So ADA color compliance is essential for every website.
A site that supports neither will thus rank low on accessibility. To fix this, use high-contrast mode on your site and interact with it while changing the text size to see how well the two interact together. To activate this mode on Windows, use the combination shortcut – Alt + left Shift + Print Screen.
Mac, on the other hand, provides options to invert colors in the accessibility or display settings. Alternatively, you can even use the free instant color contrast analysis, a11y® Color Contrast Accessibility Validator, provided by the Bureau of Internet Accessibility.
4. Contextual link texts
As the differently-abled person tabs along with the website, the screen reader may say “Click here” when encountering a link. However, these words alone do not make any sense out of context. Instead, make your link text more comprehensive, such as “Click here for more information about X,” so that your user can decide whether or not to click. Give the CTAs some context for better understanding.
5. Closed captions and video transcripts
If your website has audio-visual media content, someone with reduced hearing might have trouble understanding it. So be sure to supply transcripts or captions for all audio and video files on your website.
Captions are text alternatives of the audio content that synchronize with the video. They should include spoken works, contextual sounds, and other relevant elements such as background music or song to ensure the differently-abled person gets a complete video feeling.
Transcripts, on the other hand, are text versions of the video content and should also include spoken dialogue and relevant, contextual sounds but also a text description of everything necessary being displayed on the video.
If you want to check for captions and transcripts on the website, it is easy. Simply go to the video and within the player, check if there is a button or option to switch on “closed captions” so that they appear automatically as soon as the video starts playing.
Ensure the button works with both the mouse and keyboard. In addition, check for a text transcript to accompany the video. If they don’t seem adequate, it is time to make your videos more accessible and robust.
Don’t take website accessibility tests lightly
Web accessibility has become more critical ever with an increasing number of websites mushrooming across the digital ecosystem and businesses earning more of their revenues online.
Therefore, enabling your site is accessible to everyone, including those who are differently-abled, is necessary from a revenue generation and brand reputation standpoint.
Sure, you must have extensive knowledge about assistive technologies to understand all the accessible web testing requirements fully. However, you can do simple accessibility tests to ensure your website is fully-compliant and accessible by all.
What are you waiting for? Make your website ADA-compliant today!
Featured image source: Freepik (Affiliate Link)