Skip to content
- Use headings when defining the structure of your document. Check your document structure with the HeadingsMap Add-On. To make your page even more accessible, add ARIA Landmarks.
- When selecting a color palette for your site, ensure that your color combinations are accessible. For spot checking color contrast issues, use the WCAG Contrast Checker in conjunction with ColorZilla.
- Use the W3C Validator to check for basic code errors. Assistive technologies need to have valid code, too.
NOTE: If you use ARIA attributes, your page might not fully validate. This is OK, since ARIA attributes are adding more accessibility, and assistive technologies know how to handle them.
- Make sure all images have alternative text.
- Make sure all media have accompanying transcripts or synchronized captions, as appropriate.
- Check individual pages for accessibility errors with the WAVE Toolbar.
- View a text-only version of the page using the WAVE Toolbar’s text-only view. Make sure the reading order makes sense. The advantage of this tool over simply turning off CSS is that it will correctly linearize tables to show the correct reading order.
- Unplug your mouse and try to navigate the entire page, including menus, sub-menus, and all links.
Before testing, Mac users must first set System Preferences > Keyboard > Full Keyboard Access > All controls.
- To check for all errors at once, use SortSite. To get a personal copy contact email@example.com.
- ARIA Landmarks Tutorial
- W3C Validator
- WAVE Toolbar
- Accessibile Color Palette Evaluator
- WCAG Contrast Checker