Testing for IMG markup using the WAVE Web Accessibility Toolbar
The WAVE accessibility toolbar is a free web accessibility evaluation tool provided by WebAIM. It is used to aid humans in the web accessibility evaluation process. Rather than providing a complex technical report, WAVE shows the original web page with embedded icons and indicators that reveal the accessibility of that page.
- Provides a visualization of the accessibility of a web page through the use of inline icons
- Requires manual inspection
- Does not provide a listing of errors
- Sometimes symbols are omitted on the page
Step 1: Enter the URL of the Page to Evaluate
- Load the page to be tested in your browser window.
- Click on the “Errors, Features and Alerts” button on the WAVE toolbar.
Step 2: Identify Icons Associated with alt text information
- Identify icons used to identify the alt text:
* Alt text present
* Alt text link
* Image input alternative text
* Null or empty alternative text
* Null or empty alternative text on spacer
* No alt text
* No alt text for linked image
* Image input missing alternative text
* Very long alternative text
- Use the tool tips to display the image meaning or click on the image key link on the toobar.
- Use the image icons to verify that every image element has an alt attribute. (Noninformational images should have null or empty values.)
- Verify that every informative image element has meaningful alt text containing 7 to 90 characters. Alt text will be displayed after the image and the alt text icon. The “very long alt text” icon will flag alt text longer than 100 characters.
- Verify that the alt attribute does not include the file name of the image.
- Verify that the alt attribute does not contain information that is redundant with the img element. For example, avoid using words like “image”, “picture”, “graphic”, “photo” and “photograph”.
Rules Evaluated with this Technique
Descriptions should be meaningful and contain at least 7 and less than 90 characters.