Many of our projects involve forms — editing existing forms and creating new ones. We’ve compiled the following list of strategies to help you create forms people will find easy (and maybe even enjoyable) to complete.
Use an appropriate tone
Understanding how people might be feeling as they encounter your form can help you make more informed decisions about the right tone to use. Is your form associated with a high-stress experience or a more benign one? Are you requesting deeply personal, or more general, information? How might this impact people’s frame of mind?
Consider the purpose and situational context of the form you’re designing, along with the type of information you’re collecting. For example, if you’re preparing a form someone will use to secure medical services for a family member, you might use a reassuring, direct tone. If you’re designing a form folks can use to register for a professional conference, you might use a livelier, more jovial tone.
Start with easier questions
In addition to tone, the sequence of your form’s questions can influence the user experience it creates. Start your form with easier-to-answer questions — basic demographic information, for instance — and then work up to more comprehensive or difficult-to-answer ones. Starting with easier questions helps people ease into the experience of completing your form.
Provide enough context
Understanding people’s possible attitudes toward the requests you’re making can help you determine where to provide contextual information and how much to provide. If you’ll be requesting Social Security numbers, financial data, or personal medical information, you may want to share why you need this information and explain the safeguards you’ll be taking to protect it. Providing this context can help users feel more at ease and create a more satisfying interaction.
Design with devices in mind
We strive to design content that’s equally accessible — and enjoyable — across all devices. That said, keeping your users’ device preferences in mind can help you make decisions about form language. If you know most people will be accessing your form on mobile, consider creating shorter field labels. If most people will be accessing your form in the browser, you can create longer, more descriptive field labels without compromising the user experience.
Keep it concise
Brevity is especially pertinent when creating forms. People are completing your form to achieve a certain end; don’t create more work for them by using unwieldy or long-winded descriptions.
Create labels that are concise and to the point — “First name” is much easier to comprehend at a glance than “What moniker do you go by?” Short labels are also easier to read on mobile, and potentially save you money on translations.
Align field length with response length
Fields should be the right size for the information you’re requesting. Fields for capturing a first or a last name or a city of residence can be short; fields meant to capture longer responses — a complaint or request, for instance — should be sized so that people can see what they’re typing before submitting it.
Don’t use placeholder text as labels
Labels should appear above fields, not as placeholder text inside those fields. Using placeholder text as labels can create confusion around which information belongs where (it’s easy to forget what a field is for if it’s not labeled), and it can make form completion more difficult for people with disabilities.
Don’t make optional information required
If a piece of information is optional, tell the user. Requiring only the information that’s truly required will save your users time — something all of us can appreciate. It’s also a best practice to label only optional fields or only required fields, depending on which option is less overwhelming. For example, if your form has four required fields and one optional field, it would make more sense for you to label the optional field.
Follow accessibility best practices
If not designed thoughtfully, forms can present major accessibility issues. Inaccessible forms can impact a range of people — screen reader users, keyboard-only users, people with cognitive disabilities, and those who are mobility impaired, to name a few — creating unnecessary barriers. For more detailed information about how to make forms accessible, see our accessibility guide.
Additional resources
- Form Structure, GOV.UK
- U.S. Web Design Standards Form Controls
- Forms Tutorial, W3C
- Design Better Forms, uxdesign.cc
- Web Form Design: Filling in the Blanks, by Luke Wroblewski