12 form design best practices for 2023

Digital forms are powerful tools that you can use to harvest customer data and generate leads for your sales and marketing teams. The question is, how do you create a form field that’s easy to understand and complete while simultaneously enticing users to give you their personal information?

While there’s no one-size-fits-all form design, you should strive to create an online form that helps users provide the desired information quickly and accurately. To do that, you’ll need to apply some design best practices.

To help, we’ve compiled a list of a dozen tips and techniques for designing engaging, user-friendly forms that boost conversions, including:

• Have simple form fields
• Use single columns on forms
• Communicate errors clearly and kindly
• Validate inline form fields
• Order fields from easiest to hardest to fill
• Automate autofills
• Indicate between required or optional fields
• Minimize drop-downs
• Avoid the “clear fields” button
• Don’t mask passwords
• Enable the ability to tab to the next form field
• Include smart defaults

Form design best practices

Optimizing form design is a simple and effective way to boost conversions and harvest consumer data for marketing and sales purposes. Choosing the right form fields contributes to a positive user experience (UX) and encourages participation. On the flip side, poorly designed forms don’t get completed by the audience as frequently — so they won’t produce the intended result.

While it may be tempting to include a broad range of fields in your form design, it’s best to keep your forms simple and easy to use. Otherwise, customers may not take the time to put in the valuable information needed to complete their journeys.

Applying a few form design best practices and prioritizing a simplistic, user-oriented design can also increase the return on investment of your marketing efforts by increasing sales.

These best practices are general tips and techniques that you can use to form your design strategy. Make it a point to choose the appropriate combination of approaches based on the industry you operate in, the needs of your customer base, and other organization-specific factors.

The following are some best practices you should consider integrating into your form design processes.

1. Have simple form field

Customers don’t like spending a lot of time filling out forms, so it’s important to keep things concise and have as few fields as necessary.

Instead of attempting to gather as much information as possible from the initial form, go for a straightforward presentation. Generally speaking, you should stick with the basics, such as the individual’s name, email address, and a few other select fields. If you operate in the B2B sector, you could also consider asking users to provide their employer and title.

Publishing lengthy forms increases the chances that users will abandon them before completing them. With that in mind, you should make it a point to keep your forms direct and to the point.

2. Use single columns on forms

When designing forms, make sure you use a single column as opposed to creating two or three columns. A single-column format allows users to easily move from field to field as they scroll down the screen. They can effortlessly follow along with the form and provide the requested information.

Promoting better user comprehension via a simplistic form layout can reduce feelings of privacy and security concerns. Additionally, the single-column approach makes it easy to present your fields and questions clearly and transparently.

Perhaps most importantly, single columns can be filled out quickly. The faster a customer can complete the form, the more likely they are to submit it.

If you find yourself struggling to condense your form fields to a single column, you likely have too many fields to begin with. In this instance, review all of your fields and remove any that don’t prompt the submission of necessary or pertinent information.

3. Communicate errors clearly and kindly

Users are bound to make mistakes when filling out forms, no matter how well-designed they are. While it will often be necessary to notify them of these errors, it’s important to do so in a positive way.

Compose messages in such a way that the user doesn’t feel blamed or embarrassed. Instead, use neutral and non-offensive language.

For instance, imagine that a user has entered an incorrect email address. Instead of displaying messaging that reads “Your email address is incorrect,” consider phrasing like “The email address could not be verified.” Communicating errors gently will reduce feelings of stress and encourage the user to go back and fix their mistake.

Ensure that your error messages are both positive and clear. If a message is confusing or fails to provide clear guidance about what needs to be done to remedy the issue, users may be more likely to abandon the form.

4. Validate inline form fields

Inline validation is the process of verifying form field data as it’s entered. Validating form fields in real time prevents erroneous, incomplete, or intentionally falsified data from being uploaded to your customer relationship management database.

Inline validation tools will check for common errors like typos. They can also verify addresses and email addresses.

Verifying email addresses is an important part of keeping your CRM data clean, especially if you’re offering users access to gated content. Some users may be tempted to provide fictitious email addresses in order to unlock your gated content so they don’t have to opt-in to receive a tidal wave of marketing or sales messages.

Validation can also be employed to ensure that users enter their credit card information correctly. Verifying payment information can reduce friction during checkout, reducing the likelihood that users will abandon their carts.

5. Order fields from easiest to hardest to fill

When designing forms, it’s vital that you arrange the included fields in order of difficulty or complexity. For example, you’ll want to have users put in their names, email addresses, and other information they can easily recall before asking for things like their credit card numbers.

Structuring your form fields from easiest to most demanding ensures the user is already invested in completing a form before they’re forced to retrieve their credit card or pause to recall a piece of requested information.

If a user has completed the majority of a form and has to stop briefly to complete one of the final fields, they’ll most likely follow through. If you ask for information that is harder to retrieve in the opening field, on the other hand, they may not even bother filling it out in the first place.

6. Automate autofills

Most browsers now have the option to autofill forms using information the user has supplied in previous forms. By allowing customers to autofill forms using information stored on their browsers, you can remove friction from this process and streamline the customer journey.

To facilitate automated autofills, label each field with a common attribute or term that browsers like Google Chrome can pick up on. This will tell browsers and the user that your form supports autofills.

7. Indicate between required or optional fields

When designing your forms, it isn’t a good idea to make every field mandatory. Doing so will negatively impact form completion rates, reduce the amount of user data you gather, and add undue difficulty to the customer journey. Instead, use a combination of required and optional fields to give users more control over which information they provide during sign-up.

Once you’ve determined which fields will be required and which will be optional, identify them clearly. Mark mandatory fields as “required” using direct verbiage and an asterisk. This will improve the user experience and encourage more privacy-conscious consumers to complete your forms.

You can also include summary boxes with select fields. These are usually indicated by a small circle containing a question mark. When a user hovers over the symbol, another box will appear and provide a brief explanation as to why you’re requesting that information.

Typically, businesses will include summary boxes with any field that may elicit concern, such as one asking for the consumer’s credit card information or zip code.

8. Minimize drop-downs

Drop-downs should be used sparingly, if at all. While incorporating drop-downs into your form design may seem like a way of streamlining the data entry process, the opposite is actually true. Drop-downs halt a user’s flow. In the worst-case scenario, these interruptions can cause users to abandon your form.

Imagine you’ve chosen to add a drop-down for the “birth year” field on your form. Ordinarily, the user could simply type in their year of birth and move on to the next field. If you have a drop-down, however, they’ll have to pause, scroll, and select the appropriate response.

This kind of procedural tedium can be extremely frustrating for the customer, especially if they’re already apprehensive about completing the form in the first place.

In lieu of drop-downs, use open fields that allow users to simply type in their desired response. As long as your back-end software is designed properly, your CRM will be able to sort through these open-ended responses easily and structure the resulting data.

9. Avoid the “clear fields” button

Have you ever reached the end of a form and accidentally hit the “clear fields” button instead of “submit” or “save?” If so, you almost certainly abandoned the form out of sheer frustration unless, perhaps, completing it was non-negotiable.

The sudden loss of all previously recorded form data is all the reason most users need to click away from a form and never look back. As such, you’ll want to omit the “clear fields” button from your form design to avoid any potential mishaps.

That way, if a user needs to delete the information in a specific field, they can easily click on or tab to that box and make the necessary adjustments. If they want to delete everything and start over, they can simply refresh the page.

There are many different ways users can reset a form and start anew, which is why there’s no need for a “clear fields” button in your design.

10. Don’t mask passwords

Masking passwords is often viewed as a means of strengthening account security, but this simply isn’t the case. Masking passwords rarely if ever increases security. Instead, this practice can easily lead to lost business due to login failures.

Users should always be able to see their passwords as they type it in. Watching a row of uncountable asterisks pop up can be discouraging for users when they’re unsure whether they’re using the wrong password or simply typing in the right one incorrectly. Unmasking their password removes this doubt and allows them to access their accounts quickly.

By the same token, ensure that email addresses or usernames don’t get deleted when customers input the wrong password. Having to enter a password multiple times due to typos is frustrating enough — if they have to re-enter their username or email address, they’ll likely become exasperated in a hurry.

11. Enable the ability to tab to the next form field

Many users prefer to use keyboard shortcuts instead of transitioning back to their mouse after completing each field. You can speed up the form-filling process by enabling shortcuts like the ability to tab to the next form field. With a few presses of the “tab” key, customers can complete a brief form and go about their business in a matter of seconds.

The use of tab keys and other keyboard shortcuts has become increasingly common due to the prevalence of laptops among computer users. In 2022 alone, nearly three times more laptops (207 million) were purchased than desktops (68 million). While it’s possible for laptop users to link a mouse to their portable devices, they’re more likely to use the equipped touchpads or keyboard shortcuts.

Supporting the usage habits of modern consumers with your form designs is a great way of bolstering participation and optimizing submission rates.

12. Include smart defaults

Enabling smart defaults also serves to accelerate the form completion process and ensure its accuracy.

Smart defaults use information like your users’ current locations to enter details into form fields on their behalf automatically. For instance, they can reproduce saved data like addresses and postal codes so users don’t have to enter this data manually. Combining smart defaults with automated autofills can significantly increase form completion efficiency.

With the right design elements in place, you can enable users to complete and submit a form in under a minute. And when you make filling out forms and providing information effortless, you eliminate potential sales barriers and increase your ability to harvest valuable consumer data.

Simplify forms design processes with Adobe

Online forms should boost conversions by helping users complete them quickly and accurately.

If you want to create more user-friendly forms, incorporate the best practices outlined here, being sure to design every feature with the customer in mind. Keep things simple, only request pertinent information, and leverage tools like smart defaults and autofill to expedite the form submission process.

Want to simplify the process of designing forms to remove friction from the customer journey and support your lead generation efforts? If so, Adobe Experience Manager and Adobe Experience Manager Forms can help you start building personalized forms to align with your customers’ unique needs.

To learn more, take a tour of Experience Manager Forms.