Tools We Use to Test Web Accessibility

Is your website accessible? Let’s find out! Today, we’re going to be talking about some industry-standard tools used to assess web accessibility. These tools will help us highlight weak points on the website, with regards to all four core principles of ADA web accessibility: Perceivable, Operable, Understandable, and Robust.

These core principles are outlined in the Web Content Accessibility Guidelines (WCAG) 2.1. It is in these guidelines where the standards for accessibility are defined, and what all websites should adhere to. Following these guidelines ensures that websites are accessible to people with disabilities; this includes visual, auditory, motor, and cognitive impairments.

Lighthouse

Lighthouse is an open-source, automated tool that provides an in-depth scan of a web page. It can be run on any web page and provides audits for not only accessibility, but performance, best practices, and SEO as well.

This comprehensive tool can be run in multiple ways. The most user-friendly way to run the tool is the Google Chrome extension. After installing the extension, simply click on the extension icon and then choose your desired results and device types, then press ‘Generate report’ at the top.

The first result type option, PSI Frontend, will run the report in PageSpeed Insights. By default, this will show you detailed audits for all four categories, including accessibility. If you’d like an accessibility focused report, you can choose the ‘Lighthouse Viewer’ option. This will open a new window and only display the audits for the categories you choose.

WAVE

Like Lighthouse, WAVE is another highly-used web accessibility evaluation tool and can also be used as an extension or web-based tool. The main difference with this extension is that it is accessibility focused, and only provides audits for WCAG errors.

With one click of the extension icon, this tool provides visual feedback for accessibility issues directly on the page. With the details tab, you can click on each icon and the extension will direct you to the exact element where the error occurs on the page.

We can take this a step further and click on the reference tab; here, the extension gives us a brief description of the error as well as possible solutions. At the bottom of the reference tab, we are also able to see the referenced standards and guidelines from WebAIM’s WCAG Checklist.

Manual Testing

While scanning tools like Lighthouse and WAVE are quick and easy to use, it is important to note that automated scans are only able to detect a portion of possible issues on a web page. Resolving all the errors on an automated scan does not guarantee the accessibility of your web page.

One principle of accessibility that automated scans are not able to account for is operability. An example of this principle is keyboard accessibility. For instance, WAVE is able to detect all interactable elements on the page and display the order of them in the ‘Order’ tab. However, WAVE is unable to detect elements that are clickable but not keyboard focusable. While automated tools have their place in accessibility testing, human evaluation is essential to making web content more accessible.