5 Top Tools for Testing Accessibility

Google Lighthouse scores are often used as a first port of call for getting some feedback on the quality of accessibility for a website. Having one number that tells you everything is ok can be really reassuring. But what if you wanted to explore further and get a longer list of things to explore to take your accessibility testing to the next level?

Our development team generally reach for these tools when working on projects:

1. Silktide (Chrome Extension)
   
   Silktide’s Chrome extension provides an accessibility checker that you can set to AA or AAA standard, alongside other tools including ones for seeing the page like users with colour blindness, and a diagram showing the focus order of the page which is the order that people using only the keyboard or using a screen reader will see/hear the content. Another benefit of using Silktide is that it uses the same checks as the Silktide Index, their web accessibility league table, so you can see which things to fix to help you get a good rank!
2. Firefox Accessibility Dev Tools Tab
   
   I use Firefox as my main browser for web development, and the main reason is that I really like their developer tools. One of these is the Accessibility tab, which gives an outline of the page with all of the elements and their accessible names (if they have them!). This really helps you get an overview of how a person using assistive technology will experience the page, and helps you to make it easier for them to navigate.
3. Web Developer (Chrome Extension)
   
   This Chrome extension has a number of handy tools that I often use - like View Document Outline, which gives you a list of all the headings on the page and their heading levels to see where the order of headings might be incorrect, and Display Alt Attributes to easily see which images have missing or unhelpful alt text.
4. VoiceOver
   
   Mac’s built-in screen reader is VoiceOver, and it’s really helpful to actually run through the page with a screen reader to make sure your accessible code is having its intended effect. One tip though is to make sure to use the right browser for the screen reader you’re using, as they’re usually designed with a specific browser in mind - for VoiceOver it’s Safari.
   
5. Meerkat
   
   Here at DEV we’ve developed our own tool to test any website we develop, called Meerkat. It includes checks by Google Lighthouse and Axe, and stores test reports so we can see how we’ve improved a site over time. We can configure it to run on just a sample of pages or on every single page of a site, and it does it all automatically which hugely reduces the manual time taken!