Home arrow Design Usability arrow Page 6 - Accessibility and Dreamweaver MX 2004
DESIGN USABILITY

Accessibility and Dreamweaver MX 2004


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.)

Author Info:
By: Apress Publishing
Rating: 4 stars4 stars4 stars4 stars4 stars / 14
September 29, 2004
TABLE OF CONTENTS:
  1. · Accessibility and Dreamweaver MX 2004
  2. · Accessibility Overview
  3. · Defining Disabilities
  4. · Assistive Technologies
  5. · Accessibility Standards
  6. · Accessibility in Dreamweaver MX 2004
  7. · Adding Media, Frames and Forms
  8. · Adding Tables
  9. · Accessibility Validation
  10. · Cascading Stylesheets
  11. · Accessible Authoring Environment

print this article
SEARCH DEVARTICLES

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

Adding Images

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.

Buy this book now.


blog comments powered by Disqus
DESIGN USABILITY ARTICLES

- Responsive Web Design: More Than Just a Buzz...
- Add New Website Features to Please Users
- Gzip Components in Action
- Configuring Gzip Components
- Gzip Components
- Create Great JavaScript and CSS Menus Simply
- Design Principles that Shape a Web Site
- Creating Aqua Style Images
- Easy as A,B,C – dynamic A to Z indexes
- EasyChart: a Usability Teaching Tool to Demo...
- Building Friendly Pop-up Windows
- Back to School: Design Usability
- Using HTML_QuickForm To Manage Web Forms, Pa...
- Using HTML_QuickForm To Manage Web Forms, Pa...
- More Website Knick Knack

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 

Developer Shed Affiliates

 




© 2003-2017 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials