Form design
Designs forms so people can complete them easily and correctly: what to ask, how to word it, how to order it and how to flag errors.
What problem it addresses
Signing up, paying or completing a public service almost always goes through a form. If a question confuses or an error isn't explained, people make mistakes or give up.
Principles
Ask only what you need
Every field takes effort; if the data won't be used, it doesn't belong.
Talk like in a conversation
Clear questions, in a logical order, with labels that say what is expected.
Help people fix it
The error is shown next to the field, in words and not only in color, and says how to fix it.
Applications in design
Use it like this
Before drawing fields, list what you need to know and what you'll use each piece of data for.
Avoid
Putting the help text inside the field as the only label, since it disappears once you start typing.
Don’t fall for it
Test the form with real people and real data, including data that doesn't fit your format.
Connections
Related to
Authors and works
- 2008
Caroline Jarrett and Gerry Gaffney
Described a good form in three layers: the relationship with the person filling it in, the conversation of questions and answers, and its appearance.
- 2008
Luke Wroblewski
Gathered best practices on labels, fields, buttons, help, errors and inline validation, backed by usability studies.
- 2014
W3C WAI
Published a guide to accessible forms, with labels, instructions, validation and notifications that screen readers can also convey.
Sources
Original sources
- Jarrett, C., & Gaffney, G. (2008). Forms that work: Designing web forms for usability. Morgan Kaufmann.
- Wroblewski, L. (2008). Web form design: Filling in the blanks. Rosenfeld Media.
Secondary sources
- W3C Web Accessibility Initiative (2014, actualizado en 2026). Forms tutorial. E. Eggert & S. Abou-Zahra (eds.). View source: W3C Web Accessibility Initiative (2014, actualizado en 2026)
Last reviewed: