This post is from guest author Giles Thomas, founder of AcquireConvert. Enjoy!
According to a MarketingSherpa study, the more often you conduct usability evaluations on your website, the faster your business will grow.
So in order to get the conversion rates you want (and your business needs), you must be constantly evaluating and improving on your e-commerce store’s usability and form usability.
In this article, you’ll learn best practices and conventions for form usability and how to employ them to make more money from your e-commerce store.
You’ll look at form usability guidelines you should be following and how usability fits into a complete conversion optimization process.
What you’ll learn:
Before you learn how to improve the usability of your forms, let’s first remember what usability is and why it is important to your business.
Usability is a quality attribute that assesses how easy an interface or site is to use. If your site is hard to use, your visitors will leave without making a purchase and your business could fail.
Let’s learn about some best practices you can test on your website forms to try to get more of your visitors to buy.
These are some lesser known form usability conventions.
It is helpful for visitors if your form fields have default values. This guides the user as to what their data could look like once complete and acts as an instructional aid alongside the form’s labels.
To technically achieve this you can use the placeholder tag (not to be confused with and used as a label itself!) or jquery input masks.
The default data should also show the format the data is expected in, for example with date picker fields or for telephone fields.
Ensure that when a task involves source documents (such as a paper form), the interface is compatible with the characteristics of the source document.
This means your form should reflect the source document’s data fields.
Nathan Barry took this idea one step further and even created a visual design that matched his source documents.
In this example, the visitor must supply their credit card (source document) details to complete the form conversion. Nathan matched the form fields to the source document data and even designed the experience so it’s very clear for the user what data goes where.
Make sure your users do not need to enter characters such as “£” or “%” and that the site automatically enters field formatting data.
An oversight I often see is form fields not being long enough for their requested data.
Make sure the input is long enough for the biggest possible data input you could expect. That way, users can view everything they have typed into the field without using the cursor to move left and right.
Make it clear for users which fields they have to fill out and which ones are optional.
This is often achieved with a red asterisk. You can also use a key to explain what the asterisk represents for explicit clarity.
If your form requires external information like a passport number, be sure to let users know at the beginning of the form—especially if your form has multiple steps that users could complete, only to learn at the last minute they are not in a position to complete the form at the moment.
Your forms should use ajax to validate the user’s data in real time so they know to update and correct erroneous fields before they click “submit.”
Forms should allow users to stay with a single interaction method for as long as possible. In other words, users should not need to make numerous shifts from keyboard to mouse to keyboard. This will make your forms easier and quicker to fill out.
When a form entry has an error, you should position the text cursor at the location where correction is required. This makes it easy for user to make the correction with as little input as possible.
Ensure your form field labels are explicit in their requirements and describe the desired data clearly.
And when field labels on forms take the form of questions, make sure the questions are stated in clear, simple language.
Your labels should be close to the fields so eye movement is reduced to a minimum. This will speed up the time taken to complete the form.
For longer forms, ensure the form questions are grouped logically and have section headers explaining the purpose of each section.
With screens that primarily focus on form completion, place the cursor where the input is first needed. This is known as autofocus in html5 form inputs.
You now have a number of ideas you can test to improve the usability of your site’s forms.
But what does this have to do with conversion optimization?
You all know that to increase the percentage of your visitors who checkout or buy, you need to use conversion optimization.
But the big mistake people make again and again is misunderstanding what conversion rate optimization really means.
Many people think it means A/B testing. But A/B testing is just a small step in a much bigger complete conversion optimization process.
Other people think it means looking at your analytics. Now when you think of digital analytics, such as Google Analytics, this is quantitative data. This tells us what happened, on which page, when and how much was spent.
But in conversion optimization, there is another type of data you can collect and analyze for customer insights and A/B test hypothesis ideas…
Qualitative data is collected through the exploration of user behavior.
Where quantitative data tells us what happened, qualitative data attempts to tell us why.
Just like for the big questions: “What is the meaning of life?”
Quantitative data can only take us so far; it can never explain the why.
And this is true for conversion optimization too: quantitative data can only take us so far.
Fortunately, unlike the meaning of life, in conversion optimization you can discover the why using qualitative data collection and analysis.
Some examples of qualitative data sources are live chat transcripts, customer development interviews, user testing videos and usability evaluations.
With this data, you can generate ideas for A/B test hypotheses. You then test new website changes based on the data you’ve analyzed, rather than coming up with random ideas or copying your competitors.
As we mentioned earlier, A/B testing is only one small part of a complete conversion rate optimization process.
In fact, conversion optimization is not really about increasing the percentage of people who complete your forms…
Conversion optimization is about increasing company profits through a better and deeper understanding of your customer.
Increasing your conversion rate is actually easy: simply reduce your price, and shazam! More conversions! (Okay, not what you had in mind?)
Increasing your conversion rate and profits is not so simple. But it is possible, if you follow a proven process.
So what does the complete process look like?
Let’s walk through an overview of the CRO process together.
You should be constantly setting, measuring and iterating on your:
A business objective for an e-commerce store that sells swimsuits might be:
“Increase our sales by receiving online orders for our bikinis”
Goals are taken from your business objectives.
A goal for our swimsuit business could be:
“Increase the number of swimsuits that are sold”
This directly correlates to the number of form submissions visitors complete, this illustrates the importance of your forms’ usability.
The difference between some random data or metric and a KPI is when is it measuring something connected to your business objectives.
For example, for the objective:
“Increase our sales by receiving online orders for our bikinis”
Our KPI would be the number of bikinis sold in a given time frame, like the number of bikinis sold per month. (Or, you could think of it as the number of bikini order forms submitted per month!)
For your KPIs to be actionable they need to have targets. Targets can be taken from your historic data and defined for each KPI.
If we sold 200 bikinis last month, a good target for the next month would be a 5% increase. Therefore, our target would be to sell 210 bikinis in the next month. (Or 210 form completions!)
The second step is data collection. The data you collect during the CRO process can be categorized into two types: quantitative and qualitative.
Usability evaluations and user testing are great examples of powerful qualitative data sources you can collect as part of your new CRO process.
The third step is collecting and analyzing all of the data from your various sources.
You do this using software for quantitative data and by aggregating qualitative data, which basically means looking for patterns to gain insight.
You can use the usability checklist in the bonus area at the end of this post to analyze your website.
The fourth step is creating your list of hypotheses. These are ideas you’ve generated about your customers after studying the data. They are ideas you would like to test as ways to improve your conversion rate and profits.
The process then starts all over again.
Remember: Conversion rate optimization is not “one and done.” It is an iterative process that should never end. Markets and customers are continuously evolving. So should you.
You all want more of your visitors to complete a purchase on your website.
Today you learned that simply coming up with random ideas and running A/B tests is not the most efficient approach to conversion optimization.
The key to explosive business growth, higher conversion rates, and more profits is following a proven process for conversion optimization.
And usability evaluations and user testing are some of the most important sources of qualitative data you can collect and analyze to inform your A/B test hypotheses.
You can improve your conversion rate too, but you need to take action on what you learned here today!
So for those of you who are super serious about getting super high conversion rates, I’ve put together a free bonus area download.
What you’ll get:
Get our best human insight resources delivered right to your inbox every month. As a bonus, we'll send you our latest industry report: When business is human, insights drive innovation.