WebAIM - Web Accessibility In Mind

E-mail List Archives

Wrapping form elements in their explicit labels

for

From: Oliver Boermans
Date: Jun 15, 2009 6:00PM

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