Accessibility
Adobe
Sign in My orders My Adobe

How do I validate my site for accessibility?

It is helpful to think of validating a site for accessibility as a process similar to editing an essay or another piece of writing. Leaving it until the very end is possible but will usually require a lot more work. Validation is something that should be done often as a site is developed. Frequent validation allows designers and developers to address accessibility problems before they become too severe.

Validation for accessibility should include a combination of automated and manual checks. Like a spell checker, the automated tools look for obvious problems with the accessibility of a page, while the manual tools generally look for continuity and flow of content. Adobe® Dreamweaver® CS4 makes it easy to validate sites for accessibility. With reporting tools for accessibility and valid code, designers and developers can quickly identify problems on a single page, a collection of pages, or even an entire site. Dreamweaver checks the selected pages for compliance with Section 508 standards or W3C Web Accessibility Initiative Guidelines, then generates a list of problems, so you can quickly find and repair the areas needing attention.

Using automated checking tools

Perhaps the easiest way to begin the process of validation is to use one of the numerous free online validation tools. In most circumstances, these tools will provide a quick, if cursory, glance at the accessibility issues on a page. The oldest and best known of these tools is Bobby, from Watchfire Corporation.

Bobby

To use Bobby, enter the URL of the page to be checked in the form on the Bobby page (bobby.watchfire.com/bobby/html/en/index.jsp).

Bobby returns the page along with a report of obvious issues. Missing alternative text descriptions, missing frame titles, or absent cascading style sheets (CSS) are easy to catch using a tool like Bobby. Bobby does not look at more complex and subjective problems such as tables used for data or the type of alt text used; Bobby was not intended to analyze these types of issues. Bobby's strength is in its simplicity and ease of use.

LIFT Online

LIFT Online is a powerful online tool available from Usablenet, a company specializing in web usability technology. LIFT Online evaluates five pages for free and then offers a fee-based service that provides a more comprehensive evaluation of subsequent pages or the whole site. LIFT is particularly helpful for getting an overall sense of the kinds of issues the designer/developer needs to address.

LIFT can report when specific alt types of alternative text are required for objects such as spacer images. LIFT can detect a table used for data and evaluate the markup appropriately. LIFT can also evaluate a page using more general usability rules. These rules are not based on issues specifically faced by individuals with disabilities, but on usability issues common to all web users.

Accessibility reporting in Dreamweaver

Application-based tools generally offer more comprehensive tools for validation. An excellent example is the Accessibility reporting feature in Adobe® Dreamweaver® CS4 software. Dreamweaver offers the ability to check individual pages or even an entire site against a customizable set of accessibility guidelines. The Accessibility report in Dreamweaver offers a comprehensive set of tests for accessibility. Perhaps most important, it takes advantage of the authoring environment of Dreamweaver to point the web content designer/developer to specific places on the page in need of revision. It also provides further detail of the Section 508 standards and W3C Guidelines in the Reference panel.

HTML and CSS Validator

HTML Validator and CSS Validator from the W3C are particularly helpful for advanced users. These free tools do not check for accessibility issues; rather, they check for the proper use of HTML and CSS. This is particularly helpful for designers and developers who may understand coding in HTML and CSS but who are not familiar with relevant techniques for accessibility. The HTML and CSS validators can identify incorrect coding and point to a solution.

Validating dynamic pages

A common concern during the process of validation and repair is how to validate dynamic pages. Testing a dynamic page is similar to testing a static page. The primary difference is that the test covers the output of the page, not the page itself. In most cases, making the necessary adjustments is comparable to making changes in HTML. While there are tools that do check dynamic code, many designers and developers report being equally comfortable using static checkers such as the Accessibility report in Dreamweaver.

Dynamic design techniques for accessibility are more complex. These techniques, however, are more often intended to improve the process of accessible design rather than to affect directly the user's experience of a page.

Performing manual validation

Manual validation looks for a broad range of issues in the website or application. Manual validation should include at least three checks. In many cases, substantially more complex evaluations are necessary, but the three checks described here present some quick and simple ways to review the accessibility of a site.

First, evaluate the page using a screen reader or a text browser. Many screen reader manufacturers offer free demonstration versions of their software. Screen readers are complex, however, and not always easy to use. For those without visual impairments, IBM Home Page Reader is often easier to use than most screen readers. It offers a panel displaying the text that is read to the user. This visual display often makes it easier for novices to follow the contents of the page. Another advantage of Home Page Reader is that it is a speech browser rather than a true screen reader. Thus, designers and developers may include it in the list of preview browsers in Dreamweaver and then turn it off when the evaluation is complete.

When checking a page in a screen reader, be sure to check for continuity in the content that is read to the user. Pay attention to alt text that includes cues reinforced by the screen reader. For example, an image used as a link should not include the word link in the alt text. The screen reader will inform the user that it is a link; therefore, referring to that fact in the alt text is redundant.

Second, carefully consider the sounds used on the site. If the sound is used to convey any content, check to make sure that the same information is available without sound. For longer audio tracks, be sure the audio is captioned.

Third, try using the page without touching the mouse. Use the Tab key to move among links and form objects on the page. Make sure the tab order follows a logical sequence. Also, be sure that users can reach every area on the site; pop-up menus and plug-ins can frequently create difficulties in this area.