Addressing Users with Special Needs

This section of the chapter considers features that make an application easier to use for those with special needs. Don't automatically equate special needs with physical challenges faced by some people. As users age, they need better screens because their eyesight begins to fail. Older hands often suffer from arthritis and require more options for executing commands. Even someone who's very young can require help at the end of the day when a day full of eye-fatiguing research means using a display with larger type. With this in mind, the following sections describe things you can do to make your Google Web Services application more usable without a large investment in time or effort.

Note  

A section of a chapter can't possibly address every accessibility requirement. In addition, if you work for an organization that provides services to the government, you have certain legal requirements you must meet to address accessibility concerns. See my book, Accessibility for Everybody: Understanding the Section 508 Accessibility Requirements (Apress, 2003) for a complete treatment of this topic.

Adding Hints for Desktop Applications

Desktop applications commonly rely on hints to help a user understand their operation. For example, when you see a letter of a field underlined , you realize that pressing Alt+<key> selects that field. If the developer has wisely selected a different letter for each field, every field is a single key combination away. The use of speed keys helps touch typists work faster by allowing them to keep their hands on the keyboard, rather than use a mouse. However, speed keys also help those who can't use a mouse at all. In this case, the user has a choice of pressing Tab multiple times to locate the field or using a speed key to access it ”the speed key is preferable because it's faster and requires fewer key presses. (Make sure you set the order of the tabs as well so the user progresses in a logical manner when pressing Tab.) Adding speed keys to your application takes moments ”all you need to do is type an ampersand in front of the letter you want to use for the speed key for most Windows languages.

Another common hint that also serves an accessibility need is the tooltip. Adding a tooltip for each control lets you explain the purpose of that control using a single sentence . If the user needs additional information, they can refer to the online help, but this feature usually provides enough information so that a trip to the help file isn't necessary. From an accessibility perspective, a screen reader or other piece of accessibility software normally reads the information in the tooltip to the user. Consequently, the tooltip helps users with vision needs build an image of the application and its functionality in their mind. The technique used to add a tooltip to an application depends on the language product used. For example, Visual Studio .NET developers can rely on the simple addition of a ToolTip control to make the tooltip addition. The ToolTip control adds a new ToolTip property to each of the other controls ”just type the text you want to appear in the tooltip. The desktop applications in this book contain both speed keys and tooltips to ensure anyone can use them.

Note  

Always try to support the accessibility features provided by the operating system. For example, Windows supports a number of accessibility features, including the use of high contrast displays for users with special visual needs. Some of these features, such as support for a screen reader, are so easy to implement that there's never a good reason not to implement them. Other features, such as the use of the Windows ShowSounds, can incur a higher cost in programming time because most programming languages don't support the feature.

Platforms such as Windows include a number of operating system-specific accessibility features as well. Windows includes a high contrast setting that displays images in just a few colors using large fonts. The display makes it a lot easier for people with less than perfect vision to see the display. However, many people with normal vision also use the setting at the end of a hard day when a standard display is apt to give them a headache . The problem for developers is that the high contrast setting tends to make labels and other text elements on a form difficult or impossible to see because the element consumes too much space. Figure 11.1 shows a typical example of this problem.

Figure 11.1: High contrast displays can make some information unreadable.

I chose this particular dialog box because it demonstrates two common problems. First, the information in the middle of the display is garbled ”unreadable for the most part. Second, the application-specific text didn't size with the change in high contrast setting, so the application user receives minimum benefit. Generally, you can avoid problems with the high contrast display by testing this setting with your application. All you need to do is open the Accessibility Options applet in the Control Panel, select the Display tab, and click Use High Contrast. Click OK and you'll see your display change to a high contrast representation. Note that Windows supports a number of high contrast configurations, so you might want to try out several with your application.

One of the biggest problems with Google Web Services is that it provides a wealth of data ”too much in some cases. It's easy to overwhelm someone with special needs with data they'll never use. The problem isn't quite as noticeable with many Web applications because the Web presentation format can reduce the problem. However, desktop applications can suffer significant information overload problems. In some cases, you'll need to present details one at a time or on separate displays to keep the display focused on the essentials.

Adding Hints for Web Applications

Web applications use many of the same hints used by desktop applications, but the techniques for creating the hint differ . As with desktop applications, one of the more important hints is the use of speed keys. You implement a speed key using a combination of special text formatting and HTML tag attributes, as shown in the following code for a label.

 <label id="Input">   <span style="TEXT-DECORATION: underline">I</span>nput: </label> <input id="InputVal"       type=text       value="Hello World"       name="InputVal"       accesskey="I"       title="Type the input string."       autocomplete=on/> 

The user needs to know which Alt+<key> combination to use to access the field, so the style attribute for the label is important ”it underlines the target key. The accesskey attribute defines the speed key for the field associated with the label. The title attribute defines the tooltip text. When the user hovers the mouse over the input, the browser displays a tooltip, just like a desktop application. Use the autocomplete attribute to control the use of automatic completion for the field. Some fields benefit from this setting because the user is likely to type the same text more than one time, but for other fields automatic completion is a nuisance because the user will never type the same text twice.

Images require a little special handling because you can't easily determine whether the user can see the image or not. In this case, you don't use the title attribute because that would display a tooltip. In most cases, you'll use the alt attribute, as shown here, to provide a description of the image.

 <img align="middle"     src="OddImage.gif"     alt="This image contains the words, 'An Odd Image'."     height=130     width=130/> 

It's easy to use the ProductDescription field returned in the ProductInfo structure for the alt attribute text in most cases. You'll find an example of an accessible Web page in the \Chapter 11\AccessibleWeb folder of the source code found on the Sybex Web site. Try this page out in a browser to see how your browser reacts to it. In most cases, browsers do provide support for accessibility features ”at least the basic features described in this section.

The example is a little plain. Generally, you should avoid adding too much formatting to your Web page if you can help it, but most of us like a little color and some formatting to make the page interesting. You can follow some basic guidelines to avoid causing accessibility problems while you dress up the page. For example, use CSS to avoid formatting problems. Someone with special needs can substitute a CSS file of their choosing that makes the page easier to read and you still get the formatting you want. Make sure your page is compliant by testing it with any of a number of online testers such as Bobby (http://bobby.watchfire.com/bobby/html/en/index.jsp).

Considering Color-Blind Users

Before you read any further, it's important to understand that color blindness doesn't mean the viewer can't see color. What a color-blind viewer sees is the wrong color. A red or green dot might appear brown or some other color. Generally, the viewer can still see the object so long as you don't surround it with the color their eyes substitute for the real color of the object. In addition, not everyone has the same kind of color blindness. Most doctors agree there are three main forms of color blindness to consider (read the explanation of the types of color blindness at http://webexhibits.org/causesofcolor/2.html for details).

Because Google returns raw data and not color, you have a choice about the color content of your desktop application or Web site. Even so, you might want to add a little pizzazz to your presentation and that usually means adding color. You can find information about working around color-blindness issues on a number of Web sites, but here are three exceptional sources.

• Can Color-Blind Users See Your Site? (http://msdn.microsoft.com/voices/hess10092000.asp)

• Color Vision Color Deficiency (http://www.firelily.com/ opinions /color.html)

• Visicheck (http://www.vischeck.com/vischeck/vischeckImage.php)

The first two sites tell you about color blindness and provide example images that show how things appear to someone with a particular kind of color blindness. The third site lets you check your image for color blindness ”all you need is a Web site URL. You can use this site to check an entire Web page by grabbing a screenshot of the Web site and uploading it to your site. The same technique works for desktop applications.