How To Make Your Existing Web Site Accessible

Look, we're not going to lie to you. Much like being forced into the short sleeves and tight collar of your cousin's hand-me-down suit held together with a pin and a tuck, retrofitting an existing Web site is more work than building it right from the ground up, and the results aren't likely to be as good. Cutting a Web site from accessible cloth is always a preferable way to go, and if you have the resources, this option will be a better fit for your organization (see our article "Building Accessible Web Sites in Seven Steps .")

However, sometimes starting over isn't an option and your organization has to simply make do. The good news is that for most non-profits like yourselves, often running a smallish Web site devoid of the confines of super rich media, a retrofit isn't always so painful. For you, weaving in accessible tendencies will be easier than for other sorts of dense, flashy sites.

What Needs Doing?

The first thing your organization will want to do is run your Web site through some accessibility software to look for problems. There are commercial fix-it solutions available, but many free utilities do the job very well, such as Bobby or The Wave . If you have the capability, browse the site through a text reader such as JAWS, or a text browser such as LYNX, to learn what your site looks like to many of your users with sensory disabilities.

Turn the Page

Once you've tested your Web site, and even if you haven't, the following are some of the most common and most effective changes that will allow for smoother navigation and better access for all users, whether they are low- or no-vision or keyboard-reliant. Keep in mind that this is not a complete list, but a rule of thumb that will boost the accessibility of your current site considerably. To truly follow the rules of accessibility to the letter, look to the W3C guidelines or those that are in accordance with Section 508 of the Rehabilitation Act.

• Add the ALT attribute to all IMG tags: Including text explanation to images will help users unable to see the graphics tremendously. However, don't go overboard: the ALT attributes don't always need to be text. For example, blank space bars or purely decorative stars and stripes can be given the alt attribute alt="" that tells a text reader to skip over it, rather than burdening the user with its insipid contents.
• Flexible fonts: Whether you're using cascading style sheets or individual HTML pages, don't mandate that the text on the page be a certain size, especially if it's a small font or heading. Though you may like the ease of controlling a page's layout through fixed-width fonts, it's a useless task if your viewers can't read it. Let viewers with a preference for larger or, on occasion, smaller text, control this aspect of your page.
• Check your navigation: Do you need a compass and a map to use it? Make sure your site's navigation is consistent, meaning that the same list of choices is in the same place and listing the same options throughout. Also, include invisible alt tags that give readers with text browsers the option to skip the navigation when they don't need it. They will thank you for being considerate of their needs and preferences.

• Dissolve your use of JavaScript: Common site features that designers love, such as frames and pop-up windows that are based on JavaScript commands, are very confusing to text-based browsers and should be avoided. Text browsers may not always indicate that this information is in a new space, or they won't be able to read it at all. Instead, include this information on a separate page.

  JavaScript is also a favorite for ecommerce and donation capabilities that your site may be running. While it may not be practical to disable these functions for your audience as a whole, if you include these functions, you should include alternative formats, such as an email form or a phone number to call, for users who can't use your current system.

• Label your forms: If your site is running forms for anything from search functionality, to joining your mailing list, to ecommerce and donations, make certain everyone has access to these important elements. Don't just put the text explaining the form next to it. Rather, each space within the form should be labeled with alt tags. Most web-based forms aren't accessible to text readers because the prompt (such as "Name") and the blank space where the visitor is to provide this information next to the prompt, aren't always in sync. Only if each field itself is labeled can the developer be sure that the visitor can interact and enter information correctly.
• Stand-alone links: It's quick and easy to insure that all of the links in your site are free-standing, meaning that the meaning of the link is obvious from the portion of the text that's "hot". If your page reads, "Click here for information on the endangered speckled weasel", a screenreader user jumping from link to link looking for information on the forest creature will land on the word "here", and completely miss out on this important data you're providing. Instead of linking words like "here" or "read more", highlight and link "speckled weasel" for maximum impact. Not only will this boost your site's accessibility, but it's a point of good design.
• . PDF alternatives: This is likely the most labor-intensive retrofit we offer, but it can also be the most effective: Any documentation you have posted in .PDF format should also have a text-only option. For screenreader users, .PDF's are unreadable. If you want to share the data with everyone, you'll need to provide it in a more low-tech format.
• Color contrast: Here's a tip: print out a copy of your Web site on a standard printer in black and white. If a person with standard vision can differentiate between all of the colors in your palette, then your site is already accessible to those with colorblindness. However, if all colors on the page cannot be differentiated by the different shades of gray, then likely your site won't be fully usable to a colorblind reader. If this is the case, then you'll need to rethink your color scheme to include some more diverse and contrasting hues.

While revising your current Web site may not be the most effective solution for maximum site accessibility for users with limited manual dexterity or sensory input, it's a far better option than not thinking about these users at all. Particularly in the non-profit sector, accessibility isn't just important for the community of people with physical or cognitive disabilities. Accessible solutions are good web design and critical for the aging population with reduced sensory input, and the world community using low-tech Internet access solutions that work best with pure text. In many cases, accessible cases are easier to use for everyone over the current standards of inaccessible bells and whistles. With a few nips here, and a few tucks there, your organization should be able to find a retrofit that fits.