Simple Accessibility Testing




Color Contrast

W3C Checkpoint 2.2 - Ensure that foreground and background color combinations provide sufficient contrast when viewed by someone having color deficits or when viewed on a black and white screen.

Two colors provide good color visibility if the brightness difference and the color difference between the two colors are greater than a set range.

The range for color brightness difference is 125. The range for color difference is 500.


Color - cont.


Types of Color Blindness



Color blindness Checker

Free Testing Tools


When running accessibility tests make sure to use more than one validator, since not all errors or issues will be found by all of them.


Usability and Accessibility should come before validation.

Free Testing Tools - Cont.

Free Checkers

Use Your Brain

“Click here”, “Read more”, etc.


Don't do it!

Individuals using screen readers can look at a list of all the links on a page out of context. So if they keep hearing “click here” over and over again it makes no sense to them.

Another good reason is that your not getting added Google juice as they say by making the link text relevant to the link.

Poor example

Click here to review the Acme TNT companies annual report.

Good example

Please review the Acme TNT companies annual report.

Use Your Brain - cont.


Use headers - H1, H2, H3, H4, H5, and H6.

This will allow people using screen readers to skip around to the important parts of the page using key combinations.

Book Title - h1

Use Your Keyboard


Most CSS only have “a:hover” in them for changing the background color or adding or removing underline for links, when they should have “a:focus” (other browsers) and “a:active” (IE).

a:hover, a:focus, and a:active

Where ever you have “hover” (a:hover) you should also have “focus” (a:focus) and “active” (a:active).

CSS Example

#nav a {
background: #ACC7FF;
text-decoration: none;

#nav a:hover, #nav a:focus, #nav a:active {
background: #BEFF9E;
text-decoration: underline;

An example of a:“hover”, a:“focus”, and a:“active” in action.

Screen Readers and Voice Recognition

Screen Readers

Voice Recognition


Resources - cont.

Resources - cont.


Contact Information

“It’s only words and photos on the internet”


Accessibility Resources