Like many people, I don’t often consider assistive technologies when browsing the internet. However, I was recently forced to rethink (and appreciate) their value after my seven-year-old requested cookies.
I agreed and quickly filed the request on the back burner — until I had the brilliant idea of using voice search and having Google Assistant read out the recipe as I whipped up the ingredients.
While I was lucky to land a site with excellent accessibility, I was shocked to learn that 96% of the top-ranking websites aren’t readily accessible to millions of people with disabilities.
So, what is web accessibility, and why is it such a hot topic right now? It turns out it’s the great equalizer for all things internet browsing. Dig in to learn more.
Table of Contents
What is Web Accessibility?
Web accessibility includes principles that ensure websites that accommodate the needs of all web users, regardless of their abilities. They seek to eliminate barriers that over 1.3 billion people living with some form of disability face while using the internet. By improving web accessibility, you can help level the playing field so people with disabilities can effortlessly use and contribute to the web without requiring assistance— and it improves the web experience for all users.
.png)
Website Accessibility Checklist
This checklist will help you make the following more accessible on your website:
- Web Pages
- Navigation
- Video & Media
- And More!
Download Free
All fields are required.
What is Assistive Technology?
Assistive technology includes products or systems that help people with disabilities, impairments, or mobility issues overcome challenges. It covers every solution that allows people who face everyday challenges (functional) — from walking to typing and everything in between.
Assistive technology can be as rudimentary as a pencil grip or as high-tech as a computer with advanced hardware and software solutions. In the context of web browsing, assistive technology helps eliminate or minimize the barriers that a disability may pose to an individual.
While assistive technology helps make the internet accessible to all, the uptake remains lower for Americans with disabilities.
6 Assistive Technologies to Make Your Site More Accessible
If you’re looking to make your site more inclusive, here are six assistive technologies I recommend trying out.
1. Screen Readers
Screen readers are an assistive technology that converts the text on your website into speech, turning the website's visual content into auditory input. They can also convert the text into braille so blind readers can explore your website with their fingers.
Incorporating screen readers empowers people with blindness, low vision, and learning difficulties to consume your content independently.
At Hubspot, we recommend that website owners follow accessibility principles. Popular recommendations include:
- Proper HTML structuring.
- Using Aria's roles.
- Writing descriptive headings and sentences.
- Using alt texts for image.
Screen Reader Compatibility
The Web Accessibility Initiative website leads by example. I love that it is compatible with Narrator, Windows' built-in screen reader, and that you don’t need a sophisticated screen reader to access it.
Narrator may lack the bells and whistles found in other screen readers such as Jaws and NVDA, but it requires no purchase or installation.
2. Screen Magnifiers
Screen magnifiers are the digital equivalent of a magnifying glass. These magnifiers enlarge the onscreen content — text and images — to help web users with poor vision or partial sight to access your content with the typical eye strain or fatigue.
You can even track the magnifier around the screen to create a fluid reading experience.
A Site Optimized for Screen Magnifiers
The Bureau of Internet Accessibility website is optimized for use with screen magnifiers. I like that high-contrast text is well-spaced and easy to magnify with any screen magnifier.
3. Text Readers
Text readers are software solutions that use a synthesized voice to read website text and may even highlight the words as they’re read out loud.
Unlike screen readers, they only read the main body text — they may not read or interpret non-textual elements such as menus and buttons. Minimizing the non-textual elements within the content body of your web posts makes them more accessible to text readers.
A Text Reader Compatible Site
USERWAY is a text-to-speech service provider. I love that they’ve kept their site simple and it’s optimized for compatibility with a text reader. Their web content contains plain text with no fancy non-text elements.
4. High Contrast Design
A high-contrast web design enables users to customize the contrast of elements to suit their visual needs. This feature is invaluable for web users with visual impairments such as low vision or color blindness.
Varying the contrast between the text, images, and background improves readability while allowing visually impaired users to distinguish between web elements. You must experiment and test different color schemes to deliver the best experience.
Website Accessibility Checklist
This checklist will help you make the following more accessible on your website:
- Web Pages
- Navigation
- Video & Media
- And More!
Download Free
All fields are required.
A Website with High-Contrast Design
The Hubspot website uses a high-contrast design to accommodate the needs of people with visual impairments. I like that I can easily toggle the high-contrast mode on or off and the option is available on every page.
5. Voice Assistants
User voice commands can convert speech into digital text with a smooth interaction. Web users can also use voice commands to open menus, search for information, or interact with customer service.
Popular voice assistants include Siri, Alexa, and Google Assistant. Optimizing your content for voice search makes it more accessible to people with disabilities. This entails using a conversational tone, long tail keywords, addressing FAQs, and optimizing your website to improve the mobile experience.
This technology is crucial to ensuring that visitors with visual impairments can also experience your website.
A Site Optimized for Voice Assistants
Yummly, a recipe site, is an example of a website optimized for voice search. I like that when you ask, “How do you make chocolate chip cookies?” Yummly provides a recipe page featuring a simple, step-by-step snippet answer.
When you’re deep in the baking stage, and your hands are busy mixing away, a voice assistant like this is incredibly helpful in finding the information you need.
6. Alternative Input Devices
Over 11% of American adults are visually or auditory impaired and may require alternative input devices when browsing the internet.
Alternative input devices include joysticks, trackballs, and head pointers that reduce the reliance on traditional computing methods such as keyboards and mice. I recommend prioritizing keyboard navigation when designing interactive elements, form controls, and links allows your website to accommodate alternative devices.
A Site Optimized for Alternative Input Devices
I like how the W3 Schools website is well-optimized for keyboard navigation. You can easily navigate the entire website using nothing but the keyboard. The clear visual hierarchy makes finding the information you need easy while reducing the likelihood of a misclick.
Web Accessibility Improves the Browsing Experience
I was pleasantly surprised and impressed by the convenience of using voice search and a screen reader when browsing the internet. These assistive technologies greatly enriched my browsing (and baking) experience, and I can only imagine their impact on the life of someone living with restricted mobility and any disability.
If you want to learn more about how to make your website more inclusive and accessible for all visitors, be sure to check out our guide to web accessibility and website examples you can follow.
Website Accessibility Checklist
This checklist will help you make the following more accessible on your website:
- Web Pages
- Navigation
- Video & Media
- And More!
Download Free
All fields are required.
