An accessible website is compatible with the assistive technologies used by people with disabilities. Dreamweaver MX 2004 automates many elements of creating accessible sites and prompts designers to provide information when necessary. It has also been modified to provide better keyboard access and to work with screen readers. (From the book ASP Web Development with Macromedia Dreamweaver MX 2004 by Rachel Andrew et al., Apress, 2004, ISBN: 1590593499.)
Accessibility and Dreamweaver MX 2004 - Accessibility in Dreamweaver MX 2004 (Page 6 of 11 )
For designers trying to build accessible web sites, Dreamweaver MX 2004 is an ideal tool. Dreamweaver MX 2004 automates many elements of creating accessible sites and prompts designers to provide information when necessary. Dreamweaver MX 2004 also includes a powerful validation and reference tools to help designers ensure that their sites are designed properly for accessibility. Another advantage of Dreamweaver MX 2004 is that it has been modified to provide better keyboard access and to work with screen readers. Dreamweaver is the first professional design tool to be accessible to individuals with disabilities.
This section outlines the accessibility features implemented in Dreamweaver MX 2004. Each of the features will be explained and described in terms of the benefits for people with disabilities and for the designers themselves.
Accessibility Preferences Options
Accessibility features such as alt text are often overlooked when creating web sites. Dreamweaver MX 2004 allows designers to set preferences that remind them to provide accessibility information as they are building the page. By activating the Accessibility options in the Preferences dialog box (on the Edit menu), designers and developers will be prompted to provide accessibility-related information for form objects, frames, media, images, and tables as they insert each of these elements (see Figure 3-2).
Figure 3-2.Accessibility options in Dreamweaver MX 2004
When the Images option is selected, users are asked to provide a text equivalent and a description for each image in the dialog box shown in Figure 3-3.
Figure 3-3.Adding image descriptions in Dreamweaver MX 2004
A screen reader reads the contents of the alt attribute in place of the image. In general, it is desirable to describe the image in terms of its function rather than its appearance. This helps the content flow better as it is read to the user. It also spares the user from long descriptions that are not relevant to the content.
In general, alt text (contained in the alt attribute of an element) should be limited to about 50 characters. If further details are required to convey the content of the image, the designer should consider using a long description. The longdesc attribute is a link to a longer description stored on a separate page. Although the long description is not visible to sighted users, screen reader users are notified of the existence of the link. In Figure 3-4, the source code listed shows an image with both an alt attribute and a longdesc attribute. The image shows a diver near a coral reef with alt text that reads, “Safe diving near a coral reef.” There is also a link to a long description file, scuba.htm, that includes a more detailed discussion of the techniques demonstrated in the photo.
Label: <img src="/images/scuba.gif alt="Photo: Safe diving near a coral reef" longdesc="scuba.htm">
Figure 3-4.Photo and alt text
For images that convey no content, such as spacer images, the appropriate alt attribute is alt="". To set an empty alt attribute, Dreamweaver MX 2004 has a new drop-down menu on the Image Tag Accessibility Attributes dialog box and the Properties inspector. From this drop-down menu, the designer or developer can select as the <empty> value for the alt attribute, as shown in Figure 3-5.
Figure 3-5.Selecting an empty alt attribute
This chapter is from ASP Web Development with Macromedia Dreamweaver MX 2004, by Rachel Andrew et al., (Apress, 2004, ISBN: 1590593499). Check it out at your favorite bookstore today.