Web
forms can a valuable tool for gathering information from your web visitors, but
they can also be a gateway – or perhaps more accurately a closed gate –
preventing or at least discouraging successful
Form Conversions, whereby
users complete the form to either register on your site, or complete their purchase
checkout process. Because of this, forms
can often be the most important pages in assisting (or limiting) the success of
your web site.
Inevitably,
some percentage of your website visitors will simply quit without completing a form.
Why is that? Some quit because they’re really not that interested in your
product or service, some just because of the unavoidable fickleness of human nature,
but many of them quit because of the poor layout and functionality of the forms
themselves, which is an easily preventable problem.
The
goal of course is always to minimize the percentage of users who abandon the
form and so maximize your user registrations and/or sales. This can be easily
achieved if you follow the steps outlined below:
1.
Use
a Web Analytics Tool
The
first step is to perform a web analysis of your site to statistically measure
visitor behavior, and so determine exactly
how many of your site visitors are abandoning the registration or purchase
process, and at what stage(s) they are doing so. To do this, you’ll need a web analytics
tool. There are many third party web analytics tools to choose from, both free
and paid, depending on your needs. Some of these products are much easier to
use than others, so if you aren’t already using one check out this list of the Top
10 Web Analytics Tools.
Once
you have installed such a tool and used it to accumulate some useful visitor
behavior stats, you can utilize a powerful feature that some of these tools
provide called Funnel Analysis to determine
what percentage of users complete each stage of the registration/checkout
process, i.e. advance from one page to another on your website, including your
form page(s). Many people are shocked at how many of their visitors abandon the
process at the form stage, so it’s really important to conduct a thorough web
analysis using your web analytics tool to ensure your forms are well laid out,
helpful, and easily readable, to give your visitors every incentive to complete
the purchase/registration process.
2.
Keep
Your Forms Short
Only
ask your website visitors for the information you really need on the form. If
your visitors are typical, they’re in a hurry, so don’t make them register on
your site unless it’s absolutely necessary – give them the option to use a
guest registration if possible.
You
should also allow your visitors to complete a purchase or registration without
a lot of optional fields cluttering the form, but if you must include such
fields on the form, make sure it’s obvious that they are optional (a clearly
visible asterisk is ok, but a visual cue such as a different font color or
emphasis on the field prompt, or even including the word optional next to the field is much better). If the user might want
to enter some additional information later, make it easy for them to do so by e.g.
providing a link to their personal profile in your welcome email so they can
easily update it.
Remember,
the visitor’s primary goal is to get past the form as quickly as possible with
the minimum of hassle to get to whatever it is that they were registering for
or purchasing, so make sure your form helps them with that goal without wasting
their time (your chosen web analytics tools should be helpful here).
3.
Make
Using the Form Easy
Make
it as easy as possible for your visitors to complete the form and move on to
the next part of the process. For example, many sites ask registrants to create
a unique user name. If at all possible let them use their email instead (which
is guaranteed to be unique and memorable), but if you really want to offer them
a user name choice, make sure that you give them feedback immediately on the form if that user name is available or not –
otherwise they will spend time filling in the form, click the “Go” button, then
get frustrated because the user name is unavailable (and maybe give up at that
point).
Similarly,
give them immediate feedback on any other information that needs to be in a
particular format (for example phone numbers), but also don’t ask them to
conform to arbitrary formatting requirements (e.g. “no spaces or dashes”).
Instead be flexible by converting whatever they enter on the form (as long as
it’s reasonable) to the format you want.
Also,
don’t make users resubmit the form multiple times because they made one tiny
error on one field. If there are any errors on the form they submitted, make
sure you make it really obvious to the user what those errors are. Ideally put
the error message in simple and easily understood English in a large, bold, red
font next to the field in question, and/or at the top of the form.
One
other essential requirement is to preserve whatever information that a user has
already typed into a form – even if it contains errors, or if they hit the back
button or perform any other similar action. If you don’t then you’re absolutely
guaranteed to lose a lot of frustrated users this way.
Finally,
make sure that you group related fields together on the form, and make sure
that they’re linked in sequence – I’ve had sites where pressing the tab key on
the Street Address field took me to the Age field, not the City field. Needless
to say this is very frustrating for the user and will discourage many of them enough
to abandon the form.
4.
Make
It Really Obvious What To Do Next
This
should be a no brainer, but you’d be amazed at how many web forms I’ve seen which
don’t make it really obvious about how to complete the form and go to the next
step of the process. A simple line of explanation at the top (and sometimes
bottom) of the form is helpful and encouraging. For example: “Fill in all the
fields marked with an asterisk * and click on the Next button below to complete
your registration” would be a good simple explanation to the user.
On
some sites it’s even hard to find the “Go” button to submit the form, which
will definitely reduce your form conversions. If you don’t have a really big, obvious,
highly visible, concise (and preferably brightly-colored) button at the bottom of
the form saying “Register” or “Continue Purchase” or “Next”, or something very
similar, then you should include one. If
your web analytics tools is showing that many people complete the form fields
but don’t click on the “Go” button, then that’s a sign that the button is
either hard to locate or is worded in such a way as to confuse and/or
de-motivate your visitors.
Make
sure that your links to the form match the title and purpose of the form.
Nothing is more guaranteed to confuse a visitor than clicking on a link for a
specific purpose only to arrive at a page that indicates it’s for a different
purpose. If you need to use a single form page for two different processes
(e.g. a form to enter name and address information), make sure that you make
the title and other information on the form equally applicable to both
processes – otherwise you should really separate them into two separate form
pages, even if they are otherwise identical.
Finally,
while it’s sometimes necessary to have a “Back” button to take the visitor one
stage back in the process, or a “Cancel” button to cancel the process, those
buttons should be relatively small and less obvious compared to the “Go” button
– you don’t want to give your visitors any more reason to abandon the form than
absolutely necessary, so remove all unnecessary clutter and distractions that
aren’t directly guiding them to complete the process.
5.
Make
Your Forms Look Good
Many
companies lavish money on the design and usability of their sites, and yet
somehow all of that is forgotten when it comes to their forms. Yes, forms are
different from other pages (and in many cases are created by web developers, not
web designers or interaction designers), but you can still apply the elements
of style and layout to a form as well as the usability elements described
above.
Simple
things, such as creative use of colors and fonts, aligning fields, making the
fields big enough (but not excessively large), and plenty of white space around
the form elements are essential to a really good looking form. If your visitors
enjoy the experience of looking at the form, it’s more likely they’ll enjoy
completing it. So make sure you have your web designer modify the form layout once
you’ve selected the relevant fields to make sure it satisfies the same esthetic
requirements of any other page on your site, and you’ll increase the number of
form conversion.
6.
Test,
Test, Test
If
you do nothing else with your forms, at least do this. Make sure you test every
possible path through the form process from the perspective of the different categories
of typical visitor (try to put yourself in their shoes), including what happens
if they make a mistake of some kind. Also ask a few people (colleagues, friends
or relatives) who are typical of each of those visitor categories try out the
process to get their feedback – especially someone who is not familiar with
filling out web forms! Thorough testing is the single best way to ensure that
all your forms are as simple, friendly and effective as possible.
Finally,
make sure you review the published forms periodically using your web analytics
tool to ensure that you’re catching any other roadblocks or other problems that
might still be causing your visitors to abandon the process.
Execute
these steps regularly on your website, and you can be sure to minimize friction
on your form processes, and maximize your form conversions and your registrations
or revenue.