Labeling and Grouping Form Elements
The common text and other content you may use to label and otherwise explain a form are static. Other than by their visual relationship to the form's input areas, these labels and instructions are unassociated with the form controls that they serve. Because of this, forms are not easily understood and navigable, particularly by people with impaired vision. Try it. Get a simple personal-information form onscreen, close your eyes, and find the place to enter your name.
The HTML 4.0 standard introduced three tags that make navigation of forms easier for users, particularly those with disabilities. They include a way to group and caption regions of the form and a way to individually label form controls. All are supposed to get special treatment by the browser, such as being rendered by a speech synthesizer as well as specially displayed, and can be easily accessed from the user keyboard—that is, when browsers become fully HTML 4/XHTML compliant.
The <label> Tag
Use the <label>
tag to
define relationships between a form control, such as a text-input
field, and one or more text labels. According to the latest standards,
the text in a label is to receive special treatment by the browser.
Browsers may choose a special display style for the label (you can,
too, with stylesheets). And when selected by the user, the browser
automatically transfers focus to a label's associated form
control.
Get HTML & XHTML: The Definitive Guide, 6th Edition now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.