Form Design Best Practices

A form is a conversation with constraints. The product asks for facts. The person wants to finish. Every extra field, unclear label, and late error message is friction you chose.

Labels stay visible

Placeholder text is not a label. When the person starts typing, the placeholder disappears and the field becomes anonymous. Keep a persistent label. Nielsen Norman Group has documented this pattern for years, and it still shows up in production because empty fields look cleaner in a screenshot.

One column, sensible order

Single-column forms are easier to complete on mobile and easier to scan on desktop. Order fields as the person thinks, not as the database is structured. Name before email is common. Asking for a company size before the person knows why you need it is not.

Validate at the right time

Validate on blur or on submit, then keep the message next to the field. Do not clear the whole form. Do not rely on color alone. Say what is wrong and how to fix it. Required fields should be obvious before submit, not after.

Help text is for the unusual

If every field needs a paragraph, the form is doing too much. Use help for format examples, password rules, and why a sensitive field exists. Put optional fields behind a progressive disclosure when they are truly optional.

Common mistakes

• Using dropdowns for two options when radio buttons would show both choices.
• Reset buttons next to submit.
• Captchas that punish real users more than bots.

Practice this on UI Coach

Settings, checkout, and public-service challenges all live or die on forms. Design labels, errors, and a disabled submit state that still explains what is missing. Accessibility tools in Resources exist to check the result, not to invent the structure.

Sources

• Nielsen Norman Group web form design guidelines
• Nielsen Norman Group on placeholders in form fields