WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessible Form Validation Errors

for

From: Hoffman, David
Date: Sep 8, 2004 1:49PM


My colleagues and I have developed a guideline document for handling
accessible and usable form validation errors. Lisa Battle and I even
discussed it as part of our UPA 2004 presentation: "Design Patterns and
Guidelines for Usable and Accessible Web Applications" -- by Lisa Battle and
David Hoffman. The guidelines use a diverse variety of techniques for
ensuring that different types of users will be aware of the existence and
number of errors, be able to easily navigate to the errors, and have easy
access to all associated directions and cues. The outline of the document is
as follows:

Description
Guidelines for Use
Preventing Errors
Ensuring that Users are Aware of the Existence and Number of Errors
Ensuring that Users Can Find Errors Easily
Providing Explicit Information and Helpful Wording for Error
Messages
Presenting Errors that Involve Conflicts Across Pages
Interaction Requirements
Standard Approach
Alternative Approach
Other Accessibility Requirements
Keyboard Navigation
Coding Tips
Related or Associated Controls

The following are a sampling of some of the interaction requirements:

Title Bar Message: An error message is added to the page title (displayed in
the Windows title bar) prior to any other title bar text. The message
wording makes the user aware of the existence and number of errors (for
example, "1 error on page", "2 errors on page"). If there are no errors on
the page, no message is included in the title bar. Including this
information in the page title ensures that blind users will hear the message
when the page is loaded and on-demand, whenever they choose to confirm their
location.

Error Summary Message: An error message is added to the screen immediately
below the page heading. The message uses a specially defined error message
style. The error message style is attention-getting, and uses red because
red is associated with errors. An optional graphic may be displayed to the
left of the message, but the message itself is text to ensure that low
vision users can read it. The message wording makes the user aware of the
existence and number of errors, using a complete sentence (for example,
"There is 1 error on this page.", "There are 2 errors on this page."). If
there are no errors on the page, no error summary is displayed. There is a
tab stop on this message so that a user can tab to it.

List of Errors: A bulleted list of errors appears immediately below the
error summary message. There is one list item for each error.

Error Links: Each item in the list of errors is a hyperlink. Selecting the
link takes the user directly to the field where the error occurred.
----------

If there is interest, we would consider preparing an article to offer to
WebAIM on the topic.

Take Care,
David