insights | 28.10.2021

eCommerce Agency Guide to UX Best Practice

Article topics
  1. What is eCommerce User Experience?
  2. Increase Page Speed
  3. Intuitive Navigation
  4. Clear Signposting
  5. Focusing Engagement
  6. Product Search
  7. Reduce Checkout Form Friction
  8. Avoid Price Shock!
  9. Appropriate Payment Methods
  10. Offer Seamless UX
  11. Conduct UX Testing
  12. eCommerce UX Best Practice Checklist
  13. Final Thought

User experience (UX) is one of the most important things for every website to get right. Your eCommerce business depends on it to not only maximise conversions and sales, but to also help achieve and maintain higher customer satisfaction and retention rates.

Positive eCommerce UX encompasses a variety of practices that when working in harmony reduce friction in shopping journeys, intuitively leading consumers along the path to purchase.

In this article we will explore a range of UX optimisation practices that when tuned together offer consumers faster, more streamlined shopping experiences. But first, let’s take a moment to clarify what we mean when we talk about eCommerce UX.

What is eCommerce User Experience?

The concept of UX is not a new one. In the days before eCommerce, brick-and-mortar retailers would often try to enhance their customers’ shopping experiences by laying out their store in a logical way, placing related items close to each other, and promoting special offers. The goal was to reduce shopping friction and increase average cart values. It’s the same principle in eCommerce. The difference is that there are more ways of optimising UX, from fast page load speeds to intuitive page layouts, finding the right products, offering the right product information and streamlining checkout, all with the goal of maintaining consumer engagement from the moment of arrival in your eCommerce store to completing checkout.

Increase Page Speed

The most important UX best practice component for initial engagement is how long it takes for your homepage or a landing page to load. The slower a page loads, the more likely consumers will be to click away.

Page load speed is the length of time it takes for all the elements of any given page within your eCommerce store to fully load. A good page load speed is considered to be two seconds or quicker. Slower than that and consumer bounce and abandon rate will begin to increase significantly.

Slow page load speed can be caused by a number of factors, including reduced server response time, large uncompressed page files, script issues, poor caching, the list goes on. The way to establish how you can improve the speed of your eCommerce store is to have a specialist eCommerce UX agency run a free website audit.

Intuitive Navigation

From the moment consumers arrive in your eCommerce store their browsing and shopping experiences should be as low friction as possible. How to find the information or products that they want should be obvious and intuitive.

In other words, outstanding eCommerce UX enables consumers to easily find information, to find products, place items in their cart, continue browsing, understand delivery cost, and checkout easily, as though it’s second nature.

If eCommerce UX is designed and implemented well, with intuitive user interfaces (UI), consumers shouldn’t notice that they are ‘navigating’ your store at all.

Clear Signposting

We talk of eCommerce website navigation in terms of a journey: a journey to find information, a shopping journey and a journey towards conversion. The ‘website navigation as a journey’ metaphor is apt, and as with any journey it’s easier to make when you have a path to follow and signposts to guide you.

Signposts that will help consumers find their way in your eCommerce store are call-to-action buttons (CTA), such as add to basket, continue shopping, find out more, add to wishlist, buy now, the list goes on. These important UI elements give consumers easy options about what to do next.

CTA button design will affect its performance: shape, size, colour, font type etc. Where CTAs are positioned on a page also impacts how effective they are—if a CTA appears too early on a page, consumers might not be ready to act. If too low down the page, it might be missed (A/B testing will help establish what works best for you).

Product options should always be clear and adjacent to the appropriate product. For example, the iPhone product page example below gives consumers model options, colour options, going on to spec options in a clear pathway—notice that delivery and returns information is clearly stated with the product image.

Focusing Engagement

Pages cluttered with too much information increase cognitive load, making it more difficult for consumers to focus on the action that you want them to take. Each page element should be set out in its own space, with readable font styles and sizes, and appropriate colour design, to focus consumer attention.

The well-known Jam Experiment by Iyengar and Lepper found that offering 24 different jams for people to buy attracted more interest but resulted in far fewer purchases compared with having fewer jams on offer.

To be exact, 30% of people bought jam when there were only six to choose from, and only 3% of people made a purchase when there were 24 jams on display.

Don’t drive consumers away with a tyranny of choice.

Enabling consumers to perform product searches in your eCommerce store is an important component of positive UX. Searching on keywords to quickly find relevant results is what consumers expect. For more productive and valuable searches use semantic search.

Semantic search is where a search query aims to not only find keywords, but to also determine the intent and contextual meaning of search terms. Semantic site search will outperform plain text searches for more relevant search results.

Getting product site search wrong can be particularly damaging for UX, especially when returning no results at all—never present consumers with ‘No results found’.

Reduce Checkout Form Friction

The eCommerce checkout process is perhaps the most likely place in the shopping journey where consumers will experience friction. Ensuring that the checkout process is quick and streamlined will help to reduce cart abandonment, a major barrier to outstanding UX and conversion. One of the main stumbling blocks for consumers at checkout is long forms.

In order to complete checkout there is some information that must be collected. The obvious being customer name, address, phone number, email address and payment information. Any other information that will be useful to you for marketing and customer relationship building can be gathered after they have made their purchase.

Offering a guest checkout enables customers to checkout without having to create an account and fill in a longer form. With both a shorter form checkout and guest checkout you will have the customer’s email address and phone number, so you can contact them post purchase using targeted emails, SMS and push notifications.

Checkout isn’t the place to gather customer information. Doing so will diminish UX and reduce conversions.

Avoid Price Shock!

A sure way to ruin an otherwise good UX is by price shock. This is when a potential customer has spent time shopping in your eCommerce store and has items in their cart that they are ready to buy. They proceed to checkout only to be met with an order total higher than they were expecting.

More often than not, checkout price shock is caused by hidden or unclear delivery costs. The way to avoid delivery cost price shock is to simply ensure that the cost of delivery is made explicit on product pages—see the Apple Store page above.

Offering free delivery, or a free delivery threshold, which will help to raise the quality of UX and increase average order value.

Appropriate Payment Methods

Offering a range of payment methods that match your audience’s expectations will help improve checkout UX. You should offer the most appropriate payment options for the type of products that you sell and the type of consumer most likely to want to buy those products.

For example, every eCommerce store should offer credit and debit card payment options, but also consider e-wallets, such as Google Pay and Apple Pay, a deferred payment method such as Klarna ‘pay in 3’ or finance, direct money transfer and prepaid/gift cards.

Deferred payments are more appropriate for larger ticket items, whereas lower price items purchased more frequently are better suited to e-wallets, and debit cards for subscriptions.

Offer Seamless UX

Shopping journeys are becoming ever more complex, with consumers visiting multiple websites and social media to research products before they buy, looking for product demo information, videos and reviews, to help them make a more informed buying decision.

For outstanding UX it’s important to offer consumers the choice of how they interact with your eCommerce store. Whatever the touchpoint, be it mobile or desktop, or across channels, UX should be consistent.

In other words, UX should be uniform regardless of how consumers choose to interact with your eCommerce store and how your eCommerce store is deployed: responsive website, native app or PWA.

An omnichannel approach gives consumers consistent UX and greater overall positive customer experience (CX). For example, if a consumer has a query about a product and wishes to contact you, they are able to do so using any channel: email, contact form, social media etc., with the conversation about that query continuing to flow via a single source of truth rather than being confined to siloed channels and systems.

Conduct UX Testing

The way to ensure that your eCommerce store always offers consumers the best possible UX is by conducting regular testing using tools such as heatmaps (pictures), user session recording analysis and A/B testing, as well as metrics such as click rates, average time on page, and page bounce rates.

Testing methods such as these, when combined with an overall optimisation strategy, will help your eCommerce store to improve UX, which will in turn help to increase conversion rates.

To get the best out of UX testing it pays to partner with a specialist eCommerce UX agency. They will ensure that your store is optimised for better UX and consult with you on how to improve UX further at every stage of the shopping journey.

eCommerce UX Best Practice Checklist:

  • Ensure faster page load speed
  • Create intuitive page layouts
  • Offer fast, relevant product searches
  • Use clear signposting
  • UX optimise checkout
  • Take an omnichannel approach
  • Perform regular, ongoing UX testing

Final Thought

UX best practice encompasses a broad range of methods and approaches that when combined offer consumers faster, lower friction and more intuitive navigational experiences when shopping in your eCommerce store.

Consistently positive eCommerce UX not only helps to increase sales, but it will also, as part of your overall eCommerce strategy, help to inspire customer loyalty, improving customer retention and customer lifetime value.

To discover how well your store is performing and to find out how you can improve UX, get in touch with an experienced eCommerce consultancy today for a chat with a UX expert.

go back Back