Web developers, especially enterprise web developers, create data entry forms everyday. Unfortunately most never consider the science behind good form design and what will make their customers the most successful. Back in January 2005 Luke Wroblewski published a blog post examining various form layout choices. In 2008 he published an entire book, Web Form Design. This is one book I consider a must have for all web developers.
In this book you will find answers to many questions concerning form layout and usability. Luke bases his recommendations on scientific research. This means either he or someone else performed usability studies on how humans interact with various form layout choices.
For example a common question I am asked by stakeholders and other developers is where to align labels. As Luke says, it depends. Fortunately he goes on to apply research how different label alignments affect usability and in different usage contexts.
Luke does this in each chapter, applying science and research to layout considerations. Each chapter concludes with a bulleted list of conclusions or takeaways.
- Labels should be succinct
- Top aligned labels make the form easier to scan
- Top aligned labels are good for variable length text and multi-lingual situations
- Right aligned labels are good when vertical space is limited
- left-aligned labels are good when users need to scan to learn what is required or to answer selected questions
- labels within inputs are potentially a good idea where space is extremely limited
- be explicit to distinguish labels from data, especially when labels are included in input fields
- be careful when mixing label alignment within the same application
- mixed alignments disrupts scan paths and confuses people
The book includes chapters on the following topics:
- Form Structure
- Form Organization
- Path to Completion
- Input Fields
- Help Texts
- Errors and Success
- Unnecessary Inputs
- Additional Inputs
- Skeleton-Dependent Inputs
- Gradual Engagement
- What's Next
As you can tell the book covers more details about forms than you ever realized. The details are amazing and practical. This is a book that will change the way you approach web development. For $12.99 Luke Wroblewski Web Form Design is well worth the investment to make you a better web designer.