Designing the Web for People With Disabilities. Identifying Key Issues: Design

Design

In the design phase, consider that the most common issues related to document inaccessibility involve complex notation, image rendering, multimedia features and navigation.

Complex notation including math and science is extremely difficult to render in an acceptable format, especially for the blind. Note that most blind persons require an alternative format of the information. Likely the alternative is either ASCII text, Grade II Braille or synthetic speech. Therefore, the proper rendition of the notation is critical to the reader. However, the challenge of rendering complex notation that tends to be graphical in appearance often requires a transformation process. Subsequently, few information publishers are interested in making the investment.

Image rendering provides similar problems. Because the blind or low vision user is likely to be using alternative output (access systems), certain design considerations should be implemented. For example, using meaningful descriptive text in conjunction with figures, images, or other graphical entities within a document. Descriptive or alternative text has become a standard for web based documents. In fact, some authoring tools like HotMeTaL Pro, HotDog Pro, and Corel Web.Designer have built-in prompts for alternate text. Ideally then browser providers should be able to properly display alternative text. The best implementation of alternate text display (are you listening Bill?) is Microsoft's Internet Explorer which automatically displays alternative text using bubble-help type notes as the user passes over the image with the mouse cursor. What will it take to get Netscape into the picture?

Electronic documents that contain multimedia features, including sound or video clips require additional attention. Keep in mind that anything that emits sound cannot be heard by the deaf. It may not be heard by the hard of hearing or, for that matter, anyone viewing the document in a noisy environment. If you believe this to be an impractical example, consider the current industry move to WebTV and public kiosks. While a specific solution for providing web captioning does not exist today, this should be considered an important feature of the document. Logic dictates that if consumer electronic manufacturers can produce televisions and monitors that support internal captioning controls, browser manufacturers and server protocol developers can design the means for delivering captioning through browsers.

Descriptive video provides a blind or low vision user with additional narrative that is useful, sometimes critical to their comprehension of an electronic document. The process simply requires the interjection of descriptive narration during the spots within the video that are not otherwise filled with sound effects or dialogue. As a result, the blind or visually impaired viewer achieves increased comprehension of the video event.

The National Center for Accessible Media (NCAM) in Boston, Massachusetts currently provides a service that implements descriptive video for the motion picture industry. Descriptive video and captioning are perfect examples of how the power of markup should be used to enhance the richness and accessibility of a document. They have recently grants to assist them in the research, design, and delivery of web-based information for public television.

Navigating an electronic document, particularly a hypertext document is a challenge for anyone. Keeping track of where you've been, where you want to go and then getting there can be a cybernightmare. Still, being able to visually navigate through a document has obvious advantages the blind or low vision user cannot easily imitate. A navigational cue as simple as providing colored text provides meaning and definition that the non-visual user cannot see. Therefore, there is a need to design solutions that implement audio cues in concert with visual cues.

Remember too that navigation is often closely tied with memory and consistent design. People with cognitive limitations simply require visual memory aids and simplified page design. One designer, Colin Moock, implemented a system of visual cues consisting of opened and closed doors. The concept is basic to most people and simple to learn and remember.

Navigational difficulties clearly present challenges to every user. Consider the difficulty a visual user has today and then imagine doing the same thing with your computer monitor turned off! Or try navigating through a multicolumn table or an on-line newspaper that contains multiple columns on a single page. Without a doubt, navigation requires acute sensory awareness. Navigation is not just a document roadmap; it is not a linear link Rather, good navigational design includes a combination of seeing, hearing and "feeling" your way to a specific destination in a comprehensible way.

Design Guidelines for Web Pages

Creating web pages has never been easier. Authoring tools have removed much of the associated complexity of the language. Additionally, where markup languages are concerned, HTML is about as easy as they come. Therein lies the dichotomy. While creating pages is simple, designing pages is not. Additionally, designing accessible web pages appears to be harder. At least the current state of the Web would suggest exactly that. Following is a brief list of guidelines for designing accessible web pages:

1. Use short, functional descriptive text for text links within a page. Avoid using 1-2 word text links. Using functional text descriptions provides better navigation and coherent feedback to blind users who rely on synthetic speech to render a page.
2. Always provide text descriptions for images. This guideline benefits visually impaired users, people who use text-based browsers, and individuals who turn off the ability to display inline graphics within GUI-based browsers. To accomplish this, use the ALT="text" attribute.


Note that in the example above, the seven image icons that border the right side of the page are menu related icons that provide the user with navigational aids throughout the rest of the website. Note also the inconsistent use of ALT text for some images and not for others. How will a blind person comprehend or navigate this site?
3. ALT text should be included for bulleted lists, horizontal rules, or thumbnail links to larger images.
   • Where images require lengthy text descriptions in order to convey proper definition, some webmasters have created a text anchor to a page. In this case, the preferred method has been to use the uppercase letter "D" to signify "descriptive text". Users then click on text anchor and a full text version of the page is rendered.
4. Consider using a text anchor page for tables. Synthetic voice software is only capable of reading left to right, one line at a time. Complex table constructs make it very difficult for the blind reader to interpret.
5. Use text anchors for image maps as logical connections to their associated links. Generally this is done by placing the links directly below the image map. Designers may also consider providing users with a choice between viewing the image map or a text rendition (anchor page).
6. Provide text transcriptions of audio clips or video clips that contain audio. This benefits deaf and hearing impaired users. Again, text anchors are the preferred method.
7. Test your pages for color contrasts. Samu Mielonen recommends that you test your pages by adjusting your monitor to 256 shades of gray and then look for the following:
   • Can you distinguish the different colors on the basis of their lightness values?
   • Can somebody else who has not designed your screen make the difference?
   • Is the text pleasant to read or does it tire you?
   • Are you using too many different colors (lightness values) that just confuse the reader without adding information to your design?
   • Check for blue/yellow and red/green combinations. If you use these color pairs to distinguish information, you're in trouble with dichromatism* -- 'a form of colorblindness in which only two of the three fundamental colors can be distinguished due to a lack of one of the cone pigments'. [*The American Heritage Dictionary of the English Language, Third Edition, Houghton Mifflin Company, 1992. Electronic version licensed from InfoSoft International, Inc.]
8. Avoid using frames. Frames cannot be easily read by the blind or visually impaired. Jakob Nielson* also notes, "Splitting a page into frames is very confusing for users since frames break the fundamental user model of the web page. All of a sudden, you cannot bookmark the current page and return to it (the bookmark points to another version of the frameset), URLs stop working, and printouts become difficult. Even worse, the predictability of user actions goes out the door: who knows what information will appear where when you click on a link?" [*Top Ten Mistakes in Web Design, by Jakob Nielson, SunSoft, Inc.]
9. Do not use blinking text, scrolling text, marquees, or continuous animation.
10. Provide forms which can be downloaded then mailed or e-mailed. Forms cannot be easily processed by the blind and visually impaired.
11. Do not use browser-specific tags.
12. Always test your pages with a variety of browsers.

[Next Section]   [Previous Section]