What Is Web Accessibility and Why Is It so Important?
An audit of the top million home pages on the web performed by WebAIM detected over 51 million distinct accessibility issues, with 97.4% of home pages having some type of problem. When nearly every landing page has issues, that’s proof that accessibility isn’t prioritized like it should be.
But what exactly does accessibility mean? Which users are running into accessibility problems?
When it comes to the web, accessibility is the practice of designing and developing websites so everyone can use them. The CDC estimates 1 in 4 adults in the United States have some type of disability. This translates to approximately 61 million people, meaning there is a lot of variation in how we perceive and navigate content.
But accessibility doesn’t only include people with disabilities. It also considers people using mobile devices, people with limited bandwidth, and even those with temporary limitations, such as someone in a waiting room who cannot play audio aloud.
Additionally, people may use assistive technology, which is software or equipment that improves their interaction with the web. For example, screen readers provide spoken or braille descriptions of items and can be used to navigate through a page. Most modern devices come with built-in screen readers, such as VoiceOver on macOS and Narrator on Windows.
But what kind of barriers are problematic for users? How do designers, developers, and quality assurance analysts know what to watch for?
To answer these questions, the WC3 developed the Web Content Accessibility Guidelines (WCAG 2), which provide a shared accessibility standard at an international level. These guidelines help us become aware of the types of issues that frustrate people so we can build user experiences that are enjoyable for everyone.
Let’s take a look at some of the top web accessibility concerns.
Low contrast text is one of the most common accessibility issues, detected on 86.4% of home pages analyzed by the aforementioned WebAIM audit.
WCAG 2 (criterion 1.4.3) defines contrast as the difference in the relative luminance (brightness) between two colors. Contrast ratios range from 1:1 (white on white) to 21:1 (black on white). In order for text to be readable for everyone, WCAG 2 sets the minimum acceptable contrast ratio for text at 4.5:1, with an exception of 3:1 for large text. Large text is defined as 18 point (24px) or 14 point bold (18.5px).
Low contrast text negatively impacts people with low vision or other visual disabilities, because text may be illegible.
Another common issue is missing or improper use of alternative text. Alternative text functions as a substitute for non-text content, such as images, audio recordings, and videos. It benefits people who use screen readers, allowing them to perceive information provided by non-text content. This is especially important for functional images, because assistive technologies cannot convey the meaning of an unlabeled image to the user.
If no alternative text is provided, the user may only be told there is an unlabelled image and may not be able to determine the purpose of the button. Even worse, some screen readers may read out the file name of the image, creating a poor user experience.
Keyboard access is another major accessibility concern. People may be unable to use a mouse due to motor or visual disabilities and rely on keyboard buttons or other assistive technology to interact with the page. If keyboard navigation isn’t taken into consideration, users may end up completely blocked from accessing content. It is important to verify all functionality on a website is keyboard accessible, including menus, buttons, filters, form fields, and user interface controls. On top of that, focus should move between elements in a logical order and always be visible so people can keep track of where they are on the page.
When accessibility is an afterthought, it’s easy to accidentally introduce barriers that frustrate and hinder our users. As technology becomes further integrated into our lives, we must make accessibility a core part of our design and development workflow so as many people as possible can enjoy the web.