Forms are essential to most website experiences, particularly checkouts. Optimised forms will win you sales, while forms that aren’t (or are badly optimised) will lose money.
Thankfully, form optimisation is not a complex process; you just need to follow some relatively simple steps.
A form needs to be conversational—it’s a major part of the dialogue between visitors/customers and a website. So, there needs to be common ground, and that is in using familiar language. Your customer needs to be able to understand the language of your website.
And, the best way to communicate is to use their language and not words and phrases favoured by your own organisation. Surveying real people who use your website and feedback from your customer services and support teams can also help with learning your customers’ vocabulary and language style.
The last thing customers expect are hidden costs, so if there are any costs associated with filling out the form, e.g., shipping, postponed subscription fee, make them clear now and not later.
A bit of social proof messaging can help get their commitment. And, make it clear that the details you require from them have a purpose, will be held securely, and won’t be shared with third parties.
Forms are part of a call to action—you ask your visitors/customers to fill them out so that something happens in return. So keep focused on what that is. Don’t meander off by asking for information that is not necessary for the transaction.
People do expect to give certain information that they feel is reasonable, but chances are your form contains optional fields that ask for additional details that aren’t relevant at this stage. The best thing to do is get rid of those optional fields—there will be opportunities to ask for extra information further on in your customer relationship.
Then also double-check your “mandatory” form fields. Are they all necessary—really? You know what to do if they aren’t—delete!
Also, you can make the form filling process easier by providing smart defaults and autofilling for some fields—address details, for example. Using such automation makes the process more enjoyable by reducing the physical and mental effort for your customers.
Single column forms have proven to be the best choice for website forms; they reduce friction because people just begin at the top and finish at the bottom and don’t need to scan from left to right columns to see what comes next. And, you need to avoid multiple column formats for mobile forms: they simply don’t work on smartphones and tablets because the screens are too small.
Importantly, single-column format avoids confusion over which instruction or question goes with which field. So, stick to single column formats.
Labels positioned close to the input fields reduce mental effort—your visitor will quickly identify which question pertains to which field and so on. That may seem like common sense advice, but it fails to happen in most of the forms that we get to see prior to optimisation.
And, make sure that your button labels are meaningful; use words that encourage customers to click on them and explain what will happen next. You also need to ensure your button has affordance, i.e., it looks like it will do the job it’s supposed to do.
If you need to gather a lot of information about your customer, then “chunk” your related information together and use a progress indicator to show exactly where the customer is in the whole form-filling process. This is motivational as it allows them to complete a series of mini-goals.
As for using “captcha” to deter spam bots, just don’t do it. A/B tests show that removing captchas from forms increase conversions because people aren’t tasked with having to complete a test.
Of course, you could use a “honeypot” technique of using a hidden field that bots will complete and then you could filter out those from the rest of the forms.
And, when they’ve completed the form, tell your customers they’ve done all they needed to do and reassure them that their purchase, subscription, whatever will be on its way.
In an ideal world, your form will be perfectly clear to your customers and they’ll have no problems in completing it. But, as we know, things happen.
Don’t wait to the end of the form to tell them they’ve made an error—or even worse several errors. Validate their answers as they go along. And, importantly use well-worded and clear error messages to guide them back on track.
Testing your form(s) in a professional usability lab is a good idea. This will ensure you’re testing the form on the right people, with the administrator and other experts observing the form filling efforts of the test participants who will be representative of your actual customer audience.
That will give detailed feedback on the form’s usability and enable you to optimise it better. You’ll get a wealth of information back from the various system used by the lab, such as eye tracking, session recordings, facial expression analysis, and so forth.
You’ll also get the opportunity to test the form across different browsers, different devices, and different screen resolutions—and you can check that your form is accessible to everyone coming to your website.
Ok, now that you’ve run all the necessary pre go-live tests on your optimised form, you can make it live. But optimisation doesn’t stop here. Once it’s on your website, you need to keep checking your web analytics and reviewing the form’s performance.
Clearly, you’ll look for more conversions to identify that you’ve taken away the problems for your customers and you ought to be making more sales, etc. Therefore, running an A/B test on your original form and the new variant will help steer you in the right direction.
As you review your data, you will see further optimisation opportunities. And, doing tests on live forms is very rewarding enabling you to gain more customers through making their experience easier and dare I say it more enjoyable.
Read on to… How progressive enhancement can future proof your conversions