WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessible form errors...bug?

for

From: Sailesh Panchang
Date: Jan 18, 2011 10:27AM

Jim,
1. Well a h<n> tag placed above the form or list of errors stating
form submission failed is helpful. I also suggest suffixing a
message like "- registration failed; Errors in form" to the page
title (title element) if that is possible.
2. Appending the error message within the label element might work in
some design situations but one should ensure that the original label
text is also retained as-is within the label element. I am not a
strong supporter of listing all violations in a list (of anchors) at
the start of the form. Is one expected to come back to the list in
order to find the next invalid field?
3. Some authors like to place an error-icon (img) next to every field
that fails validation. This is also a workable solution: the alt can
contain the error# and a brief error message. e.g. alt="Error #1: Last
name is absent" or "Error #2: Invalid email address". Else the alt
may contain just the error# and field name and the error message may
be within a span next to it styled distinctively. The error icon (img)
allows users of screen reader software to navigate from one invalid
field to the next and skip fields in between if they choose to.
4. An ARIA-alert with an error message that pops up as one tabs out
of a field that fails validation is another technique that is
useful. Admittedly it works with (some of) the latest assistive
technologies and browser versions only.

Sorry I did not address the differences in browser behavior you referred to.
Rightho,
Sailesh