Using WAVE
Article Contents
The Purpose of WAVE
WAVE is a web-based tool to help web developers make their web content more accessible. WAVE does not substitute for human evaluations. In fact, no automated tool can. Because web accessibility is best evaluated subjectively, WAVE is most effective when used by someone knowledgeable about web accessibility. WAVE facilitates this kind of subjective evaluation by exposing many kinds of accessibility errors in the content, as well as possible errors, accessibility features, semantic elements, and structural elements. Once these elements are exposed, knowledgeable Web developers can decide what changes need to be made, if any.
People who are not web accessibility experts can also benefit from WAVE by referring to the summary report which WAVE displays after processing the page. This report summarizes the number of errors, possible errors, and so on. A quick glance at the icon view of the report can also be informative, because the icons are color coded, with red icons representing errors and yellow icons representing possible errors. Other types of icons also have specific colors assigned to them.
Using WAVE
Note
The instructions below refer to the Development Version of WAVE, because of the extra functionality which this version offers over the current stable release. Some of the specific features and interface elements are subject to change.
To use WAVE, open a web browser and go to the WAVE home page - external link. The WAVE home page is shown in the screenshot below.
Type in the web address of the page you wish to evaluate (in the text box beneath "Method 1"), and click on the "WAVE this page!" button. Once you have done this, you will see some tabs across the top of the page which represent the different types of views within WAVE. The four views are the ICON View, the TEXT View, the OUTLINE View, and the REPORT View.
ICON View
In the ICON View, WAVE first inserts a summary report of the errors, possible errors (called "alerts" in WAVE), accessibility features, and structural and semantic elements.
This summary is useful for reporting purposes, but the most useful feedback occurs below this report, in the main part of the ICON View. In the main part of the icon view, WAVE inserts informative, color-coded icons and commentary within the web content. These icons and commentary provide guidance to developers. In the screenshot below, red and yellow icons have been inserted into the context of the web page, representing accessibility errors and alerts, respectively.
Understanding the feedback in the Icon view
The RED icons identify web accessibility errors
in web pages, such as missing alt (alternative)
text for images, missing form labels, frames without titles, etc.
The YELLOW icons identify possible errors, which WAVE classifies as alerts. For example, some types of alt text are inappropriate or inadequate, even though they technically satisfy the requirement to have alt text. When WAVE flags parts of the content as alerts, it is up to the user to determine whether these alerts constitute true errors which must be fixed or false alarms which can be ignored.
The GREEN icons identify the page's accessibility features. Users should take a close look at these accessibility features to ensure that they are accurate. In some cases, items that are flagged as accessibility features are really examples of accessible markup used inappropriately, such as when developers provide 'null' alt text for images that should contain meaningful alt text. Both null alt text and meaningful alt text are considered accessibility features, but when used inappropriately, they are actually errors, and should be corrected.
The LIGHT BLUE icons identify structural and semantic elements within web content. Examples of structural elements include headings, bulleted lists, data tables, and layout tables. Examples of semantic elements include emphasized text and strongly emphasized text. Structural and semantic elements can increase the accessibility of web content, when used appropriately. Users should look closely at the structural and semantic elements to determine whether they are displaying properly on the page.
A full explanation of icons - external link provides detailed information about the meaning of each of the icons, and recommendations on what to do when these icons appear.
TEXT View
Note
The TEXT View of WAVE is still under development.
This view shows only the text (including alt
text for images) of the web content and the form elements. All of the
visual formatting elements are disabled, to simulate the linearized, non-visual
experience of using a screen reader. However, headings are shown in large,
bold text because screen readers can recognize heading structure.
OUTLINE View
The OUTLINE View isolates just the headings of web content. This allows web developers to evaluate the heading structure and hierarchy within the web content. Effective headings help to organize content into manageable sections, or chunks, of information which can improve readability. The screenshot below shows an outline with three levels of headings embedded properly in a hierarchy.
If the document has no headings, WAVE tells the user "This document has no outline because no headings are specified."
REPORT View
The REPORT View is still under development, but when completed will feature more advanced reporting capabilities. Even people with little technical experience can make use of the reporting features to obtain a snapshot of the page's accessibility status. These reporting capabilities can help determine the degree to which web content complies with web accessibility laws and regulations.
Advertisements
WebAIM is an initiative of:
