WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Wrapping form elements in their explicit labels

for

Number of posts in this thread: 3 (In chronological order)

From: Oliver Boermans
Date: Mon, Jun 15 2009 6:00PM
Subject: Wrapping form elements in their explicit labels
No previous message | Next message →

Hi all,

For a few years now I have been building forms in which, where
possible, wrapping the form elements with their respective label tag.

As recommended here.
1.0 - 2.
http://www.websemantics.co.uk/tutorials/accessible_forms/

But perhaps this recommendation is showing it’s age? Today I stumbled
across this
http://html.cita.illinois.edu/nav/form/text/index.php?example=2

Searching this list I found this old thread discussing interpretation
of WCAG 2.0
http://www.webaim.org/discussion/mail_thread.php?thread=3029

In my own testing I determined that the explicit association with
'for' and 'id' is necessary for some browsers (to ensure the labels
are 'clickable'). But it seems that wrapping the form element in the
label causes problems with screen readers and should be avoided?

The User Agent and Assistive Technology Support Notes certainly suggest so.

Using label elements to associate text labels with form controls
http://www.w3.org/TR/WCAG20-GENERAL/H44.html

I’m attempting to nail down our form mark-up before baking it into a
form creation tool.

Ollie

From: Benjamin Hawkes-Lewis
Date: Mon, Jun 15 2009 6:10PM
Subject: Re: Wrapping form elements in their explicit labels
← Previous message | Next message →

On 16/6/09 00:59, Oliver Boermans wrote:
> In my own testing I determined that the explicit association with
> 'for' and 'id' is necessary for some browsers (to ensure the labels
> are 'clickable').

And in order to guarantee assistive technology can associate them.

> But it seems that wrapping the form element in the
> label causes problems with screen readers and should be avoided?

Yes.

http://green-beast.com/blog/?p=254

--
Benjamin Hawkes-Lewis

From: Benjamin Hawkes-Lewis
Date: Tue, Jun 16 2009 12:40AM
Subject:
← Previous message | No next message

On 15/6/09 20:16, Jared Smith wrote:
> Neither HTML nor WCAG prohibit empty headings (headings that contain
> no text)

Hmm. Not sure about that. Granted HTML 4.01 does not contain a direct
prohibition, but it does say "A heading element briefly describes the
topic of the section it introduces."

It seems to me an empty string isn't a "heading" and can't describe the
topic of section it introduces.

So I'd say "<h1></h1>" would be a valid, but not a conforming use.

(I don't think it's possible to enforce this conformance requirement
with a DTD and so make it a matter of validity. You probably could with
another schema language like Relax NG.)

Similarly, WCAG 2.0 says: "2.4.6 Headings and Labels: Headings and
labels describe topic or purpose. (Level AA)"

Again, an empty string doesn't describe topic or purpose, so I think it
fails that guideline, much as "Click here" fails the "Link Purpose"
guideline:

http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/F84

Interestingly, the current draft of HTML5 explicitly makes
non-whitespace text content descendants of heading elements a SHOULD
requirement:

*
http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements

*
http://www.whatwg.org/specs/web-apps/current-work/multipage/dom.html#phrasing-content-0

--
Benjamin Hawkes-Lewis