Taking Care of the Details
The author plans to turn from functional to aesthetic concerns, and as a prolix, indicates that the appearance is important, but not entirely critical. A form done well is usable if rendered in plain HTML, and a user can and will complete it. It doesn't need to be pretty .... but design can be helpful.
In general:
- Put labels where users will see them. Typically, forms are two columns, with questions in the left and their corresponding input fields on the right.
- "Heat Map" tracking shows that users spend more time with their eyes on the input field than the label, and specifically on the left edge of the input field.
- Putting labels above the fields "works sometimes" for short forms
- Left-aligned labels are preferred, though it's said that right-aligned cane be useful in reducing eye movement if there are a lot of slotted answers
- Contextual help for answering a question is best placed near the response element, not the label. Place it to the right of or beneath the input field.
- It may be necessary to constrain the width of the label column to prevent there being too large a gap between question and answer.
- There's currently a debate over whether colons should be used - the author says "flip a coin, but stick to one method"
- Same goes for sentence case versus title case in labels
- For required fields, the author discusses a number of possible solutions, and draws no clear conclusion, except that it's useful to indicate (somehow) that certain fields are required and./or others are optional.
There's a brief discussion of font, color, and white space that's not very well done - there are better sources for this.