Forms that do not lose people

Order matters as much as length

Ask in the order a person would naturally offer the information. Name, how to reach them, what they need. A form that opens by asking how you heard about us puts a question for the business ahead of anything for the customer.

Put anything that feels intrusive later, once somebody has invested a little. The same question asked at the end is answered far more often than the same question asked first.

Our page on forms that get filled covers field count. This page is about everything else, which together matters at least as much.

Labels above the field, always visible

A label that disappears once somebody starts typing leaves them unable to check what they entered, which is exactly when people abandon a longer form.

Placeholder text is not a label. It vanishes on focus, it is frequently too low contrast to read, and it is skipped by some assistive technology entirely.

Our page on accessible forms covers the requirement properly. This is the single most common form fault and it is trivial to fix.

Never lose what somebody typed

A form that empties itself on an error loses nearly everybody. It is still common, and it converts a small correction into a decision about whether the business was worth the effort.

The same applies to navigating away and back. Preserving entries is a small piece of work that saves the enquiries from people who went to find a reference number.

Validate as somebody finishes a field rather than only on submission, so a problem is caught next to the field that caused it rather than after everything is filled in.

What keeps people moving through a form

The list below is what separates a form people finish from one they start. None of it is about reducing fields, which is covered elsewhere and is only half the problem.

• Questions in the order a person would answer them
• Labels above fields and always visible
• A reason beside anything unexpected
• Errors beside the field, in words
• Nothing cleared when something goes wrong
• Visible progress on anything longer than a screen
• A submit control that says what happens

Show how much is left

Uncertainty about length is its own reason to abandon. Somebody who cannot tell whether they are a third or a tenth of the way through assumes the worst and leaves.

For a long form, break it into named steps and show which one they are on. That converts an unknown quantity into a short list, which people will finish.

For a short form, simply showing the whole thing at once is the honest version of the same reassurance. Hiding three fields behind a continue button makes a short form feel long.

Choose inputs that suit a phone

A long dropdown is painful on a touch screen and a date picker is worse. Where a plain text field would do, use one, and where a choice has fewer than about five options, show them all.

Set the field type so a phone shows the right keyboard. A number field that brings up a full alphabet is a small friction repeated on every mobile visit.

Our page on mobile layout covers the wider point. Forms are where a desktop-designed page most visibly fails on a phone.

Test it as a stranger

Fill in your own form on a phone, with one thumb, having not built it. Most faults surface in the first thirty seconds and almost none are visible while looking at the design.

Then deliberately make a mistake and see what happens. The error path is where forms lose people and it is the part nobody tests, because building it felt like the end of the job.

Then have somebody else do it while you watch and say nothing. Ten minutes of that finds more than any checklist, including this one.