Labeling HTML Form Elements
The HTML label tag is used to label form elements as follows:
<label for="FirstNameLabel">First Name:</label>
<input type="text" name="FirstName" id="FirstNameLabel">
As seen in this example, the for attribute of the label tag binds it to the id attribute of the input control. Why use the label tag? Browsers handle the text in a label tag in a unique way. When the label text is clicked on, focus is automatically given to the associated form control. This is especially useful in the case of radio buttons and checkboxes, as their text can be clicked to toggle the control. For example:
<input type="radio" name="OnOffControl" id="on">
<label for="on">On</label>
<input type="radio" name="OnOffControl" id="off">
<label for="off">Off</label>
Another compelling reason to use the label tag is that it aids browsers that are built for people with disabilities. An example is speech browsers, which use the label to determine how to describe the form controls.
