Web Accessibility

• Web Accessibility In Mind. An accessibility analysis of the top 1,000,000 home pages. Includes home page lookup and option to Analyse the Page in WAVE.

• WAVE: Web Accessibility Evaluation Tool. WAVE is developed and made available as a free community service by WebAIM. Originally launched in 2001, WAVE has been used to evaluate the accessibility of millions of web pages.

Website recommendations:

Text

• Use clear fonts and don’t mix different font types. Select a font that is easy to read online.
• Use emphasis – bolding, italicizing, and changing the color of text – sparingly. 
• Don’t use all caps for emphasis. This can cause difficulty for users of screen readers.
• Don’t use underlines for emphasis. Users will think an underline is a hyperlink.
• To make text larger, use headings rather than increasing the font size.
• Don’t rely on changing text color to emphasize text. Color won’t be useful for all users, and is usually unavailable to screen reader users.
• If you change your font color, make sure there is a strong contrast between your font and the background.

Headings and Lists

“Headings, lists, and other structural elements provide meaning and structure to web pages. They can also facilitate keyboard navigation within the page” (WebAIM: Principles of Accessible Design).

1. Use the Rich Text Headings to provide structure for your text and to make it easier for users to navigate your page.
2. Higher level Headings should be placed above lower level ones otherwise your hierarchy gets confused. Here is an example:
   • H3
     • H4
     • H4

Images, videos, and links

1. Include descriptive and appropriate alt text (ALT tags) for your images. Find out more about how to use alternative text.
2. Don’t use an image if the subject of the image is just text.
3. Provide captions and/or transcripts for videos.
4. Make sure your linked text makes sense out of context. Avoid using words or phases like “click here,” “more,” or “click for details” in front of links.

Tables

1. Avoid using tables for layout purposes whenever possible.
2. Use tables mainly to display data that fits well into rows and columns.
3. Tables that are used to organize tabular data should have appropriate table headers (the <th> element). Learn more about creating accessible tables.
4. Add table caption and summary to provide more information about the table for screen reader to pick it up.
5. Avoid spanned rows as screen readers may not properly parse them.