WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: labels in forms

for

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

From: Jon May
Date: Thu, May 31 2007 5:20PM
Subject: labels in forms
No previous message | Next message →

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type">
</head>
<body bgcolor="#ffffff" text="#000099">
<font size="-1"><font face="Verdana">Hi all,<br>
<br>
I'd like some clarity on labels in forms please. Is it OK to put
&lt;label for="fname"&gt; if it for a first name input box or is it
better to put </font></font><font size="-1"><font face="Verdana">&lt;label
for="firstname"&gt;</font></font><font size="-1"><font face="Verdana">
or even &lt;label for="first name"&gt;. I wasn't sure if screen readers
and the like actually read the value in the label and whether it is
best to have something in there that actually makes sense to the
visitor or if it is fine to use abbreviations.<br>
<br>
Thanks for you time.<br>
Jon May<br>
Mayhem Design<br>
<a class="moz-txt-link-freetext" href="http://www.mayhemdesign.com.au">http://www.mayhemdesign.com.au<;/a></font></font>
</body>
</html>

From: Patrick H. Lauke
Date: Thu, May 31 2007 5:50PM
Subject: Re: labels in forms
← Previous message | Next message →

Jon May wrote:
> Hi all,
>
> I'd like some clarity on labels in forms please. Is it OK to put <label
> for="fname"> if it for a first name input box or is it better to put
> <label for="firstname"> or even <label for="first name">. I wasn't sure
> if screen readers and the like actually read the value in the label and
> whether it is best to have something in there that actually makes sense
> to the visitor or if it is fine to use abbreviations.

the for attribute points to a matching id attribute. both are
machine-readable data, which is not directly exposed to the end user
(not even in screen readers).
http://www.w3.org/TR/html401/interact/forms.html#adef-for

oh, and your third example is invalid, as ids and names can't contain
spaces.
http://www.w3.org/TR/html401/types.html#type-name

P
--
Patrick H. Lauke

From: Christian Heilmann
Date: Thu, May 31 2007 6:00PM
Subject: Re: labels in forms
← Previous message | Next message →

> Hi all,
>
> I'd like some clarity on labels in forms please. Is it OK to put <label
> for="fname"> if it for a first name input box or is it better to put <label
> for="firstname"> or even <label for="first name">. I wasn't sure if screen
> readers and the like actually read the value in the label and whether it is
> best to have something in there that actually makes sense to the visitor or
> if it is fine to use abbreviations.

The for attribute connects with the id of the element it should
connect to. This is only for the browser and will not be read out. As
IDs cannot have spaces "first name" would be wrong. You can call the
ID whatever you please though, with form fields the name attribute is
what is sent to the server. IDs are only in HTML as hooks for CSS and
DOM, and don't have anything to do with the backend or with assistive
technology.

<label for="fn">First Name</label><input type="text" name="firstname"
id="fn"> is as valid as <label for="scoobydoo">First
Name</label><input type="text" name="firstname" id="scoobydoo">



--
Chris Heilmann
Book: http://www.beginningjavascript.com
Blog: http://www.wait-till-i.com
Writing: http://icant.co.uk/

From: Jukka K. Korpela
Date: Thu, May 31 2007 10:50PM
Subject: Re: labels in forms
← Previous message | Next message →

On Fri, 1 Jun 2007, Patrick H. Lauke wrote:

> the for attribute points to a matching id attribute. both are
> machine-readable data, which is not directly exposed to the end user

This is almost nitpicking, but id attribute values may be used in URLs
that refer to specific elements (or locations) on a page, i.e. in fragment
identifiers (#idvalue). URLs in turn may be exposed to users at least in
the browser's location bar or - when mousing over a link - on the status
line.

This _is_ nitpicking when form fields are considered, since there is
hardly any point in referring to a field with a fragment identifier. But
for id attributes in general, it is a good idea to keep them reasonably
readable to humans.

--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/

From: Jared Smith
Date: Thu, May 31 2007 11:50PM
Subject: Re: labels in forms
← Previous message | No next message

On 5/31/07, Jukka K. Korpela < = EMAIL ADDRESS REMOVED = > wrote:
> This _is_ nitpicking when form fields are considered, since there is
> hardly any point in referring to a field with a fragment identifier. But
> for id attributes in general, it is a good idea to keep them reasonably
> readable to humans.

And this is _really_ nitpicking, but the fragment identifier/id for
links could be useful if you're providing a link directly to the form
element, primarily for the sake of error recovery. The fragment
identifier in the URL can be a bit helpful to the end user. The id can
also be used in scripting for form validation or error recovery. So,
as Jukka says, your life will be easier if you make them readable and
provide some association to the element in question.

Also of note, values for id must be unique - the same one can't appear
twice on any given page. They also must start with an ASCII letter
(NOT a number), followed by any number of ASCII letters, digits,
hyphens, underscores, colons, and periods. If you're using the ID for
CSS, you should be careful with the use of underscores. Colons and
periods will cause issues with scripting and CSS. The id value and
references to it are also _supposed_ to be case sensitive.

Jared