Testing Web Accessibility

When we develop a new web application, we often put a lot of work on the design, on making it beautiful and usable. In other words, we want our web app to be effective, efficient, and satisfying for the user. But a lot of times we don’t think about the user experience for people with disabilities, including people with age-related impairments.

For the web, accessibility (a11y ) means that people with disabilities can perceive, understand, navigate, and interact with websites and tools, and that they can contribute equally without barriers.” (Source: W3C – Web Accessibility Initiative). Our role as frontend and web developers is to create clear interfaces to make people understand and care about data, independently of their disabilities or impairments, but what we, developers, often forget is to ensure that the code we write follows the Web Content Accessibility Guidelines (WCAG), and the only way to achieve that is testing, either manual or automated.

Automated web a11y tests can free up our QA team from manual testing every part of our application…but…they can’t automatically, and magically, make our site accessible.

We should use automated a11y tests as one step of a larger testing process. Don’t forget that only 20% to 50% of all accessibility issues can automatically be detected.

I will show you some testing tools, libraries and techniques to increase the a11y test coverage of your code with a simple React application example.