Chances are your website has a form of some kind on it. Whether it be newsletter sign up, requesting a quote or further information, or just a simple contact us form.

These forms are a key part of interacting with, and getting information from, your users so designing the form correctly is key. No-one wants to sit and fill in huge long forms just to sign up to a newsletter or to contact you with an enquiry.

Here are a few tips on how to create a form that people will want to fill in.

Keep it simple

No-one wants to fill in hundreds of fields to ask a simple question or get more information. This means web forms need to only ask what is required and in as few fields as possible, e.g. try a single name field rather than two fields for first name and surname.

Unless you need to know who to direct the enquiry to then there is very little need to ask for a subject, just allow the user to fill in an enquiry field. If you do include more detailed fields then be aware that just looking at the form length can put people off. At very least don’t make all the fields required, only the essential fields.

This principal ties in with Data Protection and GDPR legislation. As a business you are obliged to only store the information needed, so unless you run a veterinary practice there is no need to ask the user their pet's name!

Give feedback

People like to be reassured that they are doing the right thing, its human nature. So give feedback on the form.

For security reasons if the form asks for an email address then it should only accept a valid email address, however what happens if a user makes a typo. The page needs to feedback to the user promptly rather than waiting until the website is submitted. This can be done with a simple tick and cross system showing as the user types or more preferably showing a written message as well.

In a similar vain your form should make it obvious which fields are required. The standard practice for this is a small asterisk (*) against the form label but a note telling users what it means is also helpful, not everyone is tech savvy.

Accessibility

Making the form as short as possible is one thing, making the form easy to fill out is another.

Group similar form items together for example personal details in one section, business details in another. This helps the users train of thought flow through the form rather than having to jump between different areas.

This gives you the chance to think about the information you need and to split the form up using sections which will make the form look easier to fill in.

Form flow

Along with grouping form fields together make sure the user can tab through the fields in a logical order. When filling in a form a lot of people tend to fill in one field and then press the Tab key on the keyboard to skip to the next. Make sure this jump is in a logical order for the form.

Field types

When looking at your form consider how you are asking for the information e.g. if you are asking for someones title you could have a text field for entering Mr, Mrs, Miss, Ms etc but this creates more chances for people to make typos or they may type a variation you aren’t expecting such as Dr, Dr. or Doctor.

Consider using a drop down list of options instead. However be careful with this option as you may need a long list of titles including Prof., Lord, Lady and Major amongst others. this long list will make a users life challenging trying to find the right one.

Along with field types its important to consider mobile devices. With HTML 5 you can set the field type for mobile devices so when typing in a phone number for example the user on a mobile device is presented with their number keyboard rather than a standard QWERTY keyboard.

Default values

Finally, check if you have any fields which are set to a default value. If a user sees that a field is already filled in then they can easily miss a pre-filled value. So unless you are sure that at least 90% of your users will use the default value, then avoid having a preselected value.

Unless you are selling your products online via an eCommerce store then chances are a form is your vital link to new and returning customers, whether they are making enquiries about your services or requesting a quote. Having a long form could be turning away more users than you realise no matter how much money you spend on marketing.

The next time you are on your website go and check out your forms and see if they look appealing and easy to fill out. If not, then it may be time to change it up and improve the number of people filling it out.

Published: 11th Jan 2018

« Back