When designing web sites and portals make sure to also address general accessibility issues governed for instance by the WCAG 2.0 – Web Content Accessibility Guidelines.
WCAG 2.0 – Web Content Accessibility Guidelines
Basically, the WCAG is composed of three priority levels:
- Level A (beginner),
- Level AA (intermediate)
- Level AAA (advanced)
Each level adds additional requirements concerning the four guidelines principles
- perceivable
- operable
- understandable
- robust
Perceivable (section 1.1 Text alternatives through 1.4 Distinguishable) defines that
Information and user interface components must be presentable to users in ways they can perceive.
Operable (section 2.1 Operable through 2.4 Navigable) makes sure that
User Interface components and navigation must be operable.
Understandable (section 3.1 Readable through 3.3 Input Assistence) defines that
Information and the operation of user interface must be understandable.
Robust (section 4.1 Compatible) finally makes sure that
Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.
WCAG 2.0 – Checklists
Below you find checklists for each WACG level published by Luke McGrath that outlines the guidelines to make websites WCAG conformant. Following the checklist for each of the levels you find online tools that enable you to check websites for conformance.
WCAG 2.0 – Checklist Level A (Beginner)
| Guideline | Summary |
| 1.1.1 – Non-text Content | Provide text alternatives for non-text content |
| 1.2.1 – Audio-only and Video-only (Pre-recorded) | Provide an alternative to video-only and audio-only content |
| 1.2.2 – Captions (Pre-recorded) | Provide captions for videos with audio |
| 1.2.3 – Audio Description or Media Alternative (Pre-recorded) | Video with audio has a second alternative |
| 1.3.1 – Info and Relationships | Logical structure |
| 1.3.2 – Meaningful Sequence | Present content in a meaningful order |
| 1.3.3 – Sensory Characteristics | Use more than one sense for instructions |
| 1.4.1 – Use of Colour | Don’t use presentation that relies solely on colour |
| 1.4.2 – Audio Control | Don’t play audio automatically |
| 2.1.1 – Keyboard | Accessible by keyboard only |
| 2.1.2 – No Keyboard Trap | Don’t trap keyboard users |
| 2.2.1 – Timing Adjustable | Time limits have user controls |
| 2.2.2 – Pause, Stop, Hide | Provide user controls for moving content |
| 2.3.1 – Three Flashes or Below | No content flashes more than three times per second |
| 2.4.1 – Bypass Blocks | Provide a ‘Skip to Content’ link |
| 2.4.2 – Page Titled | Use helpful and clear page titles |
| 2.4.3 – Focus Order | Logical order |
| 2.4.4 – Link Purpose (In Context) | Every link’s purpose is clear from its context |
| 3.1.1 – Language of Page | Page has a language assigned |
| 3.2.1 – On Focus | Elements do not change when they receive focus |
| 3.2.2 – On Input | Elements do not change when they receive input |
| 3.3.1 – Error Identification | Clearly identify input errors |
| 3.3.2 – Labels or Instructions | Label elements and give instructions |
| 4.1.1 – Parsing | No major code errors |
| 4.1.2 – Name, Role, Value | Build all elements for accessibility |
WCAG 2.0 Level A basically makes sure that the content is accessible based on the four main principles perceivable, operable, understandable and robust. As stated above levels AA and AAA add additional requirements to these principles which are outlined below.
WCAG 2.0 checklist Level AA (Intermediate)
| Guideline | Summary |
| 1.2.4 – Captions (Live) | Live videos have captions |
| 1.2.5 – Audio Description (Pre-recorded) | Users have access to audio description for video content |
| 1.4.3 – Contrast (Minimum) | Contrast ratio between text and background is at least 4.5:1 |
| 1.4.4 – Resize Text | Text can be resized to 200% without loss of content or function |
| 1.4.5 – Images of Text | Don’t use images of text |
| 2.4.5 – Multiple Ways | Offer several ways to find pages |
| 2.4.6 – Headings and Labels | Use clear headings and labels |
| 2.4.7 – Focus Visible | Ensure keyboard focus is visible and clear |
| 3.1.2 – Language of Parts | Tell users when the language on a page changes |
| 3.2.3 – Consistent Navigation | Use menus consistently |
| 3.2.4 – Consistent Identification | Use icons and buttons consistently |
| 3.3.3 – Error Suggestion | Suggest fixes when users make errors |
| 3.3.4- Error Prevention (Legal, Financial, Data) | Reduce the risk of input errors for sensitive data |
WCAG 2.0 checklist Level AAA (Advanced)
| Guideline | Summary |
| 1.2.6 – Sign Language (Pre-recorded) | Provide sign language translations for videos |
| 1.2.7 – Extended Audio description (Pre-recorded) | Provide extended audio description for videos |
| 1.2.8 – Media Alternative (Pre-recorded) | Provide a text alternative to videos |
| 1.2.9 – Audio Only (Live) | Provide alternatives for live audio |
| 1.4.6 – Contrast (Enhanced) | Contrast ratio between text and background is at least 7:1 |
| 1.4.7 – Low or No Background Audio | Audio is clear for listeners to hear |
| 1.4.8 – Visual Presentation | Offer users a range of presentation options |
| 1.4.9 – Images of Text (No Exception) | Don’t use images of text |
| 2.1.3 – Keyboard (No Exception) | Accessible by keyboard only, without exception |
| 2.2.3 – No Timing | No time limits |
| 2.2.4 – Interruptions | Don’t interrupt users |
| 2.2.5 – Re-authenticating | Save user data when re-authenticating |
| 2.3.2 – Three Flashes | No content flashes more than three times per second |
| 2.4.8 – Location | Let users know where they are |
| 2.4.9 – Link Purpose (Link Only) | Every link’s purpose is clear from its text |
| 2.4.10 – Section Headings | Break up content with headings |
| 3.1.3 – Unusual words | Explain any strange words |
| 3.1.4 – Abbreviations | Explain any abbreviations |
| 3.1.5 – Reading Level | Users with nine years of school can read your content |
| 3.1.6 – Pronunciation | Explain any words that are hard to pronounce |
| 3.2.5 – Change on Request | Don’t change elements on your website until users ask |
| 3.3.5 – Help | Provide detailed help and instructions |
| 3.3.6 – Error Prevention (All) | Reduce the risk of all input errors |