Designing for disability

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 colour 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 colours carefully

Doctors estimate that roughly one in every 12 males in the United States has some degree of colour blindness. You'll improve legibility for everyone by using high-contrast colour schemes (for example, black text on a white background) for text-intensive pages. Since the most common form of colour blindness by far is red-green colour blindness, avoid placing these colours next to one another on your page. And whatever you do, don't make colour 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 \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. SMIL is supported best by RealNetworks Inc.'s ( RealSystem G2. Apple Computer Inc.'s QuickTime ( 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 ( ) 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.

Join the newsletter!


Sign up to gain exclusive access to email subscriptions, event invitations, competitions, giveaways, and much more.

Membership is free, and your security and privacy remain protected. View our privacy policy before signing up.

Error: Please check your email address.
Keep up with the latest tech news, reviews and previews by subscribing to the Good Gear Guide newsletter.

Jim Heid

PC World
Show Comments

Brand Post

Most Popular Reviews

Latest Articles


PCW Evaluation Team

Tom Pope

Dynabook Portégé X30L-G

Ultimately this laptop has achieved everything I would hope for in a laptop for work, while fitting that into a form factor and weight that is remarkable.

Tom Sellers


This smart laptop was enjoyable to use and great to work on – creating content was super simple.

Lolita Wang


It really doesn’t get more “gaming laptop” than this.

Jack Jeffries


As the Maserati or BMW of laptops, it would fit perfectly in the hands of a professional needing firepower under the hood, sophistication and class on the surface, and gaming prowess (sports mode if you will) in between.

Taylor Carr


The MSI PS63 is an amazing laptop and I would definitely consider buying one in the future.

Christopher Low

Brother RJ-4230B

This small mobile printer is exactly what I need for invoicing and other jobs such as sending fellow tradesman details or step-by-step instructions that I can easily print off from my phone or the Web.

Featured Content

Product Launch Showcase

Don’t have an account? Sign up here

Don't have an account? Sign up now

Forgot password?