Ask for only the information you require – exclude unnecessary information to make the form as short as possible
Text Boxes:
- Minimise the requirement for free text entry to help reduce errors
-
Use drop-downs, checkboxes, radio buttons instead where you know the full set of choices
- Fill in text boxes with default values when possible
- Match the text box length to the amount of data expected – this provides the users with an insight as to what is required
- Where input length is variable, use a consistent length that has enough room for likely answers
Radio buttons:
- Use to select one from a small number of options
- Place the label to the right of the radio button
- Make the label text self explanatory where possible, for example:
- 'Yes, I have read the terms and conditions' ...rather than just ‘Yes'
- Select one of the options by default where appropriate
- CODE:Use <label> to make the label activate the radio button when clicked – this creates a bigger, easier to hit target
Drop-down menus:
- Use to select only one from a larger number of options
- ...or where there is not enough space to fit radio buttons
Check boxes:
- Use to select one or more from a number of options
- Place the label to the right of the checkbox
- Make the label text self explanatory where possible
- CODE:Use <label> to make the label activate the checkbox when clicked – this creates a bigger, easier to hit target
Use two radio buttons instead of a single checkbox when there is a choice between just two options - especially when it is not absolutely clear what the unchecked form of the checkbox would mean. For example:
- Use 'o male o female'
instead of '[] male'
Submit buttons:
- Label with clear indication of what will happen
- If possible, avoid just ‘OK’ or ‘submit’
- Make your buttons look and behave like buttons – such that:
- They have a ‘3D’ appearance
- They ‘press in’ when clicked if possible
- Avoid use of a ‘reset/clear’ button – it is very rarely (almost never) necessary, and liable to be selected by mistake
Notes and discussion points
Required to make a default selection from a set of radio buttons?
Some guidelines state that you must select a default selection when providing radio buttons. In practice, you should not select a default when you want to ensure that the person filling out the form has made a definite choice (rather than risk them submitting the inappropriate default) and where a default choice is impractical, impossible or potentially offensive (for example, it would rarely be appropriate to assume the gender of the person filling out a form)
Multiple selections for drop-downs?
It is unlikely that many of your audience will know how to select multiple options in a drop-down. It is also very fiddly and the multiple choices can only be seen when it is expanded – use checkboxes instead
What about list boxes?
(If you don’t know what list boxes are – don’t worry, just ignore them!). These can be problematic and are rarely used on the Web and, unless unavoidable, use one of the simpler elements