When designing a Web page, many developers try to make their pages viewable by various browsers. Very few, however, make their page accessible to people with disabilities. The W3C has recommended a set of guidelines to promote universal access to the blind, deaf and other users with special needs. This lengthy document explains all there is to know about Web page accessibility.
The W3C also offers a checklist to see if your site is accessible. This checklist is fairly long and has much more information than the average Web developer needs. Here are some minimum guidelines that should be followed in making ones Web page accessible.
The Alt-tag provides text description of a graphic which is not visible to the sighted user, but is invaluable in describing the image to a text-based user. For example:
<img src="images/logo_100.gif" alt="URI Logo">
Use simple text for simple images
"*" for a bullet, numbers for a numbered image, and a single space character or an empty string for invisible images that are typically used for spacing.
Provide an alternative text list of the hyperlinks
Take a look at the URI GSO Web site. It consists of both an imagemap-based and text-based navigation system.
Provide a separate text-only page
If necessary, provide a text-only page which translates all of the links within the image into text links.
Link text should be able to stand alone as a printable document. For example, instead of:
<a href="name.html">click here</a> for text-only versions of this page.
use the following:
Always use a space and a vertical bar to separate consecutive links
As text browsers read one line at a time, the problem of distinguishing between consecutive links on the one line arises. For such consecutive links on one line (usually found as text anchors, add a space and a vertical bar on either side of the links. This will also separate the links for visual users.
For example, instead of:
Use the following:
<body background="image.gif" bgcolor="#ffffff" link="990099" vlink="#009999" alink="#000099" text="#000000">
Without a complete definition of all the colors in the color scheme, the final rendering of colors could be a mix of the pre-defined colors and the defaults from the reader's browser. This could result in a combination of colors that create a low (possible unreadable) contrast.
Ensure that both the specified background color and the specified background image contrast well against the foreground text.
This contrast will enhance the readability of the information to sight-impaired users, such as those with color-blindness. Try to test your page in black and white mode.
This is because when word wrapping occurs within columns of a table, this creates problems for browsers such as Lynx (a text browser used by the sight-impaired) as it reads across the screen in a way that runs all of the text on a line together. If an entry in a cell occupies more than one line, the first line of each cell would be read, then the second, etc.
If word wrapping in a table cannot be avoided, the same information can be presented on an alternate text-only page without tables.
This can be achieved by incorporating the noframes tag, which is the default for browsers that cannot view frames. Even though current versions of Lynx are frames-capable, it is still prudent practice to offer non-framed alternatives to avoid a host of other possible problems.
For a Web page (frameset) that consists of two frames (left frame and right frame), you should supply the noframes tags in the frameset document.
<title>A Sample Frameset Document</title>
<frame src="left.html" name=left>
<frame src="right.html" name=right>
Please type in any information that provides alternative text for users who use frame incapable browsers.
Many users of the web are hearing-impaired or do not have sound capabilities on their computers. The inclusion of transcripts for audio clips broadens the access to this information. The use of descriptions such as "hear the speech or read the transcript" with "read the transcript" acting as the link to the transcript, is encouraged.
Non-standard formats often cause problems for Braille translation, screen readers and some browsers. Users should be able to switch back and forth between text-only and enhanced versions of the page.
For more information about Accessibility, please visit the following links:
Subscribe to the URI Web Publishing Blog for latest news, tips, resources and tools related to web technologies.
Subscribe to URIWEB-L Listserv to keep informed of ideas on web-related issues on campus.