Ten Quick Tests to Check your Web Site for Accessibility
Posted on: 18 July 2004
The DDA (Disability Discrimination Act) says that web sites must be made accessible to disabled people. So how can you check that your web site is up to par? There are a number of basic tests you can make to address some of the main issues. The following list includes guidelines that provide a good start in increasing accessibility to disabled people:
1. Check informational images for alternative text
Place the cursor over an informational image, for example, the organisation logo. Does a yellow box [or another colour, depending on your computer's set-up - ed] appear with a brief, accurate description of the image? For users whose browsers do not support images, this alternative text is what they will see (or hear) in place of the image.
2. Check decorative images for alternative text
Place the cursor over a decorative image that does not have any function other than to look nice. Does a yellow box appear with a description of the image? It should not. There is no reason for users whose browsers do not support images to know that this image is there, as it serves no purpose.
Be careful though as this is not a fool-proof test. If a yellow box does not appear, this could mean one of two things:
- The alternative text of the image is assigned a null value -
alt=""
- which means that it will be ignored by browsers that do not support images. This is the ideal scenario. - The alternative text of the image is simply not set at all, which means that users whose browsers do not support images will be alerted to its existence but will be unable to find out what purpose it carries - something which is very frustrating! This is certainly not the desired outcome.
3. Listen to any video or audio content with the volume turned off
If you turn your speakers off, you are clearly unable to listen to, or follow, any audio content. This situation is faced by a deaf person on a daily basis. Ensure your web site supplies written transcripts for all audio content, so that deaf people can understand the message that your web site is conveying.
4. Check that forms are accessible
Usually there is prompt text next to each item in a form. For example,
a contact form might have the prompt text 'name', 'e-mail', and 'comments',
each one next to a box where your site users will enter the information.
When you click on the prompt text, does a flashing cursor appear in the
box next to that text? If not, your forms are missing the <label>
element and may be inaccessible for some users (try this WaSP
tutorial for more information about accessibility in forms).
5. Check that text can be resized
In Internet Explorer (used by over 90% of Internet users) go to View > Font size > Largest. Does the text on your web site increase in size? If not, then your web site is likely to be inaccessible to web users with poor visibility.
6. Check your web site in the Lynx browser
The Lynx browser is a text-only browser and does not support many of the features that other browsers such as Internet Explorer have. You can check how your site looks in this browser with the Lynx Viewer.If your web site makes sense and can be navigated through the Lynx browser, then it will be fulfilling many of the web accessibility guidelines. Lynx could be considered a 'lowest common denominator', therefore.
7. Check that you can access all areas of your web site without the use of a mouse
Can you navigate through your web site using just tab, shift-tab and return? If not, then neither can keyboard- and voice-only users. Throw your mouse to one side and see how well you fare.
8. Check that there is a site map
Can you find a site map? If not, then neither can people who are lost on your web site.
9. Ensure link text makes sense out of context
Blind Internet users often browse web sites by tabbing from one link to
the next. Does all the link text on your web site make sense out of context?
'Click here' and 'more' are two common examples of non-descriptive link
text. If you are forced to use small phrases for link text, consider using
the title
attribute in the a
element to provide
more information, e.g.: <a href="interest.html" title="Interest
rates for the super savings account">Interest Rates</a>
10. Check your web pages with an automated program
Two programs available for free on the Internet are Bobby and Wave. They are unable to provide you with all the information that you need, as some checks must be done by humans, but they can tell you some of the areas where your site might be going wrong.
This article was written by Trenton Moss. He's crazy about web accessibility and usability - so crazy that he went and started his own web accessibility and usability consultancy, Webcredible, to help make the Internet a better place for everyone.