Form Design Cheatsheet

Forms are where conversions go to die. Don't let yours.

One column

Single-column layouts are scanned fastest. Multi-column forms break the user's vertical rhythm and get skipped.

Labels above fields

Top-aligned labels are closest to the input and survive translation. Never use placeholder-only labels — they vanish on focus.

Inline validation

Validate as users type, confirm correct entries too (green checkmarks reassure). Never dump all errors only after submit.

Errors that help

Say what went wrong and how to fix it, next to the field: "That date is in the past — pick a future date." Never "Invalid input."

Buttons

One primary action per form. Label it with the outcome ("Create account", "Send invitation") — never "Submit."

Mobile

Minimum 44px touch targets, correct keyboards per field (numeric for phone, email for email), autofill attributes on.