WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Handling with accessible error messages.

for

From: Terrill Bennett
Date: Sep 23, 2010 1:36PM


At my previous contract, the developer's handled form errors by:

1) The CGI scripts created skip-nav links at the top of the page, 1
for each field containing an error, in index order. This allowed
anyone with JavaScript disabled to quickly get to the 1st and each
successive each error by fixing 1 error, returning to the top, find
the next skip-nav, repeat.

2) If enabled, a JavaScript iterated through the page looking for
labels with the error-message class and added a hidden
(off-screen/CSS) link immediately after the field to the NEXT field
with an error. After the final field with an error, a hidden link was
added which said all errors were complete, and sent the focus to the
submit button if the link was activated.

If nothing else, perhaps this will give others a seed for a better method(?).

-- terrill --

> Hi folks,
> We have a form which needs to be made accessible.
> On submition of the form the errors are appeared as a list before the
> form.
> User has to read all the error messages and then move to the form to
> enter. If we have more than 3 errors an user cannot remember all the
> error messages and enter.
> So another mechanism also is required to provide the error messages for
> the users of screen readers some where near the wrongly entered field.
> I prefer providing a hidden span with error message near corresponding
> field. Is it okey?
> Can any one bring more accessible solution on it without disturbing the
> existing layout.
> Waiting for your responses.
> Thanks in advance.
> Rakesh