Text boxes and text fields allow users to enter free text into a form.
Use appropriately sized text boxes
Make text boxes the right size for the content they're intended for.
Postcode fields should be postcode sized, telephone number fields should be telephone number sized. Don't forget to accommodate spaces and other optional characters.
Try to use a small set of widths for all your fields, so they align nicely on the page. Use proportional widths for longer fields and fixed widths for small fields, where you know the number of characters they will take.
Don't disable copy and paste
People might have very good reasons why they might want to copy or paste inside a text field.
Really long responses will require extra support
If you're expecting essay-sized responses from people then you'll probably need to support them with one or more of these features:
- save and return
- text formatting
- file attachment or upload
- draft and preview modes
- examples of 'model' answers
- extended or time-out period
- dynamic time-out warning
- character limit indicators
See also: +Additional information
Use character limits responsibly
You should avoid imposing arbitrary constraints on free-text fields if you can, but if you do need to you should follow this guidance.
There are two ways to limit characters. A 'hard' limit stops the user entering any more characters. Typing does nothing. A 'soft' limit will indicate to the user when they have passed the limit, (either through client or server-side validation) but will not stop them typing.
- try to set the limit high enough so that it doesn't affect anyone
- if you can't do this, let people know how many characters are left
- for variable-length input, let people type beyond the limit and then edit it back down
- Problems with character limits:
- If someone pastes into the field, it may not be clear that it hasn't all been pasted.
- If someone keeps typing past the limit, nothing happens, and there's no indication to say why
- Advantages of character limits:
- It can help people to enter specific data from other sources. For example, when asking for a driving licence number, its helpful to have a hard limit so that people can't enter the issue number, which appears directly after the licence number on the card.
Maximum character limits of common fields