By: Deborah O’Malley | Updated May, 2021
Now, here’s the third secret: Understanding The Interaction.
Before you can make your forms convert better, you need to understand what’s wrong with them in the first place!
Easier said than done. So, how do you do it?
It’s all about assessing the “pain points.”
Pain points can range from anything like unclear text that confuses visitors to error messages that make it impossible to move forward.
Gauging pain points can be tricky because, as marketers, we’re often so close to the design, or product we’ve created we don’t see the issues with it.
However, you can objectively gain perspective by looking at analytics, or heat mapping data.
Armed with quantitative evidence in hand, you can start by ask yourself these questions:
Evaluating these questions is especially important with long, multi-step forms — where it’s not immediately obvious how users are interacting and where the problems may lie.
If you’ve determined users are dropping off at a certain spot in your form, but you’re not sure where or why, it’s recommended you use a form analytics platform, like Zuko to help identify problem areas.
Then, in a platform like Invision, you can create wireframes that illustratie the navigational flow your users go through.
Note, this advice applies not just to your forms, but also to your entire website.)
Once you’ve isolated the problem area, you can deep dive into that specific element or place to optimize it.
Here are some concrete optimization suggestions:
Ask yourself questions like:
2. Next, explore the visual formatting. Question elements like:
These questions may seem obvious, but they often go overlooked.
Case in point, here’s an example of a real-life checkout form used by an online retailer (who will go unnamed).
Applying the questions listed above, can you spot some of the issues with this form?
Here’s what I’ve identified as the top three issues:
The light grey text on the white background is very difficult to see. The contrast – or lack thereof – may strain users’ eyes, making it seems like a lot of work to fill-out the form.
Recommendation: Change the text color to black, or put a light-colored background behind the form so the text stands out more clearly, and is higher contrast.
When you look at a form at go “ugh,” you know there’s a problem.
In the above example, the formatting makes it look like there’s way more fields to fill out than there actually are. The multi-column format is daunting — and a conversion killer.
In fact, a study by ConversionXL found multi-column forms take 15.4 seconds longer to complete, on average, than single column forms.
Recommendation: Change the formatting so the form fields occupy only a single column. Best yet, test the effect of breaking the form into multiple steps to alleviate the sense of dread a potential customer might feel when hitting the form.
Here’s a great example of a very clearly laid out single column, step-by-step form that shows the user exactly what they’ll be encountering next.
See how short and simple this form appears:
Asking users for their email address and then asking if they’d like to create an account — at the very bottom of the form, after they’ve already filled in all their contact info — is a surefire way to create frustration, and generate poor form conversions.
In general, the fewer form fields you have the better.
In fact, a study by SleekNote found that every additional form field users were required to input decreased conversion rates by 50%.
So, obviously, the fewer form fields the better. Within reason.
There’s certain key information you’ll need from your users, especially if you’re shipping a product and require their address, for example.
Recommendation: Ask for key contact information upfront and, if possible, let the user immediately login, if they’ve already created an existing account. But, make the sign-in process simple.
A sign-in where the user has to remember their user name and password may create equal frustration. If technically feasible, enable existing customers to sign-in through their social media accounts, or through their email address, already saved in your system.
What are some of the ways you’ve found to reduce form friction? And, what would recommend to improve conversions and the user experience with the form example shown above?
Tell us your thoughts in the comments section below.