The COVID pandemic has rapidly accelerated online usage and eCommerce growth. We spend more time online, shop more frequently and shop for more types of products. Here are a few of the key behaviors impacting checkout demands. We’re:
- More dependent on mobile devices, specifically smartphones
- Shopping more frequently and across more product categories
- More enthusiastic about omnichannel ordering, specifically curbside pickup
Retailers with well-designed, intuitive checkout processes are likely to perform better than lesser prepared competitors. In this article, we explore what good looks like for key eCommerce checkout features.
Getting the Fundamentals Right
Let’s start with some context. Loqate’s recent report - The future of the digital checkout - found the following reasons for abandoning an online checkout (people who enter the checkout but don’t complete the purchase).
With this in mind, let’s define some key capabilities and look at retailer examples of good implementation.
1. Mobile optimized
It’s safe to say we’re in the mobile-first era, which is why Google has switched to a mobile-first index. For some retailers, mobile is more than 70% of all sessions.
During last year's busy holiday shopping season, a third of all online purchases came from mobile phones. On Black Friday, nearly 40% of sales came from a mobile device. Of course, these numbers were boosted due to the global pandemic but the trend towards mobile has been evident for several years.
With more shopping taking place on smaller screens, your checkout has to be mobile optimized, and for many eCommerce teams, this means designing the flow mobile-first. For example, checkout pages need to:
- Make use of common gestures like swiping
- Ensure form fields/labels are large enough and have adequate spacing
- Ensure CTAs are easily clickable with adequate hit areas
- Use buttons/tiles for input selection
- Persistent order summary
- Display the correct keypad based on the input field
- Load fast and work quickly by leveraging modern technology
- Use geolocation for location-specific elements (e.g. BOPIS store selection)
Screenshot: Recess mobile checkout with large, clear CTA buttons at the bottom of the screen where they can be easily pressed and a simple "Show/Hide order summary" section to avoid pushing form fields down the page unnecessarily.
Do full end-to-end checkout tests on the most popular mobile devices to access your eCommerce store (based on the percentage of visits). Test core use cases and note down any bugs, errors and UX issues.
2. Streamlined checkout
The principle is to minimize the cognitive effort to complete your checkout. This means simplifying the steps, minimizing data entry and only capturing the data you need to legally and effectively process your customer’s order. Some brands use a 1-page checkout; others use multi-step but with a clear progress bar and enclosed navigation (removing all unnecessary page elements to focus people on the checkout tasks).
Amazon is the gold standard here; they were the first large retailer to crack one-click checkout (they even had the patent for the "1-Click" technique until it expired in 2017). By remembering stored account and payment details, Amazon enables account holders to skip straight to the payment confirmation page or quick buy from the product page.
Screenshot: Amazon providing the "Buy now" fast checkout from the PDP (Product Details Page), letting registered customers purchase without having to go through the standard checkout flow.
Ensure your checkout is flexible and customers can edit pre-selected options, such as delivery address and payment method. You don’t want to create unnecessary friction by making people update their information or change default settings.
3. Guest checkout
Creating an account is the second most common reason for checkout abandonment, and Forrester found that more than 48% of online retailers said a guest checkout was the most important factor in increasing shopping cart conversion rates on their websites.
Registration is unnecessary for most eCommerce sites (there are exceptions, e.g. membership organizations like The Wine Society). You don’t need someone to create an account to process their order; secure the payment, then worry about increasing your registration rate.
The ultimate checkout goal is to be friction-free. Registration is time-consuming and demands a commitment that some shoppers aren’t willing to make. By offering guest checkout, you reduce friction and let shoppers check out as quickly as possible.
Screenshot: prominent guest checkout on Rimowa, clearly stating customers can create an account later in the process if they want to.
Convert guest users to registered customers on the order confirmation page with a clear explanation of the benefits of simply adding a password (e.g., online order tracking, member rewards).
4. Best in class form optimization
Forms can make or break checkouts. You should only include form fields that are essential for the processing of the order - if it’s optional, why show it? If someone in the business demands additional data capture, A/B test any new fields to check that it doesn’t slow down the user and negatively impact conversion.
Below are golden rules for form design:
- Minimize form fields and reduce the need for typing
- Enable autocomplete to speed up form filling
- Remember previously entered data to avoid double entry
- Spread long forms across separate pages
- Use buttons/tiles for input selections on mobile
- Clearly distinguish required from optional fields
- Provide inline validation and show when a field has been successfully completed
- Provide customer-friendly error messages
- Disable invalid inputs (e.g., letters can’t be added to phone numbers)
Screenshot: M&S provides visual validation of completed fields with a simple green tick and displays a user-friendly message inline next to fields with errors.
Ensure your customers can edit previously entered data at any stage before they confirm the order. For example, allow customers to edit the delivery address and method in the order summary (as Recess does in the example above).
5. Payment flexibility
A lack of suitable payment options is one of the reasons people abandon eCommerce checkouts. Customers typically use one or two preferred payment methods, and these vary from country to country (e.g., AliPay is popular in China and Ideal is popular in the Netherlands). The best checkout experience isn’t about offering as many payment methods as you can fit on the page; it’s about providing the most relevant payment types based on your customer group.
Customers expect choice and convenience; while credit and debit cards remain the number one payment method, the following payment options have increased in demand:
- BNPL (Buy Now Pay Later) (e.g., Klarna, Clearpay)
- BOPIS (Buy Online Pay In-Store)
- Pay by Invoice (for B2B)
- E-wallets (e.g., Apple Pay, Samsung Pay)
Screenshot: ASOS offering Klarna for BNPL and clearly showing the monthly installments on the PDP to set clear expectations before the checkout.
Evaluate your payment partners' full global payment capabilities to see which relevant payment options you can enable on your website. Ask your customers which alternative payment methods they regularly use on other websites.
6. Global data validation accuracy
Most eCommerce sites have international shoppers even if they don’t have local language site versions. International shipping opens up new markets and revenue streams, but it also presents challenges for your checkout.
Delivery and billing address entry is a good example. Address structures vary from country to country in terms of the data schema, the number of fields required and the label associated with each field. In the US, we use ZIP codes, whereas countries like the UK use postcodes. Your checkout needs to handle the data validation and localization of forms and language to align with how local markets expect to input data.
We can link this back to our discussion on payment flexibility. Depending on the payment method selected by your customer, you may have different validation rules, payment gateways or checkout flows. For example, some eCommerce sites enable payment by Direct Debit, which requires the input of bank details.
Without validation, error rates can be high, resulting in issues completing the direct debit mandate or ACH payments. A smoother solution is to set up e-mandates and use bank verification to ensure bank account details are correct to avoid payment errors and bank charges. Avoiding such errors is vital for B2B commerce when onboarding new customers.
- Do you tailor address forms based on the country selected?
- Do your validation rules align with local data structures (e.g., validating the phone number based on the country code)?
- Do you speed up address data entry by enabling real-time validation as the user types?
- Does your address validation tool work for all the countries you deliver to?
- Does your checkout support Unicode for international characters?
Screenshot: Oliver Bonas using real-time address lookup and verification, displaying relevant matches as the customer types.
Your key takeaways
Checkout design and UX are critical to your eCommerce success. We recommend that checkout optimization is a continuous process because customer behavior and technology change, so you must stay in tune with the latest best practice. Ensure you regularly audit your checkout process end-to-end and create a task list of improvements, then test changes and measure the impact. Good luck!