What's the "for" for in a label tag?

lynn picture lynn · Mar 30, 2009 · Viewed 54.3k times · Source

Just ran across a for parameter in an HTML label tag:

<label for="required-firstname"> First Name </label>
<small>*</small>
<input name="required-firstname" type="text" tabindex="2" 
       id="required-firstname" size="24" maxlength="40">

I'm converting this form to a PHP processed script, can I get rid of the for= parameters? (And out of curiosity, what does it do?)

Answer

Jonas picture Jonas · Mar 30, 2009

From w3schools.org:

The tag defines a label for an input element.

The label element does not render as anything special for the user. However, it provides a usability improvement for mouse users, because if the user clicks on the text within the label element, it toggles the control.

The for attribute of the tag should be equal to the id attribute of the related element to bind them together.

HTH!

adding my $.02 as an Accessibility SME - as well as usability, the LABEL also associates the input field with the correct label so persons using screen readers will know what the field is for.