Testing Links Using WAVE Toolbar
The WAVE Toolbar is a Firefox extension that evaluates a web page locally (meaning it evaluates dynamically-generated HTML instead of only source HTML) and shows accessible and non-accessible features through the use of icons and indicators embedded on the evaluated web page.
- Toolbar can evaluate any page viewable in a browser (password-protected, dynamically generated, locally served, etc)
- Icons allow for easy spotting of problem areas on a page
- Gives immediate visual feedback
- Shows problems for specific types of link issues (duplicate/extraneous/unusable out of context link text, broken or hidden skip navigation links, empty links)
- Shows where positive steps have been taken to provide accessible links (skip navigation)
- Easy to refresh and remove icons from page
- Adds a toolbar to Firefox browser
- Loads the page with embedded images – can be overwhelming
- Mouseover is only way to get more information about embedded icons on evaluated page and those sometimes are overlapped by other visual elements on page
- Lots of icons with lots of meanings – not easy to use
- No ability to test links only (always part of larger set of accessibility issues being evaluated)
- Only evaluates on page-by-page basis, no way to know if a problem on one page is the same throughout a web site/application
Step 1: Install WAVE Toolbar (Firefox only)
If toolbar is not installed in Firefox browser:
- Visit WAVE Toolbar website and follow instructions to download and install
Step 2: Find WAVE Toolbar in Firefox browser
- WAVE Toolbar should show above web page as part of browser menu
Step 3: Evaluate web page using WAVE Toolbar
- Visit web page in Firefox browser
- Click the “Errors, Features, and Alerts” button (next to WAVE menu button)
- Mouseover icons that appear on screen (red icons indicate definite problems and yellow icons indicate possible problems)
- Use the icons key to find out which icons indicate problems with links (also available as “Icons Key” toolbar button between “Disable Styles” and “Tools” buttons near the end of the toolbar)
- See also Using WAVE to Test Accessibility of Links for a list of link-specific icons
Rules Evaluated with this Technique
Link text content must indeicate the target of the link.
Link text should be meaningful when taken out of context; therefore, links that point to different URIs should be unique.
An image that is the entire content of a link should be at least 16×16 pixels in size.
The text content of a link should be at least 4 characters in length when rendered graphically.
The alt text for images that are part of links should not be the same as the text content of the link.
The first link on a page should be a skip navigation link.
Internal links need to set
Small links should not be placed close together.