I still can't believe how many big-name websites neglect to use this wonderful bit of markup! Read this, and make it a habit. It's so easy!
Let's say we're marking up a contact form where visitors enter a bit of personal information, such as their name, sex, and which products they're interested in. I'll keep this stupid simple: when you're creating this form, there is a proper place to put the
label for each input element. It's called the label element. Be sure to use the
for property, that way the
label knows which
input element it refers to.
The reason for going through this trouble rather than just using a
<div> or a
<span> element, is because the browser knows that if a
<label> element with a
for property is clicked that the corresponding
input element should receive focus. Having the label AND the input element clickable makes for a much larger target to click on, making the human/computer interaction target more usable.