Best Practices for Internally-Developed Digital Products
“When developing or redesigning a website or web application, evaluate accessibility early and throughout the development process to identify accessibility problems early, when it is easier to address them.” The World Wide Web Consortium’s (W3C) Web Accessibility Initiative (WAI) has a helpful evaluating web accessibility overview to help you get started, and the W3C accessibility standards overview introduces guidelines and other standards related to web accessibility.
Tools for Automated Testing
Note: Resources are listed from “easy to use” to “requires specialist knowledge.”
Third Party Browser Extensions
Automated accessibility testing cannot replace manual testing by an actual human being, but it can be a good first step.
- Accessibility Bookmarklets
Easy to use accessibility visualization toolkit to test websites or web-based programs by the University of Illinois
- WAVE Evaluation Tool Powered by WebAIM
(wave.webaim.org) provides a website and browser extension that will check the accessibility of a URL
- PAC 3 – Free PDF Accessibility Checker
The freeware program PAC provides a fast way to test the accessibility of PDF files
Browsers’ Built-in Accessibility Tools
Modern versions of major browsers have their own accessibility tools built into their developer tools. For more information, see the documentation for the tools available in your preferred browser.
- Chrome DevTools Accessibility Reference
Must have a basic understanding of DevTools
- Firefox Accessibility Inspector
The Accessibility Inspector provides a means to access important information exposed to assistive technologies on the current page via the accessibility tree. Must have basic knowledge of HTML.
- Microsoft Edge DevTools: Accessibility-testing features
Similar to Firefox Inspector, view the accessible properties assigned to the selected element. Must have a basic understanding of DevTools
- Colour Contrast Analyser
Easy to use free application, available for Windows and Mac. Check foreground & background color combinations using an eyedropper tool from anywhere on the screen, including non-web based applications
- WCAG Contrast Checker for Firefox
Firefox extension displays color contrast ratios in a sidebar, and flags the color combinations that fail WCAG contrast requirements.
- WebAIM Color Contrast Checker
Online tool includes a feature to “lighten” or “darken” existing colors until you find a combination that meets WCAG 2.1 requirements.
- Chrome High Contrast extension
High Contrast lets you browse the web with your choice of several high-contrast color filters designed to make it easier to read text.
Tools for Manual Testing
- #NoMouse Challenge
Manual testing can be completed by navigating through the page using only keyboard commands rather than a mouse. No special skills needed.
- NVDA Screen Reader
The NonVisual Desktop Access screen reader can be downloaded free of charge by anyone. Requires specialist knowledge.
Apple’s screen reader, which ships with Mac OS and iOS devices such as the iPhone and iPad. Requires specialist knowledge.
- WebAIM guide on Using VoiceOver to Evaluate Web Accessibility.
Jaws has been one of the most popular screen readers for many years, Jaws is not free, but anyone with a (dot) EDU email qualifies for the student annual licence pricing. Requires specialist knowledge.
- WebAIM guide on Using JAWS to Evaluate Web Accessibility