Start your Accessibility test with these 5 tools

Web Accessibility or Digital accessibility is driven by inclusive development culture.

Many thanks to all those accessibility advocates who have helped in educating businesses and development teams about inclusive development and its importance. Now, the market is flooded with multiple tools to analyse the coverage of accessibility guidelines defined by WCAG standards.

This article is for all those who are taking the baby steps towards the accessibility tests and would like to start somewhere, but not really sure where. If you are having questions like – “Where to start?”, “which tool to go for?”, “Are there any free tools?” etc, then you are in right place.

I have been using the below tools on day to day basis to carry out the accessibility checks, may be this will help you as well.

1. Contrast Analyzer

As part of the WCAG standards, there should be a clear distinction of background color and foreground text color. The text should be legible for users to read. The color contrast analyzer is handy tool for all UX designers. As this will provide quick feedback about the color palette choosen. This can be mostly static check of web page or the color scheme.
If you are a designer and trying to work on the color palette according to company branding guidelines, then contrast checker is a very good tool for quick feedback.
If you are tester then, google contarst analyzer or WAVE can be good option to start with.

2. Keyboard accessibility

One of the main WCAG standards is to provide every interactive element on screen to be accessible through keyboard. Not many are aware of how this works or how this can be tested. Teams who has license for JAWS tool, i think they don’t have to worry about. Teams who are looking for some open source/free tools can go ahead with the below suggestion.

One of the handy tool i use or suggest to my new team members who are starting off accessibility testing journey is Access ibility Insights tool. This can be added as chrome extension. And quickly start off with the check to all web applications.

Launch the website
From the chrome extensions choose Accessibility insights

Choose Assessment

Keep the visual helper switched on (this helps you visualize the focus movement on the screen)

Continue with the tabbing and other keyboard interaction.

3. Screen Reading

For screen reading, I would recommend to use the local system available screen readers. They do a pretty good job of reading out the DOM elements. Windows and MAC both are equipped with the screen readers. For those who are used to JAWS, they may find it little odd to use, however it does a pretty descent job.

4. Structural tests

According to WCAG, the text hierarchy should be followed. The free usage of H3, H4 etc can confuse the user. Each header has its own purpose in conveying the message. To check the structural elements WAVE is highly recommended.

Th tool identifies the structural elements and overlays the label beside them. Helps in quickly spanning through the webpage.

5. Google Light House

Last but not the least, for all the development teams who are just starting off something new and would prefer to have a quick accessibility audit then google lighthouse is a good start. Although, this tool fails to capture all aspects of the WCAG guideline, in longer run teams should start leaning towards more reliable tools for the coverage checks.
In the developers tool , choose the “lighthouse” option
Choose Accessibility option and make a choice of device for which you may need the audit.
Run the report