WAVE Toolbar for Firefox
It is essentially identical to the online WAVE Webpage Accessibility Evaluator, but allows a user to test password protected pages, preview pages or unposted .html files.
The primary evaluation function of the WAVE toolbar is the Errors, Features, and Alerts button.
This function displays your Web page with icons indicating accessibility features, errors, and alerts (elements that require human evaluation), as well as structural and semantic elements. By viewing your Web page with these icons embedded, you can easily determine any potential accessibility issues.
Example WAVE Output wIcons
For example, in the screen capture below, the toolbar found a number of issues with an HTML form, including:
- A form with several input fields missing the LABEL tag (indicated with a red no-label icon)
- An empty
<h2>tag (indicated with a blue H2 icon plus a red warning icon).
- The blue table icon also indicates the form is enclosed in a layout table
The WAVE Web site contains a comprehensive list of the accessibility icons, complete with descriptions and explanations of each.
Note: WAVE is not tied to WCAG 2.0 guidelines. However, WAVE's criteria for an accessible Web page are generally accepted best practices.
The Structure/Order function displays your Web page with graphics emphasizing its structure and reading order. This function allows you to quickly determine whether your page's reading order is logical, and therefore whether the page will make sense when read by a screen reader or viewed with style sheets disabled.
The Text-only function displays only the text-based elements of your Web page, including any text alternatives provided for graphical or other non-text content. This function can give you a general idea of the content that will be read by a screen reader.
The Outline function displays only the headings on your Web page, which can help you determine if the headings are properly nested, and if the structure of the page's content is logical.
The Disable Styles function will turn off style sheets for the current Web page. Some users, including those with visual impairment, may view the Web with style sheets disabled, so this function is useful for testing a Web page's overall accessibility, including the semanticism of the markup.