Forms that Work

Designing Web Forms for Usability

  • Steve Krug
  • By

    • Caroline Jarrett, Effortmark Ltd, Leighton Buzzard, UK
    • Caroline Jarrett, Effortmark Ltd, Leighton Buzzard, UK
    • Gerry Gaffney, Information Design and Proprietary Ltd, Kingston, Australia

    Forms are everywhere on the web – for registration and communicating, for commerce and government. Good forms make for happier customers, better data, and reduced support costs. Bad forms fill your organization’s databases with inaccuracies and duplicates and can cause loss of potential consumers. Designing good forms is trickier than people think. Jarrett and Gaffney come to the rescue with Designing Forms that Work, clearly explaining exactly how to design great forms for the web. Liberally illustrated with full-color examples, it guides readers on how to define requirements, how to write questions that users will understand and want to answer, and how to deal with instructions, progress indicators and errors.
    View full description


    HCI professionals, web designers, software developers, user interface designers, HCI academics and students, market research professionals, financial professionals


Book information

  • Published: November 2008
  • ISBN: 978-1-55860-710-1


“The humble form: it may seem boring, but most of your website’s value passes through forms. Follow Jarrett & Gaffney’s guidelines, and you’ll probably double your online profits.” - Jakob Nielsen, Principal, Nielsen Norman Group “This book isn’t just about colons and choosing the right widgets. It’s about the whole process of making good forms, which has a lot more to do with making sure you’re asking the right questions in a way that your users can answer than it does with whether you use a drop-down list or radio buttons.” - Steve Krug, Foreword author and author of the best selling Don’t Make me Think “If your web site includes forms, you need this book. It's that simple. In an easy-to-read format with lots of examples, Caroline and Gerry present their three-layer model -- relationship, conversation, appearance. You need all three for a successful form -- a form that looks good, flows well, asks the right questions in the right way, and, most important of all, gets people to fill it out.” - Janice (Ginny) Redish, author of Letting Go of the Words -- Writing Web Content that Works

Table of Contents

Introduction: What is a form?What is a form? 1. Persuading people to answerPick the right moment to ask a questionThink about relationship question by questionFollow three rules that that influence response ratesThink about who will answer your questionsSummaryInterlude: Registration forms: rules and suggestions2. Gathering the right informationFind out why you need the informationCheck if your organization already holds the informationFind out what others ask forSummary: only ask for information that you needCase study: conference registration form3. Making questions easy to answerHow questions workMake it easy to understand the questionMake it easy to find the answerJudging the answer: avoiding privacy errorsPlacing the answer: avoiding category errorsSummary: writing questionsCase study: avoiding choice points4. Writing instructionsWriting instructionsRewriting instructions in plain languageCut the instructions that aren't neededMove the instructions to where they are neededA before- and after- exampleSummary: Writing instructionsInterlude: help for forms5. Choosing between drop-downs and other controlsPicking controls for your formsHow users expect controls to workUse these six questions to choose the right controlSpecialist controls may helpThink about the form as a wholeSummary: Providing the answerInterlude: names and addresses6. Making the form flow easilyMake the form flow easilyUse progress indicatorsAvoid surprising users with sudden changesBe gentle with errorsSay ‘thanks’ to close the conversationConversational flow – summaryInterlude: why we hate pop-ups7. Taking care of the detailsTaking care of the detailsWhere to put the labels compared to the fieldsColons at the end of labels?Sentence or title case for labels?How to indicate required fieldsChoosing legible text: fonts and wordsSummaryInterlude: serif or sans-serif8. Making the form look easyWhat makes a form look goodMake sure users know who you are: logos and brandingMake your form look tidy with gridsMake it look organized with groupingAvoid two-column formsSummaryCase study: an appearance makeover9. Testing (the best bit) We're passionate about usability testingHow to do really good usability testing of formsFinal message from this bookAppendicesSuggestions for further readingReferencesAcknowledgements