While most web visits are typically a visual experience, those who are visually impaired should not be excluded from the online world. If a website is inaccessible to the visually impaired, they lose the opportunity to consume the information, products, and services of that particular business. This means the visitor misses out on this information, and the business in-turn loses a potential customer.
The Website Content Accessibility Guidelines (WCAG) set forth by the Americans with Disabilities Act outline how website owners can program their site to be accessible to those with mental and physical disabilities. And, as the digital world grows, so does the technology that allows those with disabilities to engage online, making it easier to meet the WCAG. Check out a few of these ideas and technologies below:
Automatic Image Recognition
Whether it is a news image, an Instagram post, or anything in between, pictures are on almost every webpage to provide both entertainment and information to its visitors. Recently, accessiBe developed a new form of AI has been developed that can process and recognize an image and generate appropriate alt titles and description. When someone who is visually impaired visits a website that uses Automatic Image Recognition, the image will be described to the user so they can understand its purpose. Both Google and Facebook have developed similar AIR algorithms to benefit their users.
Keyboard Accessibility
Due to the fact that it requires hand-eye coordination, the use of a computer mouse is out of the question for those who cannot see properly. Programming a website to allow the use of keyboard shortcuts is one way for all users to have the ability to navigate around a site. Common keyboard shortcut examples include Ctrl + C to copy information and Alt + F4 to close an app or window.
If a website has links or buttons that can be used to navigate web pages or purchase items, these features can be programmed to have descriptions for visually impaired users. This improves user experience as they are better able to choose where they want to go on a webpage. For example:
- A “learn more” button on a webpage might be too vague to peak a user’s interest
- A “learn more about how our product can benefit your health” button is much more descriptive and enticing for any user browsing the site
We have done our best in this piece to showcase how to properly link utilizing anchor text that is more descriptive. The links may seem longer, but they are much easier for a screen-reader to understand and convey to a user with an impairment.
Color and Font Adjustments
The Website Content Accessibility Guidelines now require certain color combinations for optimal visibility on a site. Different plugins can now test the color contrast ratio on a website to ensure it is readable for colorblind users. Additionally, a new Adobe AI software is available for use that simulates color blindness on any online page. This gives developers insight on how users who suffer from color blindness will be viewing the page.
When it comes to font size, both web browsers and algorithms now have the ability for users to increase or decrease the size of a font. To ensure that users are aware of this feature on your website, create a button/slider/magnifying glass that is obvious for users to enable.
Screen Reader Adjustments
A screen reader is a form of technology that takes the text/content from a site and reads it out loud to its user. Those who are blind, visually impaired, have a learning disability, or are illiterate utilize screen readers to consume a website’s information. The most common screen readers are Microsoft Narrator for Windows and Voice Over for Macs. To ensure a website is compatible with screen readers, the site should provide alt text descriptions, titles, subtitles, and headings.
When it comes to images or videos, websites should always offer an alternative description of the image that screen readers can process and read to the viewer. Alt texts should be brief and informative. If you wish to provide more context for an image or video, a caption can also be included. By providing both, a visitor can choose for their screen reader to read the alt text and the caption for more information, or just the alt text.
Titles, subtitles, and headings need to be included on every page of a website. Those who do not struggle with their sight will appreciate titles so they can easily choose what to read and what to skip over. Similarly, those who are visually impaired benefit from the use of titles and headings because their screen reader can first skim the titles as well. This way a user can determine whether they want to continue to listen to the rest of the information on the page.
The Takeaway
Incorporating the different software’s and algorithms mentioned above will immensely benefit user experience for those with visual impairment. By programming sites to meet the WCAG and to be compatible with screen readers, users who are visually impaired get to have a similar experience to those who do not struggle with their vision. This will, in turn, improve their experience on your website which will only increase user visits, purchases, and time spent interacting on your site.
Extra Tip: These changes can seem overwhelming, so considering using a third-party tool.
We recommend two tools to help with accessibility adjustments. First, accessiBe for not only help with optimizing for the visually impaired, but other disabilities as well, all while ensuring your meet the compliance requirements set forth by the WCAG and the ADA. Second, LightHouse is a fantastic developer tool that allows auditing and testing for many user experience elements to optimize how people interact with a website.
Here’s to a more accessible, inclusive World Wide Web!