The best contact forms shine when it comes to usability and intuitive design. Taking the time to build a better contact form will repay you by boosting your conversion rates and improve the user-friendliness of your website.
Your website can be easily let down by a difficult or clunky contact form. Your contact form should never be an afterthought, after all, it exists to secure those all-important leads!
To perform well, your contact form should offer great design, functionality, ease of use and ultimately motivate user engagement.
10 Tips for Creating a Better Contact Form to Improve Conversion
1. Cut out the hard work
You want your visitors to complete your contact form, so make it easy for your users to find, not hard work.
Label your contact form clearly in your navigation menu, naming it something that makes it obvious, such as “Contact Us”. Keep your title both simple and concise.
With over 50% of all website page views coming from mobile devices, it is essential your form is mobile compatible. It’s recommended you check the form by completing it yourself from both a desktop and a mobile device to ensure your form’s functionality.
Choose your layout, focusing on simplicity and readability.
Your form’s design should always reflect the design of the rest of your website, including fonts. Keep your users in mind, some of whom will be accessing your form from mobile devices, take care not to make your form too small to be easily read.
4. Keep it to one column
A vertical single column contact form is the most user-friendly solution for your contact form.
Keeping to one column means your user only needs to input one piece of information at a time, keeping the layout simple, easy to complete and understand.
5. Use logic
Visually grouping information into related blocks will make your form easier to complete.
Logically setting out your form will create a flow – for example, you ask for your user’s first name, then their last name, rather than the other way around. Users generally rush to complete forms and if completing your form is overly laborious, or in any way difficult, you risk having your users bounce away.
Label your fields clearly, with your labels aligned left, and sitting above the field input box wherever possible. When viewing your form on a phone this makes it easier to fill in the form. If the label is placed underneath your field, the scrolling up and down can cause some users unnecessary frustration. Placing your form above the fold will also aid conversion.
6. Less is best
Shorter forms are more likely to be completed, so limit your fields and ditch the unnecessary information. Remember, you can always gather further information at a later date when your relationship with your potential customer is further developed.
You do not want to risk losing your visitor’s attention as research suggests user attention is both hard won and easily lost.
7. Take it step-by-step
Forms that let you know when there is an error as you are completing the form by providing an instant alert make a big difference. No one likes submitting a form only to be then alerted to an error made much earlier.
Wherever possible, ensure you highlight for your user where the cursor is sitting on your form. This way, if your user is interrupted, they can easily pick up where they left off.
Always use validation where you are able (whether it is confirming an email address’ format, providing postcode validation or validating an entire address) as validating data inline saves time and improves usability.
If you are not familiar with inline validation, it is worth noting that when it comes to completing forms online, inline validation is quickly becoming expected by web users. One study conducted by the Baymard Institute reported that around 60 percent of online forms are now using inline validation.
8. Form killers
There are certain fields of information that are considered ‘form killers’; ask for these and you will almost certainly find many of your users say ‘No, thanks’ and click-away.
So what are these absolute contact form turn-offs? The first is CAPTCHA (see below for more detail on this point). The others include mandatory input of phone number/s, requiring a birthdate and/or age is provided, asking users for their location, difficult copy and automatic newsletter sign-ups (with no option to opt-out). If you would rather have your lead’s email address than risk losing it over a mandatory demand for these additional pieces of information, then set these fields to optional (if you must ask for them at all).
Remember, asking for unnecessary information (such as asking users on a payment page to click on what type of credit card they are using: American Express, Visa, Mastercard, etc) adds length to your form, which can lead to your users becoming less engaged and leaving web pages.
10. Avoid security hassles
Contact forms need to walk the line between usability and security without compromising either. CAPTCHAs are usually installed as an anti-spam solution, and can negatively affect conversion rates.
Did you know that according to a recent research study, companies using CAPTCHAs on their web forms could be losing more than 3% of all conversions from their forms?
If you are still determined to use CAPTCHA on your forms, be sure to do so before your user submits your form, and never afterwards. Your users may be annoyed if they believe they have completed your form, only to discover they have to jump through more hoops at the end.
Avoid making any part of your form overly difficult. If you decide to use CAPTCHA, be sure to choose to use a simple version, such as Google’s reCAPTCHA with its’ “I’m not a robot” check-box, instead of the more complicated versions whose images are often impossible to crack or decipher.
10. Reinforce your offering
Your copy should inform your visitor as to what is required from them when completing your form - and also reinforce what they will receive in return for submitting your form.
We recommend personalising your “Submit” or “Send” button creating a direct call-to-action. For example, you could use “Sign me up!” or “Subscribe me” for a newsletter sign-up form or, depending on the purpose of your form, you might like to use “Get in touch”, “Create my account!” or “Join now”.
It may seem obvious, but ensure your final action button is easy to find and clearly visible. Select a colour that will attract attention and place the button where it will be within view of the user as they complete the final field in your form.
Have your button let your users know that their form has been submitted where possible – often, you can have your button change colour or deliver a simple “thank you” message when the final button has been clicked.
When following best practices across your website, you should aim to always keep usability in mind. Little things like your contact form can make a huge difference to your user’s overall experience, so consider applying some of these same principles to other forms in use throughout your website, as well as your checkout pages.
Following our key steps when designing your contact form can help entice potential customers to contact you. When they do, be sure to repay their effort by following up with a personalised message, soon after their form is submitted.
One of the simplest ways you can safeguard your business website’s contact form’s chances of converting visiting people into getting in touch, and ultimately becoming paying customers, is to use a web design agency.
If your existing website isn’t converting interest into customers - then it really isn’t playing its part. It’s never too late to seek out expert advice. With over 10 years experience, Pixel Fish are renowned for creating engaging websites that convert!
Take that next step and get in touch with Pixel Fish. We can arrange a time to sit down with you for a website planning session so that we can gain a clear idea of the look and feel you envisage for your website, and ensure your website’s navigation, contact forms and content is perfect.