Accessible Websites & Web Apps

Preparing to Test for Accessibility

Components of an Accessibility Test

Keyboard Navigation
Non-Visual Navigation with a screen reader
Alternate Visual Access (low vision/colorblind)
Usability (cognitive/learning disability)
Multimedia Access
Downloadable Files

Testing Tools Needed

Keyboard
Automated testing using WAVE Toolbar, Siteimprove browser plugin or other browser extension
Screen reader (and knowledge of how it works). Examples include: JAWS, NVDA (Windows), VoiceOver (Mac) and Narrator (Windows)
Color contrast check using Color Contrast Analyser or some other checker

Step 1: Pre-Test Planning: Web Accessibility Testing Checklist

What portions of the Web Content Accessibility Guidelines (WCAG) apply to your website/application?

Web Accessibility Testing Checklist

Step 2: Documenting Your Test: Web Accessibility Evaluation Report

How can I record my accessibility findings to share with those who complete the accessibility remediation?

Testing Tips

Build web accessibility testing early in to your development process and ongoing maintenance.
Keep in mind, automated tools catch about 30-50% of accessibility errors. Using automated tools coupled with manual testing is required.
Become familiar with implementing the standards:

Testing Web Content for Accessibility – overview of methods in testing
Manually navigate your pages and forms without a mouse, using only your keyboard. Lose The Mouse Challenge
Gain the user’s perspective on typical design issues. WebAIM offers the User Perspective

Testing Tools

Test with automated web accessibility toolbars to catch some of the errors. These will typically catch anywhere from 10-30% of the errors, sometimes more. Ensure you get “Errors” down to zero and review alerts as well.

WebAIM WAVE Browser Extension- Chrome (contrast checking option included) Help Resource
WebAIM WAVE Browser Extension – Firefox
Siteimprove Platform: Help Documentation
WebAIM WAVE online checker
Most automated tools can catch color contrast issues but a manual review of the results is usually needed to confirm no false positives.

Use different approaches for evaluating websites for accessibility. The World Wide Web Consortium (W3C) Accessibility Evaluation Resources

Here’s a good place to start to learn about accessibility checking

Use a disability simulator that helps designers ensure that their content and applications are accessible and usable by the visually impaired. aDesigner is a tool that web authors can use to ensure that the webpages they create are accessible to individuals who are blind or visually impaired. aDesigner disability simulator
The Paciello Group offers resources for testing an inclusive design groups. The Paciello Group

JAWSInspect – This is a fee based checker to simplify testing for screenreader accessibility, without using a screen reader.

Mobile Accessibility

Learn about mobile device accessibility guidelines. Mobile/App Accessibility

Assistive Technology

Testing web sites and applications using assistive technologies offers you a lot of benefits. You get to learn some of the tools that people with disabilities use to navigate technology, which is incredibly informative. You also get better insight into the true, functional accessibility of the site or application.

Visit our Users & Technology page to learn more about assistive technology.

Want a demonstration of what IS and is NOT an accessible web page?

Here are websites that show the differences, both in presentation and in structure, between accessible and inaccessible web pages. Use these to practice your website accessibility testing and experiment with different AT devices.

Accessible University

W3C

The World Wide Web Consortium (W3C) Before and After Demo (BAD)

We need your feedback!

In order to improve the effectiveness of the content on this page, please give us feedback! What do you like? Don’t like? Are the testing forms helpful? We want to hear from you!

Provide Feedback

Have a resource for ICT Accessibility to share with us?

Share It With Us