Every single day, blind and low-vision users face barriers to the information, goods, and services that many people take for granted. Over the past decade, as society has moved toward more online interactions in place of traditional public accommodations, th
e barriers for visually impaired consumers have increased tremendously.
With the flurry of legal activity surrounding digital accessibility and the Americans with Disabilities Act (ADA), designing websites with people with disabilities in mind has become more important than ever. Yet, many organizations still don’t understand how to account for visually impaired users’ perspectives and needs.
Building a website that’s accessible for the visually impaired, while being functional and dynamic for everyone, must be a priority for designers. The best practices outlined in this article can help achieve these goals.
Website Compliance Dos
The ADA, Web Content Accessibility Guidelines (WCAG), and Accessibility for Ontarians with Disabilities Act (AODA) are clear in their recommendations and requirements for website accessibility for visually impaired people. The following five website must-haves move you closer to compliance with these guidelines:
1. Alt Text
Add good descriptive alt text to all images and links on your site. If the context of an image is important for understanding its meaning, make sure it is described in the alt text.
2. Color Contrast
Check that you have strong color contrast between all text and backgrounds. If not, someone who has low vision or is color-blind might not be able to read the content on your site.
3. Proper Readability
Ensure your website reads properly with commonly used screen reading software. Try downloading free software or using the screen reader on your smartphone to test the compatibility.
4. Clearly Explained Graphics
Make sure tables and graphs are properly labeled and described. Any graphical data should have detailed descriptions in text form.
5. Device Versatility
Design your site to be device-agnostic. Assume the screen could be any size or even nonexistent. A keyboard-only user or switch user should have the same weight as a desktop user.
Website Compliance Don’ts
No one sets out to design a website that purposely excludes visually impaired users, but sometimes, the finished result is partially or entirely inaccessible. Avoid these five pitfalls in your designs:
1. Older, Dynamic Content
Skip older, inaccessible dynamic content such as Flash. It can often act as a barrier for assistive technology users.
2. Forgotten Text Descriptions
Be sure to not to omit text that properly describes all images, links, and other graphic elements.
3. Missing Non-Visual Orientation Cues
Elements such as a progress bar or navigation tools to progress through a user journey should be visible and contextually understandable for screen reader users.
4. Inconsistent Navigation
If you begin a section of your website with a table of contents, but it only appears on half of your templates, screen reader users might think that they have made a mistake.
5. No Support for Full Keyboard or Switch Use
Although uncommon, many assistive technology users can only use or prefer to use keyboard-only devices or switch devices (in which the user has only a binary switch). Many websites fail to account for these users.
Incorporating Accessibility into Your Web Strategy
Today’s website designers and builders know that if they don’t proactively ensure accessibility, they may encounter legal and/or brand issues. By considering the diverse needs of specific groups of users with disabilities—such as users who are blind or have low vision—you can delight them with a great user experience and avoid common pitfalls that lead to expensive lawsuits.
The importance of considering the specific needs of visually impaired users cannot be understated. By following best practices for visually impaired website compliance, you ensure a better experience for every user. For more information on website compliance for users with disabilities, check out our Guide to ADA Website Compliance.