Accessibility audits

Mon Aug 12 2024

So, full disclosure here, my work got sued for ADA compliance.

We were disappointed to say the least. In ourselves, mostly—at least I know that’s how I felt. I knew the importance of accessibility on the web. One of my earliest suggestions at the company was to update a number of component colors because they weren’t meeting WCAG contrast ratios.

But over time, we fell short.

Selecting a tool

In order to take on the task of getting all of our websites in compliance, we needed to agree on a method for auditing. We all began using the WAVE Browser Extension to scan, page by page, and correct accessibility errors.

I quickly realized we couldn’t rely on the plugin’s reporting alone. WAVE would often include false positives (i.e: flagging contrast ratio errors on disabled elements) or miss things (i.e: when and when not use aria-labels).

After some hands-on research, I brought Axe DevTools to the team’s attention. It’s reports appear more consistent with what was actually being rendered on the page, and I liked the settings for accessibility standards and best practices.

Neither tool is perfect though.

WCAG nuances

You see, to accurately audit a web experience’s accessibility for humans, you have to access it as a human. And from the viewpoints of humans with varying levels of ability (bonus points if you have access to a screen reader, such as JAWS, but an ARIA DevTools browser extension helps too) to truly understand how they might interact with your website, and what types of issues may arise.

For example, the WAVE tool will point out the presence of any ARIA attribute such as aria-label, but won’t actually check if that attribute makes sense in the given context, or list it as an error if it doesn’t.

Using aria-label properly is important and helpful for those who rely on certain assistive technologies, but it’s not always necessary. Sometimes using semantic HTML tags and structure, or simply including a title attribute can suffice. In some cases, adding an aria-label can create redundancy.

Certain idiosyncrasies such as this are why it’s important to not only introduce accessibility tooling in your development workflow, but also attaining a solid understanding of the Web Content Accessibility Guidelines (WCAG).

Ongoing maintenance

Since our lawsuit fiasco, we’ve added an accessibility step into our QA process, dedicating ourselves to sustaining an accessible web presence. It is essential to also regularly audit all websites, as the WCAG are updated periodically, so you don’t fall out of compliance (and open yourself up to litigation from opportune lawyers!).