Editor’s note: This post was co-authored by Joost de Valk and his brother Thijs de Valk.
At Yoast, we’ve recently written about how we’ve drastically changed our checkout page. This process and our findings gave us the idea to do a best practice of sorts on checkout pages. As it is, a lot of checkout pages are far from optimal, and this short film from Google Analytics is rather harsh but lays it out quite well:
There are some elements to a checkout page that, in general, really help your conversion rate. Ignore these findings at your own peril. I’ll be looking at the following factors, all of which have a serious impact on your conversion rate: Focus, Assurance, Clarity, Time, and Social proof.
Focus
A page needs focus for people to understand what it is you want. On the checkout page this is doubly true; if your focus isn’t on the process of checking out, people will get confused. And confused people don’t convert.
An easy way to add focus to your checkout page is to implement calls to action. Calls to action are somewhat of a science, and people have performed a lot of tests to find the call to action that will work on any website. However, we believe it all depends on context.
Call to action
You should always use a color for your call to action (CTA) that stands out in your design. Usually we recommend people use a color they haven’t already used in their design (or at least that page). Next, bigger is better. The bigger you make your CTA, the more attention it will draw to itself, thus the more focus it will render.
Obviously the size of your button needs to stay workable. Also think about the shape of your CTA. We like to use calls to action that are shaped like an arrow, because they give people a sense of direction. The shape of your CTA alone will give people a sense of forward movement, which is associated with all things positive:
Lastly, the copy on your CTA is of importance as well. In general, be short and concise. People don’t like reading buttons, they just want to know where it leads.
Clutter
Especially on your checkout page, you need to remove as much clutter as possible. By clutter we mean “mess” on your website that distracts from the main goal. Any element on a page that’s not aimed toward that page’s main goal is clutter, and too much clutter makes your page lose focus altogether.
Clutter that is “outbound” (takes your visitor to another page) is especially bad. Make sure that the most important thing on the page is your checkout process. This can mean removing breadcrumbs, products you’re cross-selling and sometimes even a “continue shopping” button.
Assurance
Assurance is something people crave. People have to feel safe on your website and its pages, because if they don’t, they simply won’t spend their money there. So be sure to give them the safest feeling possible.
Safety signs
One of the most important things is to assure people your website is ok using safety signs—signs that mean the page/site you’re currently viewing is free from malware and is “hacker proof.” People want a visible affirmation that the page they’re viewing is safe, especially if that page is the checkout page. They want assurance that their money will be safe. So don’t just expect people to understand your website is safe; show it.
Payment methods
People want to know as soon as possible if you’re offering the payment method they want to use. So it’s best to show the credit card logos of the companies you support. If you support PayPal, include that as well, obviously. To avoid clutter, we’ve done this on our checkout page:
This way, it actually adds clarity to the payment options, assures people we have their kind of payment method, and reduces clutter by not showing it somewhere else.
Unexpected costs
As in the video, people do not like to be surprised at the counter. That’s why unexpected costs are the #1 reason people abandon their shopping carts. To prevent this, you need to assure people that there won’t be any unexpected costs. This can be as simple as adding a line like “there will be no additional costs” next to the total of the visitor’s shopping cart.
Clarity
Clarity and conversion are often mentioned in the same sentence. If your copy and your pages aren’t clear, they just won’t convert as much as they could. So be sure to make your checkout page process as clear as possible.
Progress bar
A progress bar gives people insight in how far along the process of checking out they are, and also adds the positive effect of gamification. This gamification effect means people will want to get to the next step as fast as possible. On our own checkout page we’ve decided to have people always step in on the second step. The first step is choosing a product:
The reason we do this, is because the visitor has already taken the hardest and biggest step in your process: he chose a product he wants to buy! So validate that step and make them feel good about it. This way the visitor has already done part of the process without any effort.
Product images
It has to be very clear that the product people have added to their shopping cart is actually the product they want. Showing pictures of your product is by far the easiest way to do this. An added bonus is that (decent) pictures actually increase your conversion rate.
Inline validation
Another form of clarity is inline validation. This makes it very clear for users whether they’ve correctly filled in the field or not:
This kind of immediate feedback is very clear and actually makes people more likely to complete the entire form. And in fact, creating inline validation for your form fields isn’t hard at all, as we explained in a post on the technical aspects of implementing inline validation recently.
Time
Time plays an important role in your conversion rate. You literally just have seconds for your page to load and convince your visitor that they should stay on that page.
Site speed
In order to convince your visitors within that few-second window, your site needs to be fast enough. Having a website that’s too slow, can literally cost you money. This is especially important if you have a (large) user base on mobile devices.
Cookie expire time
You can actually have your website “remember” what people added to their shopping cart. This information is stored in cookies, and you can determine how long this information will be stored. Only 50% of your shopping cart visitors will buy within an hour. After that, it takes people a lot longer to make a decision.
If you want 80% of your shopping cart visitors to buy what they added to the cart, you’d have to save those items for 7 days. Doing this will make sure people can leave your website, come back later and simply pick up where they left off. This makes it a lot easier for people and removes the risk of having people go through the choice and thought process of picking one of your products twice.
Social proof
Social proof is a powerful way to persuade people. There’s nothing more useful for influencing people than other people telling them your product is awesome. Social proof works because people will get more confidence in a product if they, for instance, read good reviews from other people. The manufacturer of a product is always going to say their product is fantastic. Having other people talk about it, simply makes it more objective, and thus more trustworthy.
However, you have to take care, because social proof can also seriously backfire. You have to make sure you’re using positive social proof. Positive social proof means providing people with things they can gain from using your product, instead of what they’re risking not to gain (negative social proof). Telling people what they’re risking, or worse, how many other people are risking it, can have the exact opposite effect of what you’re trying to achieve. People will only find more reason not to use your product.
Testimonials
Testimonials are stories or pieces of text from actual users about your product. If positive, these can have great impact on people. Always be sure to use as much information of the person giving the testimonial as possible. Adding pictures has been found to increase trust, even if the picture didn’t make any sense at all. However, a picture of a face always draws more attention:
This actually has a drawback, because people looking right at you will keep your attention. If at all possible, it’s best to have the eyes of the person in the picture pointed to an important element on your page, such as your call-to-action.
Lately we’ve been reading a lot about ‘mini stories’. These are basically testimonials, but written like short stories. When written right, mini stories are supposed to have a kind of seductive effect on people.
Numbers
Telling people how many went before them in buying your products persuades people to also buy your products, especially if it’s a high number. This is due to multiple things, among which peer pressure is probably the most important. It’s basically trust based on numbers. Peer pressure means people are afraid to “stay behind” if a lot of other people have already done something. When using this tactic, be sure to use the exact number of people who’ve bought something or signed up, and to not round anything up. It turns out that for your visitors exact numbers are more believable.
Authority
Telling people what other important people or businesses have used your product or service is a great way of persuading people. Especially if you use the kind of people and businesses you know your visitors will like. This is all because of the Halo Effect, which means people’s impression of you can be influenced by their overall impression of you. So if you make that overall impression more positive by naming those great names working with you, they’ll think more highly of you.
Up to you
Your checkout page needs every much bit of thought as the rest of your website. In fact, if you manage to convert more people here, this will be the closest thing to direct money you’ll ever find in Conversion Rate Optimization. So what do you think? Let us know!
