Web Browser Tools
Browser-based evaluation tools offer developers the opportunity to test pages in real-time and identify potential accessibility issues. Two common browser-based solutions that can check a page for accessibility issues include Deque's aXe extension and WebAIM's WAVE toolbar. While both tools can be helpful in evaluating page content for technical accessibility issues, it is important to recognize that these tools do not indicate if a person using assistive technology will have success when interacting with the page.
WAVE Toolbar from WebAIM
The WAVE toolbar is a free tool and available for Chrome and Firefox browsers evaluates a single page within the browser. Icons are used to visually identify the location of errors, alerts, or contrast issues on the page. By selecting an icon, the specific accessibility issue will be identified along with any alerts (i.e., warnings), accessibility features, and HTML structural elements.
The WAVE toolbar also offers a code view to identify the location of the potential accessibility issue within Document Object Model view of the page. This can be helpful when an error is identified in WAVE, but is not visually apparent.
Deque aXe Extension
- aXe Extension (Firefox)
- aXe Extension (Chrome)
The aXe extension is a free tool and available for both the Firefox and Chrome web browsers. In order to begin evaluating a page, you perform a right-click and choose Inspect Element. Once in the code view, you may select aXe and press the Analyze button. aXe will review the page contents for potential accessibility issues and identify these in the developer interface. The following YouTube video provides additional information on using the aXe extension.