The Oban Blog

11 rules for E-Commerce Checkout Design

Creating the perfect checkout design can be a very tricky job, because every sector has different types of customers and with different customers come different preferences and mental models. But there are some basic usability guidelines that a lot of companies don’t seem to know or care about in their checkout funnels.

Baymard Institute has conducted several researches for checkout usability in 2011. In their reports they include case studies, usability checklists and off course usability guidelines divided into several categories. One of their researchers, Christian Holst, shares 11 fundamental guidelines from that report in in his 2011 article: “Fundamental Guidelines Of E-Commerce Checkout Design”. In 2012 he recaps these findings and applies them to the checkout funnels used today in his article called “The State Of E-Commerce Checkout Design 2012”.

Christian Holst shows us, as he calls it, “The harsh reality of e-commerce websites”. “According to recent e-commerce studies, at least 59.8% of potential customers abandon their shopping cart“ says Holst as he tries to answer the main question: “Why do customers abandon their shopping cart so often?”. In this 2011 article he shows us the following principles:

1. Your checkout process should be completely linear
2. Add descriptions to form field labels
3. Avoid contextual words like “continue”
4. Visually reinforce all sensitive fields on the payment page
5. Don’t use an “Apply” button in your form
6. Format the field for expiration date exactly as it appears on credit card
7. Use only one column for forms fields
8. Use shipping address as billing address by default
9. Use clear error indications
10. Registration should be optional
11. Don’t require seemingly unnecessary information

Some of these guidelines seem to be obvious, but there are a lot of companies that do not seem to know them and therefore miss out on conversions.

The state of e-commerce checkout design

In the 2012 article “The state of e-commerce checkout design”, Holst benchmarks the top 100 grossing e-commerce websites based on the original research study from 2011. Through benchmarking these checkouts he comes up with some interesting stats:

1. The average checkout process consists of 5.08 steps
2. 24% require account registration
3. 81% think their newsletter is a must have (opt-out or worse)
4. 41% use address validators
5. 50% asks for the same information twice
6. The average top 100 checkouts violate 33% of the checkout usability guidelines.

In the article Holst explains what’s behind these numbers and showing some real do’s and don’ts when it comes to checkout processes.

These articles are highly recommendable for designers, programmers and testers. So make sure to take a look and be amazed by some guidelines you hadn’t thought about.

You can read his 2011 article on:
You can read the 2012 article on: