Better Way to design Web form

Best way for designing web form



  • Forms should be one column
  • Top align labels
  • Group labels with their inputs
  • Avoid all caps
  • Show all selection options if under 6
  • Resist using placeholder text as labels
  • Place checkboxes (and radios) underneath each other for scannability
  • Make CTAs descriptive
  • Specify errors inline
  • Use inline validation after the user fills out the field (unless it helps them while in the process)
  • Don’t hide basic helper text
  • Differentiate primary from secondary actions
  • Use field length as an affordance
  • Ditch the * and denote optional fields
  • Group related information
Write a comment