68% of shopping carts are abandoned, according to figures from Baynard, so how can retailers bring this number down?
Last week, we released our E-commerce Best Practice Compendium, which contains more than 170 tips on improving usability and conversions.
Here are ten ways to reduce checkout abandonment. There are many more, so please add your comments below...
Trust is all important. Before customers enter their payment details, they need to be sure they can trust the retailer.
There are a number of ways to engender this trust. Much will be down to the overall impression they gain from the site, and this can happen before customers reach the checkout process.
Still some customers may need reassurance, which is where trustmarks come in.
I would argue that factors such as the overall user experience, the reputation of the brand, recommendations from friends etc, have more power to engender trust than security logos, but they may be valuable to some shoppers, and perhaps for lesser-known brands.
There is also the question which trustmarks to use. People may have heard of Verisgin, McAfee etc, but will they recognise others?
Don't be tripped up by postcodes
There are a number of potential pitfalls here, and possibly the most stupid is shown in this example from Tesco Clothing:
Tesco insists on a space in the middle of the postcode, and that they are entered in capitals. This is unnecessarily strict, and it doesn't even advise customers of its 'rules' before they type in their postcode. I imagine this produces lots of error messages.
Another, more subtle error is that of customers entering zero instead of the letter 'O', or the number '1' instead of the letter 'i' and vice versa.
The bottom line is: the fewer error messages customers see, the more likely they are to complete the purchase.
Update: March 2013 - Venda and Tesco have improved the validation on the postcode field and this is no longer an issue.
Alternative payment methods
According to WorldPay stats, alternative payments account for 22% of global e-commerce transactions, worth a total of €165bn. Therefore, it makes sense to offer different payment methods and appeal to as many potential customers as possible.
Enclose the checkout
The idea behind enclosing the checkout is to remove features such as navigation bars and search boxes, which may distract customers from the task in hand: completing the purchase.
For example, Paperchase has left its navigation options active during checkout and this, along with a rather jivey background, could provide distractions for shoppers.
Make it easy for customers to make adjustments
Inline form validation
Web forms are a pain, and errors make it even worse. You may spend time filling in details and click to head for the next page, only to be held up by errors. Annoying.
A better solution is inline validation which, in the below example from Twitter (taken from the excellent Smashing Magazine) shows a green tick or a red cross as customers are entering details:
The checkout process can be a barrier to purchase for mobile customers. With the growth in mobile commerce, retailers like Cath Kidston which don't have optimised sites will lose potential sales.
An optimised mobile site is great, but particular attention should be paid to the checkout process to make it as easy as possible for smartphone users.
Not forcing customers to register, keeping form filling to a minimum, and providing shortcuts such as postcode lookup tools all help.
For example, Laura Ashley's new mobile site follows best practice by keeping form filling to a minimum. You only have to enter your name, address, phone number, email address and password before moving onto payment:
Laura Ashley further simplifies the process by using a postcode lookup tool and allowing customers to use the same address for billing and delivery.
Add reminders of price and delivery charges
This allows customers to quickly check on the contents of their shopping carts and the total charges before they complete the checkout, removing any concerns about costs.
Make it easy for customers to alter order details
A customer may be on the point of purchase before realising that they have make a mistake with their delivery address, or they would like to add something else to their basket.
In this example from House of Fraser, there are links to previous stages in the checkout, which allow customers to head back and make adjustments.
This works for address details, but if you decide to go back and add other items to your shopping basket, you're forced to enter your email and address details all over again, which is frustrating.
Show a progress indicator
At every stage during checkout, the customer should know where they are in the process and what else needs to be done to complete the purchase.
One way to achieve this is to have a progress bar across the top of each checkout page, which shows the stages within the checkout process and also highlights the customer's current location.
It can also double as a way to navigate back to previous stages and amend details, as in the last tip.
Flexible and clear delivery options
In this ASOS example from Paul Rouke's excellent guest post on persuasive checkout design, ASOS presents delivery options as radio buttons.
This makes it easier to view and choose than alternative display options such as drop-downs.
In addition, seeing the choices next to each other also makes it easy for compare the options and charges, while timescales are clearly communicated.