Online forms are created to gather information from site visitors. Forms can be as simple as an online contact us form or they can be complicated — like forms that take payment to buy an item, or forms that are full of protected health information, like pre-registration forms.
Whether it’s a simple form or something more complicated, providing information should be easy and seamless for your site visitor. Form design impacts your website’s overall user experience (UX), and the better the experience, the happier the site visitor is with your brand and the more likely they are to buy or engage.
But great form UX is not always the standard. We’ve all encountered forms that are much too complicated or too long, that likely result in high abandonment rates.
If you’re looking to take full advantage of online forms to make it easier for your site visitors to contact you, apply for a job, or sign up for an event, here are some tips to keep in mind on everything from your form’s layout to your call to action.
Questions to Ask Before You Begin
Before digging into best practices, it’s best to make sure you’re ready to build the form. Here are some common questions to answer before creating an online form for your organization:
- How is the form going to be used? Is this the first step in a process? If so, be sure to document what happens after the form is submitted and make sure all necessary stakeholders agree on the process and steps.
- Who is filling out the form? Think about the demographics of your target form users and how comfortable they will be with sharing information and maneuvering different elements in a form.
- What devices will they use? Check out Google Analytics and see which devices your target audiences use when visiting your site. Then, be sure to plan accordingly so that your forms work well on desktops, tablets, and smartphones, if needed.
- What happens after “send”? Sometimes the most complicated part of the form is the workflow — be sure to know who needs to access the data submitted before building.
- What is the minimum information you need to gather? Think about the minimum amount of information that will help the site visitor take the next step while also giving your internal teams what they need to act. Be careful not to ask for too much information; the more fields you include, the higher the abandonment rate. In fact, it’s reported that the form length that results in the highest conversions is 5 fields.
7 Form Design Best Practices
When you’re ready to begin designing, be sure to keep these seven form design practices in mind:
- Keep it simple. This is true for all aspects of your form. Get rid of unnecessary fields, use logic to create intuitive experiences, and write form headings that are clear and succinct.
- Write helpful error messages. There are few things as frustrating on the web as form error messages. Errors happen when someone enters an incorrect piece of information in a web form, such as a phone number that isn’t using the expected formatting. An effective error message quickly and clearly explains to the user what they’ve done wrong, helps them locate the issue, and gives directions to help them fix it.
- If you must collect a lot of information, use multi-step forms. A multi-step form is simply a long form that is broken into multiple pieces. They make forms less intimidating and allow site visitors to provide the information in smaller chunks. This improves user experience and increases the likelihood the user will fill out the entire form.
- Consider structure and layout. If you use a proven online form builder like Formulate, user interface best practices are already built in. But be thoughtful about the order fields appear and how the form appears on the webpage.
- Test on different devices and browsers. Due to the ever-increasing reliance on tablets and smartphones for web browsing, forms today must be responsive, or able to adapt to different screen sizes. But they should also go beyond just responsiveness and also incorporate mobile form best practices, such as more tap-based user interfaces and easy to use elements such as checkboxes or dropdowns.
- Make it secure. Your site visitors are trusting you with their information. You must protect it. And, if you’re asking for credit card numbers or health information, you’re legally bound to certain compliance regulations like HIPAA and PCI. Don’t take a chance with an unproven online form builder. Make sure you select a platform that was built with a thorough understanding of how to collect, store, and share information.
- Motivate the users to submit. Your form flows toward one, big, action: submit. In addition to removing obstacles on the path to conversion, the copy around the form should remind users of the benefit they’ll get for filling out that form. Even the call-to-action (CTA) button can make a difference. Make the button eye-catching and use conversational, action-oriented copy like “Save My Seat” or “Create My Account” or “Start a Free Trial.”
Start Designing
Now that you have a solid understanding of how to keep user experience in mind when designing web forms, it’s time to start publishing and see how they perform. Don’t be afraid to do some A/B testing on different fields, form length, and calls to action. If you’re in the market for an online form builder that offers powerful data management and works across diverse platforms, be sure to sign up for a demo of Formulate. It was built with user experience in mind!