Accessible Web Design
Most people today can hardly conceive of life without the Internet. It provides access to information, news, email, shopping, and entertainment. At the click of a mouse, the world can be "at your fingertips"-that is, if you can use a mouse . . . and if you can see the screen . . . and if you can hear the audio-in other words, if you don't have a disability of any kind.
The most universal format for perceivability is text, because it can be transformed into light for the eyes (on a computer screen), sound for the ears (through a screen reader), and Braille for the hands (through a Braille display).
The following resource table below, originally developed by Paul Bohman of , will help you in your future endeavors to try to implement principles of accessibility in your work. For a more updated and informative list, go to from the Trace Center at the University of Wisconsin-Madison.
Common Web Accessibility Challenges and Solutions
Challenges
|
Solutions
|
Images, photos, graphics are unusable.
|
Provide text descriptions, in "alt" tags and, if necessary, longer explanations (either on the same page or with a link to another page).
|
Users often listen to the Web pages using a screen reader.
|
Allow for users to skip over navigational menus, long lists of items, ASCII art, and other things that might be difficult or tedious to listen to.
|
Users often jump from link to link using the TAB key.
|
Make sure that links make sense out of context ("click here" is problematic).
|
Users generally do not use a mouse.
|
Don't write scripts that require mouse usage. Supply keyboard alternatives.
|
Not all screen readers support image maps.
|
Supply redundant text links for hot spots in image maps. |
It may be difficult for users to tell where they are when listening to table cell contents
|
Provide column and row headers (<th>). Make sure that tables--especially those with merged cells--make sense when read row by row from left to right. |
Complex tables and graphs that are usually interpreted visually are unusable.
|
Provide summaries and/or text descriptions.
|
Frames cannot be "seen" all at once. They must be visited separately, which can lead to disorientation.
|
Don't use frames unless you have to. If you use them, provide frame titles that communicate their purpose (e.g. "navigational frame", "main content").
|
Colors are unusable. |
Do not rely on color alone to convey meaning.
|
Users expect links to take them somewhere.
|
Don't write scripts in links that don't have true destinations associated with them (e.g. href="javascript: function(this)").
|
Challenges | Solutions |
---|---|
Reds and greens are often indistinguishable.
|
Avoid juxtaposing these colors.
|
Other colors may be indistinguishable.
|
Make sure that there is sufficient contrast, and that the pages would be readable on a black and white monitor. To simulate this, print your Web page to a black and white printer.
|
Challenges | Solutions |
---|---|
Users often use screen enlargers.
|
To reduce that amount of horizontal scrolling, use relative rather than absolute units (e.g. use percentages for table widths instead of pixels).
|
Text in graphics does not enlarge without special software, and looks pixelated when enlarged.
|
Limit or eliminate text within graphics.
|
Challenges | Solutions |
---|---|
Audio is unusable.
|
Provide transcripts for audio clips.
Provide synchronous captioning for video clips. |
Challenges | Solutions |
---|---|
Users may not be able to use the mouse.
|
Make sure that all functions are available from the keyboard (try tabbing from link to link).
|
Users may become fatigued when using "puff-and-sip" or similar adaptive technologies.
|
Provide a method for skipping over long lists of links or other lengthy content.
|
Users may be using voice activated software.
|
Voice-activated software generally cannot replicate mouse movement, so make sure that all functions are available from the keyboard.
|
Users may not be able to control the mouse or the keyboard well.
|
Voice-activated software generally cannot replicate mouse movement, so make sure that all functions are available from the keyboard.
|
Users may not be able to control the mouse or the keyboard well.
|
Make sure that your pages are error-tolerant (e.g. ask "are you sure you want to delete this file?"), do not create small links or moving links.
|
Challenges | Solutions |
---|---|
Users may become confused at complex layouts or inconsistent navigational schemes.
|
Simplify the layout as much as possible.
Keep the navigational schemes as consistent as possible. |
Users may have difficulty focusing on or comprehending lengthy sections of text.
|
Where appropriate, group textual information under logical headings. Organize information in manageable "chunks."
|
One method of input may not be sufficient.
|
Where appropriate, supplement text with illustrations or other media, and vice versa.
|