WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Forms Accessibility Question

for

From: Paul J. Adam
Date: Feb 10, 2014 10:17AM

Sure, you can use aria-describedby for “help” text and aria-labelledby for the shorter, accessible name text. By pointing those attribute values to the separate text element's ID reference(s), they’re programmatically associated and should be spoken by the user’s screen reader.

Paul J. Adam
Accessibility Evangelist
www.deque.com

On Feb 10, 2014, at 11:11 AM, Monica < <EMAIL REMOVED> > wrote:

> I am trying to build an accessible form and having trouble trying to get
> JAWS 15 to relate each part of it/ read it all as "one" area to fill.
>
> I am trying to get the end result to look like this:
> Label name: [_____Input_____]
> Error message (that shows up ONLY if the above text input did not meet
> requirements)
> *Help text*
>
> I was advised to put the help text and error messages *inside *the label
> tag. However, this would mean that the above look like this instead:
> Label name:* Help text* [_____Input_____]
> Error message (that shows up ONLY if the above text input did not meet
> requirements)
>
> ...which wouldn't work very easily with my fluid layout, as it is difficult
> to style the Label name and help text to look as the ideal, visual end
> result.
>
> Is there any way, using ARIA labels, to allow the Label name and Help text
> to not be in the same label tag *but* still relate them?
>
> Help would be greatly appreciated.
> > >