Top 5 Principles for an Improved Checkout Design
We have all probably been victims of an impractical or just plain unusable checkout system while trying to perform a purchase online. Most websites are built with the intention to convert the visitors into customers but that won’t happen when a poor checkout design is being put to use. Potential customers are looking for a quick and satisfying online experience which means you need to make sure that happens.
To prevent a fleeing potential customer it is necessary to review not only your designs but also how usable those designs are. The main question is why do customers abandon their shopping cart so often and what are the mistakes committed by designers that make this happen. We will try to list out some sort of a general guideline that would improve the concept of checkout.
1. Make registration optional
Your customers are on your site to shop, not fill out miscellaneous forms. Make sure that the registration is done during the checkout process and not before (if that is strictly necessary) — and certainly not before a visitor places goods into their shopping basket as this creates a hassle for the user. Sign-up forms are barriers because they take effort and time to fill in and we are used to smooth experiences that do not require much hassle from our side, thus the abandonment on this step.
By getting rid of these barriers you increase the probability of your visitors becoming customers. The time already spent shopping will make them less likely to stop and waste that initial desire. If that barrier is placed right at the beginning however, they might just drop the idea of purchase.
2. Create a Linear Check-Out Experience
Having steps within steps creates confusion and intimidation amongst customers as it does not correspond with the idea that the checkout must be linear.
Non-linear, cluttered check-out processes is probably the main reason for check-out cart abandonment. This kind of check-out creates confusion and intimidation, breaches with the peace of mind which is a big no when it comes to the state of mind of a customer during or before a purchase.
The reasonable method to avoid such method is to provide a non-linear checkout process that doesn’t involve steps within steps. Various examples could be brought up when thinking of wrong check-outs, but the main one are those that require you to distract from the purchase in order to perform another lengthy action (such as signing up). Luckily, making the process completely linear is not hard because as little as a sub-step such as signing up should never redirect to one of the previous steps during the checkout process, but instead send the customer to the following step within the checkout process.
This is important because the mental model of the majority of customers state that a checkout process should be linear of some sort. After seeing the same page several times, most customers would presume that the website has an error, giving the interfering with their purchase.
If a multi-step process is required then you should use the progress indicator to inform the customer which step they are currently at and how many more steps are left until they have completed their task.
3. Provide customers with real-time-support
Since the checkout process has got to receive user’s input, it is reasonable to assume that many users might experience problems caused by misunderstandings in regard to the good or some particular needs or interests that couldn’t be easily defined using the provided interfaces. In these situations it may be crucial to provide users with professional, personal assistance instead of sending them to large help- or FAQ-pages that are usually not that helpful and especially not specific. We can’t talk numbers when saying how many users will use your live support but it is very likely that the acknowledgement of the fact that there’s always somebody to assist them in case of trouble adds up to the general impression and peace of mind which is something you can’t ignore.
Therefore it’s always a great idea to implement a web chat assistance for the checkout process. Not everyone can afford it, but given the large pool of available tools that allow live web-chat services at mere prices it has become a lot easier and hassle-free to implement this feature.
4. Make Forms Descriptive
Without a proper description, most form field labels could be considered ambiguous.
Forms are very important during the check-out, because that’s what the check-out process consists of (filling in forms and clicking buttons), thus any “technical” issue in regard with form might lead to abandonment which is why you always want to provide clear instructions for every field.
When you have form field labels with no comment, some customers will likely be confused about what information is being asked of them (unless you make the forms really intuitive by some creative way). Fix this by adding short descriptions and labels next, to or on your forms to eliminate any misinterpretation.
Even unambiguous fields, such as “Email address,” are great ways to explain what the data will be used for. “Email address” may be a sufficient description, but the majority of people would want to know what that is required for. Short reasonings somewhere below the forms or upon clicking on the forms will be enough.
It’s also necessary to understand the importance of graphics, illustrations and anything that can build up on the suggestivity during the checkout.
5. Use Shipping Address As Billing Address By Default
Almost every customer orders the product to their home, rarely requiring a billing address that would be different from the shipping one, thus requiring both does not always make sense. By default it is a good idea to use the same address for shipping and billing unless there’s need to record data or the customer explicitly expresses his needs of 2 different addresses (in this sense you should probably create a separate page for the customers that need it and not set it as default). By having the billing address as the shipping one, you would reduce the number of fields that would make it less intimidating for customers to fill in. Reducing the risk of any kind of misspelling is also a positive thing about defaulting the shipping and billing addresses.
Fields regarded to billing should probably be hidden allover. Don’t grey them out or display them in an “inactive mode” as it creates confusion, instead, show only the fields for the billing address, only if the customer doesn’t ask to use separate shipping and billing addresses.
Designing A Better Checkout Experience
There are many principles that stay at the foundation of a great checkout process, but after implementing the discussed ones, it is to be expected that your checkout will show an improved performance that could be considered well beyond average. Many e-commerce oriented websites ignore specific principles of UX or apply various techniques of improvement that are not specific for their type of website thus yielding to a misconception in regard with the appropriate and necessary usability guideline.
While a lot of the big websites provide impressive features like geo-targeting and validation of address, they don’t sort out the basic usability principles right, and they suffer greatly as a result.
Catalin Zorzini is a web design blogger and started project ecommerce platforms after spending a few weeks struggling to find out which is the best ecommerce platform for myself. Check out my current top 10 ecommerce site builders.