WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Explicit Form Labels and Positioning Question

for

From: Elle
Date: Oct 27, 2011 10:18AM

Thanks, both, for your input.

On Thu, Oct 27, 2011 at 11:24 AM, Sailesh Panchang <
<EMAIL REMOVED> > wrote:


> The vision impaired user (including color blind) may be at a disadvantage.
> Screen reader users may need to tab through all controls listening to
> identify labels with extra text.
>

I have considered this, and I appreciate the insight. It's helpful when
defining why a solution might be unusable.

>
>
> In situations where the interface allows an error icon to be
> placed near the field with error, leverage it to help VI users.
> For example, set alt="Error: Zip code" (if zip code field has an error.
> When screen reader users realize there is an image next to fields with
> error on the particular website, they can use image navigation to
> navigate straight to those fields. That is equality of access.
> The error text may be placed near the error icon / label / form
> control as per UI design. It can be within a span with tabindex=0 so
> that it is tab navigable too.

The method can be used regardless of whether form control uses label or
> title.
> ii. If error icon method is not used by the website, encourage the
> designers to introduce one.
>

We also use an exclamation point icon with the alternate text of "Error" for
errors. Do you recommend placing this within the <label> element? I think
that was my intention for future recommendations for these pages.

Of course, another pet suggestion is to suffix the page title
> (title element) with brief text to suggest that form submission
> failed / errors are present ... in situations where form submission
> refreshes form page. Else it could be suffixed to an existing heading
> text placed immediately above the form that serves as the form's
> title.
>
> Sailesh Panchang
> Deque Systems


Still working on that suggestion, Sailesh! :)


>
Thanks,
Elle