Why Do Developers Hate The <label> Tag?
One of the most common usability faux pas I find all over the internet is the lack of developers linking up radio buttons with their labels. Why should we be forced to click a tiny little circle when we should be able to click the actual text for that choice?
It's built into the HTML spec so why don't developers use it? Even some of the biggest sites on the web are guilty of this one. I just don't get it.. it's not exactly rocket science.
Just give an ID to your radio button, like so:
then wrap the text that goes with that radio button in a label tag, as such:
Here's a full example with a few selections to choose from.. notice how you can just click the text to select the choice you'd like:
The full code for that was:
2 <input type="radio" name="whatever" id="selection2" /> <label for="selection2">selection 2</label><br />
3 <input type="radio" name="whatever" id="selection3" /> <label for="selection3">selection 3</label><br />
With all of the attention being given to usability in this Web 2.0 world, let's make sure we've got 1.0 covered first.
The 'legend' and 'fieldset' are two more good form attributes I use quite a bit.
More good stuff at the W3C site:
http://www.w3.org/TR/html4/interact/forms.html
Jim
Scott is correct that you should really be using the <label> tag on all of your form fields. If you're not, I suspect your using tables for layout. You should really be using CSS combined with the correct HTML to lay things out in an accessible way that is Section 508 compliant and able to be handled by screen readers - though much of the web nowadays is no longer compliant with so many image-based captchas all over the place. You can find some good CSS form samples listed here: http://www.smashingmagazine.com/2006/11/11/css-bas...
Jeff: As far as I know the <br /> tag is still perfectly valid for breaking lines. There is some CSS that can be applied to clear floats, but other than that maybe you meant using a DIV which can be overkill in many situations. Let me know if I'm missing something!