WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessible Form Validation Errors

for

From: julian.rickards@ndm.gov.on.ca
Date: Sep 2, 2004 12:08PM

First of all, if you use the bold tag and the tag to produce bold
and red, using a screen reader, there will be no indication of this change
in appearance. Even if you used in place of bold, it wouldn't
really help much. Secondly, along the same lines, one of the WCAG items is
not to refer to color, however it is created (font, styles, graphic) because
it won't always be seen.

One method, although I wonder how usable it is, it to only display the item
that has an error such as the email address if it is not valid. This means
that the backend coding must be configured to "spit out" only problematic
fields. However, this can appear strange and with only 4 fields, it might be
too much effort.

Another suggestion is to add a message right at the top which states, "Your
email address is wrong, please correct it." and then the user knows exactly
what field to correct. You can use bold (strong), and colours but don't
refer to them.

-----------------------------------------------
Julian Rickards
A/Digitial Publications Distribution Coordinator
Publication Services Section,
Ministry of Northern Development and Mines,
Vox: 705-670-5608 / Fax: 705-670-5960


-----Original Message-----
From: darrel.austin [mailto: <EMAIL REMOVED> ]
Sent: Thursday, September 02, 2004 1:59 PM
To: WebAIM Discussion List
Subject: [WebAIM] Accessible Form Validation Errors



I'm working on getting our contact form for our new web site as accessible
as we can get it to be.

Are there any best practices for creating accessible error messages when the
form is not valid?

For instance, when there's an error, here's what I'm displaying now:

==================================================* There is a problem with your submission. Please check the form below for
any errors (shown in bold red). Please correct the errors and resubmit your
message.

Your Name: * Name Required
[ text field ]
==================================================
I'm displaying a notice at the top stating an error, and then pointing out
the specific errors next to each field. It's a short form (4 fields) but are
there any suggestions as to how to make it a tad more accessible? I was
thinking of using a different error notice at the top that would explicitely
mention the specific fields with errors and link to their anchors directly.
Thoughts?

-Darrel

----
To subscribe or unsubscribe, visit http://www.webaim.org/discussion/