Given the graphical nature of the Web, it isn’t surprising that blindness presents the most accessibility challenges. But maneuvering through Web sites also can be difficult for users with less severe visual impairments or other physical disabilities. Here are some additional accessibility issues to keep in mind when designing your Web site.
Compensating for Vision Impairments
Numerous forms of visual impairment exist, ranging from color blindness to glaucoma to the reduced visual acuity Father Time brings to us all. While these users can still read the screen, navigating through wild color schemes and screens of tiny text can still be challenging. A few simple design choices on your part can make using your site easier for everyone.
Choose colors carefully. Doctors estimate that roughly one in every 12 males in the United States has some degree of color blindness. You’ll improve legibility for everyone by using high-contrast color schemes (for example, black text on a white background) for text-intensive pages. Since the most common form of color blindness by far is red-green color blindness, avoid placing these colors next to one another on your page. And whatever you do, don’t make color a cornerstone of your navigation scheme — relying, for example, on a green button to continue and a red button to stop.
Enable layouts to be resized. Users with poor eyesight may want to enlarge the text on your Web site. You can enable page text to be resized by the reader without sacrificing the overall integrity of your design by using Cascading Style Sheets and by specifying type sizes and layout values in ems rather than specific pixel values.
An em is a relative unit of measurement; in the Web world, one em is equal to the browser’s current default size. Since most current browsers default to 12-point type, one em is normally equal to 12 points. This means that if you want 12-point body type, you might write a style sheet that looks in part like this:
body { color: black; font-size: 1em; line-height: 1.2em; font-family: Verdana } To then create headlines that are larger than your body text, you may assign them a value of 9 ems. Now if a visitor sets his or her browser to a default point size of 18, the sizes of your body and headline text will increase accordingly. If, on the other hand, you specify size values in pixels (for example,
font-size: 12px), the text won’t resize.
Multimedia for the Hearing Impaired
If multimedia with sound plays a large role on your site, there are steps you can take to make it more accessible to users with hearing impairments–as well as those who keep their computer’s sound turned off.
The easiest solution is to add captions to your multimedia movies. The SMIL markup language, which enables you to combine audio, video, static images, and text is ideal for captioning (see ” SMIL: Markup for Multimedia,” Macworld, February 2000). SMIL is supported best by RealNetworks’ ( www.real.com ) RealSystem G2. Apple’s QuickTime ( www.apple.com ) offers a text tracks feature which also lets you add closed captions to movies.
A free tool named MAGpie makes it easy to add captions to QuickTime, RealNetworks, and Windows Media content.
Easy Keyboard Access
Users with severe Repetitive Stress Injury, arthritis, or other physical limitations must avoid using their hands whenever possible. This can make moving a mouse around Web pages a painful — if not impossible — task. Thankfully, today’s browsers let users navigate the Web without laying a finger on the mouse. They can use the Tab key, for example, to move from one link to another and hit Return to open the selected link.
You can now take these accessibility features even further by establishing additional keyboard shortcuts specific to your Web site. Microsoft Internet Explorer version 4.0 and later ( www.microsoft.com ) supports HTML attributes that aid accessibility such as the accesskey attribute. With this attribute you can provide a keyboard shortcut for a specific link. For example, adding the code
accesskey="S"to a your Back to Home Page tag will allow users to select that link simply by pressing Alt-S (Windows) or Control-S (Mac).
If you add accesskey shortcuts throughout your site, be sure to tell your readers what they are. You may want to create a page titled “Instructions for Users with Disabilities,” which includes information about the shortcuts you’ve provided. Or, if you add accesskey shortcuts to only certain links (perhaps the links to the site map and home page), consider noting the availability of the shortcuts within the links themselves, such as: Go to home page (press Ctrl-H).
Test and Test Again
The best way to test your site’s accessibility is to try navigating it as your users must. For example, adjust your browser’s default font size and see how that affects your layouts. Or try navigating your site using just your keyboard. If you have trouble, there’s a good chance your users will as well.