Implementing Accessibility Features

Although software developers have long ignored accessibility features, modern software takes accessibility into account from both ethical and economic standpoints, as well as to comply with the law. In fact, Microsoft has made accessibility a key feature of the Windows logo certification program.

The following are the five basic principles to accessible design:

• Flexibility The user interface should be flexibile and customizable so that users can adjust it to their own individual needs and preferences.

• Choice of input methods All operations in your application should be accessible to the keyboard, and basic operations should be available via the mouse as well. In the future, voice and other types of input might also be considered here.

• Choice of output methods You should not depend on a single method of output (such as sound, color , or text) for important information.

• Consistency Your application should be consistent with the Windows operating system and other applications to minimize difficulties in learning and using new interfaces.

• Compatibility with accessibility aids Windows includes several accessibility aids such as the Magnifier (which can blow up text or graphics to a larger size) and the On-Screen Keyboard (which enables keyboard input via the mouse). Your application should not circumvent these accessibility aids.

Understanding Accessible Design Guidelines

Table 12.1 lays out some of the important accessibility guidelines you should consider for any application.

Table 12.1. Accessibility Guidelines for Web Application Design

Area	Guidelines
ALT text	Every graphic should have ALT text, and the ALT text should convey the important information about an image.
Imagemaps	Do not depend on imagemaps for navigation; also include a set of text links for those who cannot use the images.
Link text	Link text should be useful in isolation because some accessible browsers present a list of links with no context for fast navigation. If this isn't possible, use the TITLE attribute of the link to provide a more descriptive string.
Keyboard navigation	The Tab key will move between all links and imagemap areas in the order in which they're defined in the HTML. Use the TABINDEX attribute where appropriate to override this.
Access keys	All controls and links that act as controls should have an ACCESSKEY attribute. Underline the access key in the control's label.
Control identification	Use the TITLE attribute or LABEL tags to associate a name with every control.
Frames and tables	Provide alternative pages that do not use frames or tables.
Support formatting options	Do not assume that text will be in a specific font, color, or size. Do not assume that things will line up because the width might change. Use heading tags such as <TH> rather than specially formatted text.
Style sheets	Make sure that the page works even if the style sheet is turned off. Otherwise, offer an alternative page that is designed to work without a style sheet.
Audio and video	Provide captions or transcripts for audio and video content.

The W3C Guidelines

The World Wide Web Consortium (W3C) is the body that governs standards for the Internet. The W3C has invested considerable effort in defining accessibility guidelines. More information about the W3C Web Accessibility Initiative is available at www.w3.org/WAI.

The Section 508 Guidelines

Section 508 of the Rehabilitative Act sets standards for all U.S. federal agencies that maintain Web sites. This gives accessibility the force of law for federal Web sites (and serves to emphasize that it's a good idea for all Web sites).

There's an excellent discussion of the Section 508 standards at www.access-board.gov/sec508/guide/1194.22.htm.

Making a Web Application Accessible

If at all possible, you should plan to make your Web applications accessible from the start. Sometimes, though, you won't have any choice except to add accessibility features after the fact. In the following example, you'll modify the random number application for accessibility.

1. Open the Example12_1 project.

2. Set the TabIndex property of lblHeadLine to .

3. Set the TabIndex property of hlHelp to 1 , and set its AccessKey property to H .

4. Set the TabIndex property of imgDecor to 2 , and set its AlternateText property to [Dice Image] .

5. Set the TabIndex property of lblInstructions to 3 .

6. Set the TabIndex property of btnGetRandom to 4 , and set its AccessKey property to G .

7. Set the Text property of the Label control before the txtRandomNumber control to <u>R</u>andom Number . Set its TabIndex property to 5 .

8. Set the TabIndex property of txtRandomNumber to 6 , and set its AccessKey property to R .

9. Run the project. Verify that the tab order and access keys work as designed.

The Button Web server control does not support underlined text. If you want to show underlined text on a button, you can use an HTML Button control. In that case, though, you'll need to move any processing from the button's click event to the Postback portion of the page's Load event.

Testing Application Accessibility

Before shipping an application, you should test its accessibility features. Here are some tests you should perform:

• Make sure that all functionality is accessible by using the keyboard alone. Test all access keys. Press Enter to follow a selected link.

• View the page with graphics turned off to ensure that the ALT attributes are a good substitute. In Internet Explorer, you can turn off graphics from Tools, Internet Options, Advanced.

• Use the application with sound turned off to ensure that that no important information is lost.

• Turn on the High Contrast option under Control Panel. Display the page and ensure that it is still readable.

• Alter the page's font size (you can do this with View, Text Size in Internet Explorer) and ensure that the page is still readable.

• Resize the browser window and check for readability.

One of the accessibility guidelines states that you should supply row and column headers for data tables. This facilitates specialized browsers designed to help users understand the structure of tabular information.

You can use the scope attribute to associate the row and column headers explicitly with the data in the rows and columns . This enables screen reader software to more easily tell a visually impaired user which row and column are associated with a particular data value.