5 Methods to Improve Your Web Checkout Conversion Rate

Want to improve shopping cart abandonment rates in your online store? Not sure why your customers leave the site before the last step? A question we often hear: what are some web checkout page best practices? Are there some rules to follow? So many articles cover the rules. For us, Rule Number One is: Don’t just blindly follow these. Always study the audience and design your web checkout process specifically to their needs. Here's our detailed UX guide.

Maybe the future of e-commerce lies with no checkout at all. Uber replaced the painful web checkout process by automatically charging the credit card when the customer receives the service or product. Not every product has got there yet. We still fear the “shopping cart abandonment rate”, an acute problem in e-commerce.

5 research methods to improve web checkout conversion rates

Don’t fret a high abandonment rate — a large portion of this simply follows naturally from user behavior while shopping and browsing e-commerce sites.

Many users just go window shopping, comparing prices, saving items for later, exploring gift options, or just playing around while they check the latest fashion or gadget trends. We can’t avoid it. But you can do something to improve it.

These UX research methods can help you with this, and these tips can help you better react to user frustration during the whole process.

1. Quantitative metrics for identifying the problem

Here at our UX company, we hold sessions with our clients about metrics. We decide which data to gather to determine the direction and assess the value of what we create. Informed in part by metrics, we make critical decisions around content, design and product development.

But what do metrics tell us about the success or failure of checkout, the user experience, or design? Which metrics should we rely on?

Vanity metrics vs actionable metrics

Croll and Yoskovitz, the authors of Lean Analyics, tell us to definitely avoid vanity metrics. These numbers make you feel good but can also seriously mislead. Some examples:

• Total signups or total active users: That will automatically rise over time, almost entirely unrelated to what you do.
• Time spent on product site / number of pages and hits: If people spend time complaining on the support page or sorting through too many items on your page, those numbers say nothing about what to change.

Actionable metrics, on the other hand, help you react and take action. Check these out, although more come up in the book:

• Average shopping cart size: The amount of money spent on a purchase. If shopping cart size averages €15 on a food ordering site, adding an extra €5 as delivery cost during web checkout could logically make people change their mind and abandon the order.
• The effectiveness of recommendation engines: How likely will a visitor add a recommended product to the shopping cart during checkout?
• Mailing list effectiveness: Measures click-through rates and the ability to make buyers return and buy.
• More sophisticated retailers care about other metrics such as the number of reviews written after buying a product or of those who considered it helpful.
• Abandon rate during each phase of the web checkout funnel: Does it occur while reviewing the cart or entering billing details?

If you don’t have data yet because you have just started to design your website, then do benchmarking. Baymayrd’s site, for example, gathers cart abandonment rate statistics of 40 different online retailers. This can make for a good start, but cultural differences in user behavior in different markets can also occur.

Metrics paint only part of the picture: What type of problem might occur, what quantity does it reach, where does it occur, and how does it change with time.

For the "why" to happen, we need qualitative measures. Google Analytics does not tell you that.

2. Finding the why’s: User interviews and testing

We usually invite different types of users for discussions, new ones unfamiliar with the site and those who purchase regularly. We ask them about the context of their last shopping experience and the process of making decisions during each phase of shopping.

This can reveal surprises about what people think and the psycho-emotional triggers of buying your product. The "Jobs to be done" method provides a good approach to building your interview script.

We ask questions like:

• What made you start actively looking for the product?
• What did you do during the search phase?
• What made you decide to check the details of that product and to buy it?
• What were you thinking of when you paid? What happened after paying?

Usability testing

If you have ever heard the story of the 300-million-dollar button, you no doubt did so in the ROI of usability testing. They changed the “Registration” button to “Continue” with a simple message: “You do not need to create an account to make purchases on our site. Simply click ‘Continue’ to proceed to checkout.

To make your future purchases even faster, you can create an account during web checkout.” And the result? The number of customers purchasing went up by 45%.

During the usability test, we ask users to show us how they used the site previously, or we give them a test account and ask them to buy something.

Delivery options - An example

Talking to customers of an online bookstore, we learned for example that people get scared when we show them a long list of pick-up and delivery possibilities.

They actually consider three things when deciding about delivery:

1. Distance: How far should they go to pick it up (home delivery or from a pickup point somewhere in the city)?
2. Time: How long does it take to get the product?
3. Price: How much does it cost?

They make a priority order. If they need the book the next day as a present for a friend, they’ll agree to pay more for quick home delivery, otherwise, they are willing to walk to the shop and pick it up for free. So we added a filter by distance and time and a sort by price. In the end, they could choose from a shorter but more relevant list.

We also test competitors’ sites with users. It provides a great way to learn from others’ mistakes ;).

3. Gathering insights from customer support

Not a scientific research method, but one can simply gather, group, and measure the typical cases when people contact support. This can help in understanding problems and reveal what to change.

You can also ask your customer service employees to throw in a UX question while solving various customer service tickets. Ask about anything from the website or application ease-of-use, the product browsing process, or the usefulness of product descriptions in making a purchase.

Also, the very questions your customers ask should pin your attention to specific problems. Do they frequently ask about obscured layout preventing customers from making a purchase or script errors blocking certain features during cross-platform or cross-browser usage?

4. Create a customer journey to draw a line between the dots

A journey map can get to the heart of the user experience. Drawing data from analytics, interviews, tests and customer support together into a journey map can illustrate why an experience frustrates or delights people, and where opportunities to improve the product may lie.

You can analyze the different touch-points where people can get in contact during the phase of shopping and the alignment between user needs and the service you provide.

5. Test it on lots of users, and finalize it based on the results

Once you have a possible new solution for the defined problem, make an A/B or multivariate test, and compare the results. You can also combine it with previous methods, like usability testing both variations, and clean up the design and copy before publishing for the A/B test.

Tips for humanizing your e-commerce site

….as we said, don’t just follow them blindly. Carry out your research and apply only the possibly relevant ones.

Let’s say the customer journey consists of three main steps:

• Step 1: Finalizing cart content and deciding about purchase
• Step 2: Decision to pay
• Step 3: Actions after payment

Step 1. Finalizing cart content and deciding about purchase

An effective e-commerce web checkout experience starts with a well-designed cart.

So, what function or purpose does the cart serve? We can easily assume that by the time a customer is viewing their shopping cart, they’ll check out next.

In reality, when buying a number of items, customers (including me) often use the cart as a “holding area” from which they make a final decision about what to ultimately keep or discard. Here, they only pick from the selected items right before payment (or even after, when they receive the product and decide not to send it back).

At this phase, they might feel indecisive or unsure. They might discuss the situation with others to eliminate any doubts. They might want to put off the decision, expecting to get more information for the decision later on.

Suggestion 1: Make the cart always visible and modifiable

Unfortunately, many stores have still not adopted this feature. Imagine throwing products into a bottomless pit as you shop in a real store, trying to find the physical checkout without any signs, and then having to throw all the stuff (most of which you had already forgotten about) onto the counter only after you get there.

Suggestion 2: Keep item images visible

It can cause even more confusion when customers decide to enter the checkout funnel and all the fun suddenly disappears. No pictures, just boring lists and forms. Keep showing images of the product(s) they are buying throughout the entire web checkout process – it motivates them best to keep going through the boring stuff.

Suggestion 3: Release the pressure of decision and involve others in the process

Some users feel distressed by the idea of soon having to pay for the products they like. Maybe they have not mentally reached the stage of paying yet, or they aren’t even paying for it themselves. Some best practices to resolve this type of problem:

• Let them save items as favorites from the cart, or add the possibility to share their cart content or wish list with friends or send it by email.
• Keep the items in the basket a while and give them a discount.
• Let them split the payable amount with others. Read our case study about split expenses solutions.
• Make the return policy quickly reachable, and save them the pressure of fearing the consequences of their decision

Suggestion 4: Do the math for your customer and make costs transparent

Many users have a spending limit in mind. If they pick an item just within that line, and must later add shipping or VAT, they overstep their budget and abandon the process. What would resolve this?

• Show them the exact cost from the beginning, indicating shipping cost. Make it clear how much more they need to spend until they qualify for free shipping.
• Add the coupon savings input field close to the cost so they can easily check how much the end amount would come to with the discount. They might want to buy more if they can save on free shipping or get 25% off.

Step 2. Decision to pay

At this phase, keep people focused while they deal with data and money.

To do that, keep everything short and quick while sounding supportive and trustworthy. Andrew Coyle wrote an amazing article on how to avoid some of the common mistakes designers make when designing web forms.

Payment pages come in many types and forms. The most typical are the accordion, the one-page, and the multiple-page formats. Each has its pros and cons, but whichever you pick for your site, give the user an overview option and different payment options like credit card or cash on delivery.

They should be able to flick through it quickly looking at a summary of their input data and going back repeatedly to edit data without the fear of missing anything or putting the data in the wrong hands.

Step 3. Actions after payment

Your customers don’t want to buy items — they want to own them. So, keep up their enthusiasm even after payment with a thank you page and an introduction to the next steps. Some best practices:

• Show your gratitude. This means you appreciate their efforts.
• Make them feel good. On their thank you page, a Hungarian bookseller highlights that buying an ebook instead of a print version saves a tree. This cute emotional design trick helps the buyer feel good after a hard decision process.
• On the thank you page and even during delivery, explain what happens next before they get their product. Provide clear instructions. Remind them to check their email (spam/junk included) to access their goodies. Send emails about the delivery status or enable order tracking.

In conclusion

Context holds the key, so gather all the information and do your research. This clearly shows the influences on your users’ behavior and decision-making process, as well as the triggers and fears they face. Conclude everything in a journey and humanize the design with specialized supportive solutions that make them feel good.

Take the next step to improve your website’s UX

Planning a design or a research project soon? Get in touch with UX studio and find out how we can help you conduct usability research and create a powerful UI that will appeal to your target audience.

Users drop from your website and the conversion rate is low? UX audit might help pinpoint usability flows in your product and define key steps to improve its performance. Learn more about UX audit and how it can help you improve your product's usability.