I spend much of my time at work designing user interfaces and developing forms for the web. As a result I've found myself becoming increasingly aware of other form implementations on websites and web apps. There are many things that equally surprise and irritate me about the way some people put there forms together, but one is particularly frustrating: not correctly labelling form elements.
It's really quite simple. Each form input—a text field, checkbox, radio button, etc.—should have a label to explain what it is. These labels should be linked to the relevant input. So each label's for attribute should match the input's id attribute. This is not difficult.
Yet I keep finding forms where label attributes haven't been used or have but linked to the wrong field (for example, clicking on a poll option only to find you've selected a different one because of poor markup).
There are many reasons for labelling forms correctly. It will make your forms more accessible and more user-friendly. It helps ensure people can identify what is being asked for and makes selecting inputs easier. Checkboxes and radio buttons particularly benefit from this as these elements tend to take up a small amount of space making them trickier to click (clickable labels increase this area); remember we're not necessarily clicking on elements with a cursor anymore, think fingers on small mobile phone screens!
Forms are very interactive components of sites, so usability is key! A well designed form is one that functions well.
So next time you place an input field in your markup, make sure there's a label (even if you do end up hiding it in the stylesheets, although this should be justified).