Search Engine Marketing Pros

If you do not know where to start improving the conversion rate of your website, here’s an idea: start by improving your checkout process. Very often, testing and improving this process is the fastest and cheapest approach to optimize your website.

There are various elements and methods to test the checkout process, but in this post we will focus on a single element: the progess bar.

This is what we mean by the checkout progress bar:

checkout progress bar sample

You can improve the conversion rate by doing just a simple A/B test (compare two variations of a same element/page) and measure the results by comparing how many people are reaching the common goal page (C).

Do not expect double-digit miracle growths just because you changed this design element. However, even a small percentage increase means more revenue at almost no cost for you.

You should test:
A) Your existing design
against
B) A new design based on our guidelines for creating a checkout progress bar (see below)
and set the goal page as
C) the “Receipt”, “Thank you” or whatever your goal page is.

Guidelines for designing a more persuasive progress bar

On a previous post we’ve analyzed how more than 100 e-tailers are guiding visitors through their checkout process. Based on the analysis regarding a better design for the checkout progress bar, we recommend:
1. Display the numbers of steps (only for 1-5). Do not count and display the numbers if your process has more than 5 steps. Numbering the steps will let the customers know how long the process will be, but if you display more than 5 steps it may scare them away

2. Provide a sense of action to visitors by including an arrow, pointing to the right. This will help them to know they are going in the right direction (forward). This may seem obvious to you, but it helps to reinforce it.

3. Highlight the current step of the checkout process the visitors are on. Make the icon and the text of the current page different than the other steps in the process

4. Include a page called “Review Order”, “Order Confirmation” or something similar. Many times users will go through the checkout process just to get additional information (like shipping cost). They will not proceed further if they don’t know at which step their credit cards will be charged.

5. Keep the checkout process short, under 4 steps if possible. Try to combine the shipping and billing page in a single page. Do path-splits tests (we’ll have a special post on the subject – stay tuned)

6. Design a horizontal progress bar! Do not try to be too smart, as very often visitors seem to be confused with website navigational elements.

7. Address anxiety issues with your bar. Display words like “SECURE” on the top or the side of the progress bar

8. Provide a small “confidence of mind” element right next to each completed step. This can be a small, green “check mark” and will let visitors know they have correctly completed the previous step.

Notice: below we have a sample checkout progress bar that we think addresses all the concerns above. Although we consider our proposal to be an improvement to most of the other progress images we analyzed, you should only use it as a guideline and adapt it to your website’s needs and rules.

Two Recommended Progress Bar Samples

Keep in mind that not all businesses are alike and you may want to rename the pages in your process. This is why we provide a PSD version (checkout progress bar sample), where you can play with the names and other design factors.

Pitstop Media is a Vancouver based search engine marketing company which offers results oriented PPC and SEO services. If you need help with your search engine optimization projects or with pay per click management and/or PPC optimization please contact us for a free, no obligation quote. We’ve helped companies rank on the first page of Google in a short period of time for highly competitive terms, and we’ve reduced paid advertising cost by as much as 148% while increased AdWords conversion rates by as much as 410% . Let us rank your website on the first page, too!

Related posts:

1. The Progress Bar – A Survey Of 100+ Online Retailers
2. Could This Be The Best Checkout Button?
3. Collection Of 100+ Checkout Buttons