Build better online forms
When did you last rush enthusiastically into the office to design an online form? Yesterday? Last week? Last month? Never? Online forms aren’t the most exciting aspect of web design, but they are a vital ingredient of your website. If not designed carefully, with your visitor in mind, they can seriously affect your conversion rates. This post will tell you what you need to know to make sure your online forms are user-friendly and collect the information you need, rather than the information you don’t. Let’s get stuck in and transform your online form into a stress-free conversion booster!
Make the form as short as possible
Cut out any fields that ask for information you don’t need. Is it necessary to ask your clients to enter their password twice? And can you make the billing address the default for the shipping address so they don’t have to type it out again? By making it as easy as possible for clients to enter their details, you are saving their valuable time and reducing the likelihood that they will leave your site and go elsewhere.
A newsletter sign-up form for example, simply requires an email address. Your aim is to encourage your clients to subscribe and stay in-the-loop with your brand and, by doing so, generate leads. It’s at that point you can collect any additional information you need.
How to create a form for newsletters – as shown by Hubspot
Remember too that everything that clients find frustrating about filling in forms can be ten times worse when using Smartphones. And it’s just as likely that your clients will be visiting your site on a smartphone or tablet rather than a laptop or desktop.
Explain why fields are necessary
Ever filled in a field and wondered why the company needed that piece of information? There should always be a good reason. Tell your client what it is. This can be easily achieved by inserting a small clickable question mark icon next to the relevant field which opens up to explain why you need the field completed.
Barclays Bank using question mark icons offering users extra information to help them through the online form filling process.
Stage the collection of information
Ask yourself whether you need all the information right now. You don’t need to collect your client’s life history in one go! If you really need to do so, collect that amount of detail over time.
The effects of postponing the collection of information can be very powerful as it encourages a long-term relationship with you and your business.
Arrange questions in a logical order
- Do the questions start with the easiest to answer and become more detailed?
- Does each question follow on from the one before it?
- Are your questions clear and unambiguous?
If you can say ‘Yes’ to all three, then give yourself a pat on the back.
People are used to seeing website forms which follow this format. Familiarity makes it easier for your clients to complete the form and they are more likely to return to your website afterwards.
Remember page state if user exits
So you’ve got a customer with a shopping cart full of profitable items for your business. They’ve just completed a detailed but well-designed form. They’re ready to part with their hard-earned cash and are about to check out. At the critical moment, they lose their wi-fi connection. A couple of minutes later, they’re back online and they return to your checkout…only to find that the form has been reset and their cart is empty.
Will your customer start the process again? And if they do, will they give you repeat custom after their unfortunate experience?
Make sure your form can remember the page state so your customer doesn’t need to go back to square one. A happy customer is likely to be a returning customer.
Get rid of those infuriating CAPTCHA fields
In a recent survey, conducted at Deuce Creative HQ, we agreed that CAPTCHA forms are the most infuriating aspects of online form filling.
If you’re not familiar with the term, CAPTCHA is a method of confirming that a visitor to your website is human…even if they don’t feel it on a Monday morning! The user reads a series of letters or numbers and types them into a required field, reducing the chance of robots using the form to send you spam. CAPTCHA forms are not always easy to read and it may take two or three attempts before the entry is confirmed as correct.
An example of a CAPTCHA form that is meant to be ‘readable’.
Research shows that using CAPTCHA forms decreases conversion rates on websites, and that there are other methods you can use instead.
Use inline validation
‘Inline validation’ means ensuring that each field is completed correctly as the user is filling in the form. This is helpful to your visitor as they won’t accidentally miss a field and makes it more likely that the entire form will be submitted.
Twitter have nailed their sign up form with inline validation.
Use postcode look-up
This is one of my personal favourites. By entering their postcode, a ‘search for address’ button can save your client time typing out their whole address. Using a dropdown bar, your visitor simply selects their address and they’re done. Making life easier for the user enhances their experience on your site – the ultimate goal of web design.
Reassure users that their information is secure
In an age of increasing concerns about privacy, we need to feel secure when submitting sensitive data. Gain your customers’ trust by letting them know that their information is safe by using industry-recognised security measures.
Retail websites such as Play.com, for example, describe themselves as being ‘Norton Secured’ and ‘Verified by Visa’ on their checkout page to reassure their customers that their personal data is secure. If your customer feels comfortable when checking out, they are more likely to return to your site and buy from you again.
As found on Play.com website.
None of us like filling out forms but until there are quicker, more reliable and more efficient methods of submitting our details, they’re here to stay. The designing of forms can be overlooked as an important part of the customer relationship building process. Make completing forms as easy as possible and your clients are more likely to return to your website and do business with you again.
So, let’s recap on the main points:
- Ask only for the information that you really need.
- Tell clients why you need their information.
- Stage collection if you need to gather detailed information.
- Start with easy questions and build to more complex ones.
- Make sure that each field follows from the one before it.
- Ensure that visitors’ details are retained if they lose connection.
- Avoid CAPTCHA fields.
- Use inline validation.
- Use postcode look-up.
- Reassure users that their information is secure.
Do you have any other tips or great examples that you would like to share? We’d love to hear from you.
Thanks for reading!