Forms and validation

Forms are where many products make or lose money. Good form design reduces effort and errors.

Structure

• Ask only for what you need. Question every field.
• Use one column, with labels above fields.
• Group related questions and, for long forms, split into steps with one topic each.
• Use the right input type: number keyboards for numbers, date pickers or separate day, month and year fields for known dates.
• Mark optional fields rather than required ones if most are required.
• Never use placeholder text as the label.

Validation timing

Validate when people leave a field (on blur) or when they submit, not while they are still typing. Exceptions include password requirements shown as a checklist. After an error, re-validate as they fix it so the message disappears when the problem is solved.

Error messages

Say what went wrong and how to fix it, in plain language: "Enter a date of birth in the past" rather than "Invalid input". Show errors next to the field and, on submit, in a summary at the top that links to each field. Keep everything people have entered.

Every unnecessary field and confusing error loses people. Forms are often the last step before a sign-up, purchase or application, so small improvements can have large business and social impact. Accessible forms are also a legal requirement in many places.

A council's parking permit form has 24 fields, validates every keystroke ("Invalid postcode" appears after typing "S"), and clears the whole form when there is any error.

The redesign removes seven unnecessary fields, splits the rest into four steps, validates on blur and submit, keeps entered data, and uses specific messages like "Enter a full postcode, like SW1A 1AA". The share of people completing the form online rises and phone calls to the council fall.