Last modified 4 years ago
Forms should mostly be self-explanatory.
What we should do:
- always use the right kind of control. Sometimes a checkbox is better, sometimes a field of radiobuttons, sometimes a button or just a link.
- use meaningful and short labels on the controls themselves, instead of long explanations somewhere in the page. This way we can avoid all the conditionals and negation overhead.
- the other way round: if we have an explanation asking to click a link, then make the link part of the explanation.
Checkboxes or Radiobuttons or Selection Dropdowns?
- a checkbox can be used for yes / no decisions. It offers space for an explanation of the "yes" option, but not for the "no" option.
- an array of radiobuttons can be used for choosing between a/b/c/d/e, but also for choosing between "yes" or "no". With radiobuttons, we can write an explanation for every possible option.
- for a yes / no decision where both cases need an explanation, we should use a pair of radiobuttons instead of a single checkbox.
- with a selection dropdown, we can label the options, but there is no space for long explanations. The benefit of selection dropdowns are: less waste of screen space, enough space for tons of options, no distraction by inactive options.
- incremental explanation: the first two or three words in an explanation should be enough to give a rough idea what the option does. A longer explanation can be added in smaller font, in a new line, in a tooltip, or on a new page.
How not to do it
In many places in our site we can still find long and redundant explanations, of the kind
- "if you click the button down there.."
- "if you choose 'no' in 'send me spam about your services', you will not receive newsletters. if you choose 'yes', you will receive all newsletters."
Examples:
- verifymembers page
- personal startpage on test: "Start now to Search for members (by place or username) in the field on the right, add a friend or explore BeWelcome! If you hosting status changed, use the dropdown on the right or go edit your profile"
- to fix: remove some words, add links
Using such texts is a fatal mistake in a website. They are
- too long, no one reads it.
- in the wrong place, not connected with the control they explain.
- every if/else, and every additional level of negation ("if you NOT choose NO ..") makes the system more complex to understand.
Links and References
- nielsen, on radiobuttons vs checkboxes long read, can probably be said shorter
- What Makes a Web Form Usable or Unusable
- Usability Tips You Can Use: Designing Forms for Keyboard Access is more about labels and shortcut keys
There's a lot more of this somewhere on the web, and in printed literature.


