One of the things hardly ever optimized on most websites are forms. Forms are an integral part of just about every website. However, for some reason, people don’t want to spend much time thinking about them.
There’s a lot of different forms your website can have. However, I think most of them boil down to this: a contact form, a ‘request a quote’ form, and a checkout form. There are different method to optimize each, as the goal are different.
In this post, I’ll share my views on how you should optimize each variety and how to optimize forms in general.
You Need to Have a Form
This might sound silly, but the number of websites we encounter during our Website Reviews without a contact form or any other kind of form is worrisome. Some websites don’t even have a contact page.
Oh and just so we understand each other – a mailto link on a page is not the same as a contact form.
Focus Your Form
Just as with everything else on your website, you need to focus your forms. No matter what kind of form it is, make sure you break it down to the bare necessities. If you don’t need personal information, don’t ask for it. The fewer the fields, the shorter the form, and the higher the response rate.
These fields do need to be clearly visible. Don’t be tempted to use ‘slick’ form design that will basically make the fields transparent. It must be clear where people should enter the details.
And, of course, make sure your call-to-action (the send button, in this case) is visible and clear. I can’t stress this enough. If people can’t find that button, then all the form optimization in the world won’t help you.
Decent Erroring and Validation
One of the other things that can be implemented for any kind of form are inline erroring and validation. People don’t want to be told they’ve made a mistake filling out your form after they already hit the send button. Make sure these errors and validations appear right when the user is done filling out the field.
Not only can you be too late with your messages, you can also be too vague, or just completely wrong.
For instance: don’t just tell people a certain field is filled out incorrectly, but rather tell them what’s wrong with how they filled it out, so they don’t unwittingly repeat the mistake (multiple times in a row).
Or, another great one: do not tell people their password for a login is wrong, when in fact they’re entering the wrong email address. I can go all day with this; my annoyances are many.
It’s so simple: make sure people understand how to fill out your form and, in the rare event of a mistake, make the errors so ridiculously clear, they won’t reproduce the error.
Contact Forms
Contact forms are probably the most common kinds of forms you’ll find on the web. However, we see a lot of contact forms that look like no one ever thought about them.
Privacy
I always look at the contact form as the equivalent of someone coming up to a salesperson in a physical shop. In an actual store, you’d expect the salesperson to be open, friendly, and helpful. Now consider what you’d think about that salesperson if he/she was telling you “Tell me your name, date of birth, and occupation before you ask me any questions”.
That would probably result in you walking out the door, right? So why should your website be any different?
Of course, I’m exaggerating a bit (although I have seen contact forms asking this and more), but the point remains clear. When it’s possible to walk up to someone and ask a question right off the bat in a physical store, this should be possible on websites as well.
Tone of Voice
The tone of voice is very important for people to feel safe enough to ask a question. And tone of voice is just as much determined by what’s said as by what’s not said. So not having any text near your contact form will not absolve you from needing a decent tone of voice.
You need to invite visitors to ask you a question and explain the process of how you’ll handle their question. The last thing you want to do is confuse or piss off a customer right before they wanted to ask you a question. They’ll either leave your site or they’ll be angry while contacting you.
‘Request a Quote’ Form
I wanted to make a separate section of this kind of form, because it can definitely be helpful to ask for more information in a ‘request a quote’ form. It all depends on the setup of your business, your website, and your form. The same premise still holds though: if you don’t really need certain information, don’t ask for it.
Pricing Information
Half the time I see a ‘request a quote’ button or form, I feel kind of cheated. These kinds of forms really make me feel the website owner just doesn’t want to share their usual pricing, because they want to see if they can make more money off of you.
So you should be clear about the reason you’re not communicating your prices on your site. Preferably even show people a price range they can expect. This will not only filter out people who aren’t interested in that price range, but it’ll also give people like me a better idea of what they can expect.
And that alone can help increase your response rate and conversion rate.
Checkout Form
I’ve done a post on how we optimized our checkout page in November 2013, and most of that design still holds. There are some things you should definitely implement:
Progress Bar
This actually goes for every form you have on your website. You should implement a progress bar that shows people how far along in your form they are. This gives them a lot of insight into the process, and will most likely increase your form’s completion rate.
Clarity
Try to make it as clear as possible what all the options and details of the transaction are. What is the price, the product they’re buying, the payment options, etc. All of this should be very clear and quickly visible. The use of logos, product images, etc. can really help in this process.
Are your website’s forms up to par? Or do they need some more optimization?
This post originally appeared on Yoast, and is re-published with permission.
Featured Image: VIGE.CO via Shutterstock
In-post Photo: Rawpixel via Shutterstock
