Skip to content

Testing for Accessibility

There's an infinite number of webinars, online articles and YouTube videos that tell us we can use this and that browser plugin, website and tool. From a design perspective we're not in the browser all the time, we're in a design or prototyping tool. Don't get me wrong, the browser plugins are invaluable for me and the teams I work with but there are many options for the design stages too.

Testing Methods

There are many manual tests, automated tests, and usability tests. Each testing method on its own may not uncover every accessibility issue, as each tends to identify different aspects. However, when you combine all three, the total number of issues detected increases significantly!

Manual Testing

Manual testing is when a human goes through each interface one by one and looks and tests for accessibility issues. Designers can do their own manual checks as they work. Then near the end, an accessibility specialist will do a full, comprehensive, accessibility test.

Manual checks are:

  • Easy to do; and easy to do repeatedly
  • Possible to do at any stage of our design process
  • Cheap to do (from a monetary perspective)
  • Allow us to be thorough

For comparison

The accessibility community tells us that an experienced and trained human accessibility consultant will find approximately 85 to 95% of the accessibility issues. Comparatively, automated testing tools find up to approximately 30%.

There are too many things that computer software simply cannot find. For example, a test tool can tell you if an image has no alt text, but it cannot tell you if the alt text is correct for that image. If the image is of a cat, but the alt text says it's a dog, the test tool can't pick that up.

Manual testing should be where we start and what we go to most often. Testing shouldn't be postponed until the final stages when we have code for automated testing or a prototype for usability testing. Instead, manual testing is integrated into our default design process from the outset.

What qualifies a manual accessibility tester?

Manual accessibility testing plays a crucial role in ensuring digital products are usable by everyone, regardless of ability. But what defines an experienced manual accessibility tester? Here are some key qualities:

Solid Grasp of Accessibility Standards: Understanding WCAG (Web Content Accessibility Guidelines) and other relevant standards is essential. The experienced tester can navigate these guidelines, identify potential violations, and recommend solutions for achieving compliance.

Expertise in Assistive Technologies: Knowledge of screen readers, keyboard navigation tools, and other assistive technologies allows the tester to experience the product from the user's perspective with a disability. This hands-on experience is invaluable in uncovering accessibility barriers.

Strong Analytical and Problem-Solving Skills: Identifying accessibility issues requires a keen eye and a methodical approach. The experienced tester can analyze user journeys, pinpoint problem areas, and suggest effective solutions to enhance accessibility.

Excellent Communication Skills: Clear and concise communication is vital. The tester needs to document their findings effectively, explain technical concepts in a user-friendly way, and collaborate with developers to implement solutions.

Empathy and User-Centric Mindset: Understanding the challenges faced by users with disabilities is key. An experienced tester approaches their work with empathy, constantly striving to make the product usable for everyone.

Beyond these core skills, experience in specific areas like web development, user interface design, and content creation can also be valuable assets. Additionally, staying updated with the latest accessibility trends and best practices demonstrates a commitment to continuous learning and improvement.

By combining these qualities, experienced manual accessibility testers empower businesses to create truly inclusive digital experiences.

If the developer team does not have accessibility expertise (often the case with all but the largest companies) the auditor will need to provide detailed instructions for how to correct the accessibility issues found, including the appropriate HTML, CSS, and ARIA to use.

Usability Testing

If you're familiar with the UX field, you probably understand the concept of traditional usability testing. In Steve Krug's book, "Rocket Surgery Made Easy," usability testing involves observing individual participants as they interact with the digital product being tested. During these sessions, participants verbalize their thoughts, revealing areas of confusion, ease, and joy.

Incorporating individuals with disabilities into our usability tests is essential for uncovering accessibility issues that may not be detected through manual or automated checks alone. By diversifying our pool of test participants, we gain valuable insights that contribute to a more inclusive design process.

Just as we strive for diversity and inclusivity in our personas, it's crucial to ensure our usability test participants reflect a range of characteristics, including race, gender, age, and ability. This approach fosters a more comprehensive understanding of user experiences.

While bringing in diverse test participants, particularly those with disabilities, can incur additional costs, it's far more efficient to address accessibility issues early in the design process. Proactively resolving issues through manual and automated checks minimizes the need for extensive revisions during usability testing, allowing participants to focus on providing valuable feedback on significant aspects of the design.

Accessibility specifics testing

A couple of recommended places to find people with disabilities for user testing are - Fable Tech Labs and Lighthouse of Broward.

Automated Testing

Aside from the manual testing and usability testing, there are some additional testing resources to share. The automated testing tools. They are very helpful for the instances when there is a “functioning” product based in code.

These are helpful when you want to:

  • Test an existing website that we are going to redesign and we want to get a baseline for its current level of accessibility, (or maybe you are only doing an accessibility audit).
  • You need to do final accessible design checks on our interfaces. The team would run these automated tools on the working code:
    • During development while the developers are building the site.
    • All the way up to the site launch
    • After launch to maintain and improve the site.

Links

Users in Web Projects for Better, Easier Accessibility - W3C
Involving Users in Evaluating Web Accessibility - W3C

Favorite Tools

First up is WAVE, the Web Accessibility Evaluation Tool (by WebAIM). I use this just about everyday in my work. You can use WAVE in a couple of ways:

  • You can use the online WAVE tool by entering a webpage (URL) on their website: WAVE Tools
  • You can use the WAVE Firefox and Chrome extensions to test directly within the web browser (preferred method) WAVE Chrome & Firefox Extensions

WAVE is a suite of evaluation tools that helps authors make their web content more accessible to individuals with disabilities. WAVE can identify many accessibility and WCAG errors, as well as facilitate human evaluation of web content. Just remember that no automated test tool is able to check all your website's accessibility.

Next is Axe (by Deque Systems)

  • From their write up - "Accessibility checker for WCAG 2 and Section 508 accessibility. Find accessibility defects on your website or web application by using the axe™ Chrome extension.” It works inside the Chrome developer tools.
  • It does similar things as the WAVE tool. I prefer the WAVE extension, but if you have a dev background you might like this one better.

Third is Figma Plugins! - There is a collection of accessibility-related plugins recommended from the Figma blog. There's little video previews of how each one works.

Here is a video called "How do I test my website for accessibility" (Youtube - 1h 46m video) - by Claudio Luís Vera

Lastly, if anybody has a good color blindness testing add-on or extension I'd appreciate it. I have used NoCoffee Vision Simulator but the 'color deficiency' does not work for me anymore in Firefox.

Writing Good Alt Text

Focus on relevant images: Alt text isn't needed for decorative images or those purely for layout. Learn how to mark them as "empty" for screen readers. WebAIM offers a great guide on writing effective alt text. WebAIM's Guide to Writing Alt Text.

Back to top