When extolling the virtues of ecommerce good practice from large, successful organisations, a common throwback comment is “we can’t afford to do what they do, we just don’t have the resources”.
At face value this is true; smaller businesses typically have fewer employees, smaller budgets and a lack of sophisticated tooling to mirror the site capability of behemoths like AO.com, Amazon, ASOS and John Lewis. However, you don’t need to replicate to be able to benefit from the trailblazing of the bigger brands. You can learn the lessons of good practice through what they do, and how they keep changing their websites, and then apply the principles to your own site on a much smaller scale.
Keeping an eye on the most successful ecommerce sites is really useful, as it helps you understand where the market is going and how customer expectations are being shaped. This is important because failure to understand these expectations and the latest customer browsing trends can result in a compromised online user experience, which could hamper your growth.
For this blog I’ve been looking at the Internet Retailing ‘Elite’ and ‘Leading’ websites from the IRUK Top500 to see what we can learn. I’ve looked at Amazon, Asda, Boots, M&S, John Lewis, Tesco, Ao.com, Argos, House of Fraser and Screwfix. Here are my top 5 take aways.
1. Make it mobile
In October 2016, Statcounter (a research company that tracks internet usage on 2.5m websites) reported that 51.3% of pages were loaded on mobile devices. Some retailers are seeing 60%+ traffic coming from mobiles vs. desktop and tablet. Mobile conversion rates are also increasing, as enhanced device capability and connectivity is improving how people shop on their phones. Therefore, it’s critical for ecommerce teams to deliver a seamless UX across devices.
The top sites unsurprisingly do mobile UX well. They provide streamlined navigation, easy access search and content that’s optimised to display within the mobile viewport e.g. CTA buttons are responsive and use appropriate target areas, not shrunk down to fit the smaller screen.
Screwfix is a good example of successful ecommerce site that understands its mobile audience. It has a large number of trade customers, many of whom work remotely on jobs and access the site on their phones. They need super fast page load, so that the site performs even on patchy connections, and they want to find products quickly and get accurate pricing. The mobile site navigation is structured to enable this:
- Clear iconography and labels
- Store Finder in the site header
- Pinned navigation so key features are always accessible
- Customer support click to call number sitewide
- Toggle to switch between pricing Inc and Exc VAT
Argos recognises that some of its customers will have the app installed, and displays an app banner at the top of the screen if you access the site via a mobile web browser. If it detects the app isn’t installed on your device, it prompts you to download it from the app store. The banner can be closed and then the site remembers your preference and doesn’t show the banner again.
Some of these techniques are easy to replicate on your own site – running a test on a pinned header requires some coding but isn’t overly complex (there are even open source options on GitHub).
2. Make it fast
There are two elements to speed that I’ve been looking at:
- Page speed
Furthermore, since Google announced page speed as one of the factors it assesses in its ranking algorithm, the risk of poor page performance has increased.
The sites in the top 10 typically load quickly on mobile devices i.e. server connections are established quickly and content is returned to the browser so that the page starts to render for the customer.
- Tasks completion speed
This relates to the UI design and on-site features that enable users to complete common ecommerce tasks quickly and easily. For example, how easy is to navigate a product list page and pinpoint the product(s) you’re most interested in?
Infinite scroll has become the default way to load products into list pages, with X loaded initially then more as the user scrolls. When a product category has a large number of items, this can result in significant page depth and lots of scrolling. If the faceted navigation filters and page sort options are fixed to the top of the page (which is default implementation on most sites), then as the users scrolls deeper they lose the ability to refine the selection.
I’ve seen session replay analysis and user testing data indicate this reduces product views and increases site exit. It’s logical to want to keep appropriate navigation tools on-hand at all times.
M&S achieves this with a pinned ‘Refine selection’ toolbar that expands to reveal all the attribute filters. There’s also a pinned footer with quick links to My M&S, Recently viewed, Saved items and the shopping bag, and a ‘Back to top’ icon to return you directly to the top of the page.
3. Make it easy
One of the common themes in research around ecommerce abandonment is user journey friction, where websites forces the customer to take more actions than are strictly necessary to complete a task. Form complexity is the most commonly cited issue, where websites don’t minimise data entry, which has a pronounced impact on form abandonment on mobile.
A good example is remembering customer data to speed up form completion, such as soft log-in where you automatically remember the user’s email address in the log-in screen to avoid them having to re-type every time they visit.
House of Fraser does this well. I’ve shopped many times before, so when I return via the same browser, my log-in credentials are remembered and all I need to do is click ‘Sign in securely’.
Furthermore, the site remembers my basket contents, even if it has been weeks since I last visited. This is helpful because I often create baskets, get distracted, then forget what I had been looking at. The stored basket reminds me and increases the likelihood I’ll complete the purchase. As the basket is associated with my account, if I log-in via a different device, the basket is persistent.
Another great way in which they speed up form completion is by using address validation. This reduces the number of keystrokes a customer needs to enter, making the checkout process quicker and easier, and also makes sure that retailers are capturing accurate data.
However, where it falls down is on basket synchronisation. If I have an active basket in my account but then sign-out, the basket isn’t remembered on the browser (even though the website knows it’s the same browser/device combination). Compare this to AO.com, where the basket is persistent whether or not you’re signed-in.
4. Test every possible way to promote product
Amazon is a clear leader in the use of product recommendations, both generic for anonymous users and personalised based on returning customers’ browsing and transactional history. It has invested heavily in its data infrastructure and uses an algorithm to control product placement across the site.
A good example of applying the mantra ‘all user journeys are an opportunity for product promotion’ is the empty basket page. When there are no items in your basket, there are multiple product carousels including your saved items, recently viewed and cross/up-sell based on your previous browsing/purchasing (personalised).
You don’t need a complex algorithm to test this yourself; add simple logic to the basket page so that if it’s empty:
- Returning customers are shown items in their saved items and/or Wishlist + recently viewed items
- Anonymous users are shown recently viewed (if you have browsing data), trending items/bestsellers + ‘new in’
You can then test different combinations of recommendation type and use the click and purchase data to determine what drives the best results. The goal should be to establish the business case for investment in a specialist merchandising and personalisation tool that will give you greater control over placement rules.
5. Shipping & returns are part of your value proposition, not policy
Long gone are the days when shipping & returns were treated purely as legal requirements and policies to be communicated in sterile content pages.
Companies like Amazon realised that providing the best possible delivery proposition would give them a major competitive advantage. Amazon Prime is a great example, effectively a subscription based loyalty scheme centred upon unlimited free next day delivery on Prime products. More than 90% of Prime customers renew for the second year.
The IRUK elites and leaders all have mature logistics, with a wide range of customer choice. For example, John Lewis provides:
- Free click and collect in local stores (John Lewis and Waitrose) for order £30 and over
- Free standard home delivery for orders £50 and over
- Next and named day delivery from £6.95
- Local collection via Collect+
- International deliver to more than 30 countries
- Online returns process with pre-paid labels for free returns
It’s important that these service messages are effectively communicated throughout the user journey, in site wide navigation, product pages, basket and checkout. The user journey flow below illustrates how John Lewis achieves this via clear signposting and consistent iconography.
- Prominent value messaging on the homepage
- Clear delivery & returns content panel on product pages
- Delivery and returns information repeated in the basket
It may not be commercially feasible to offer all these options and support free returns but you need to think about the expectations that big brands set and how failure to align can drive customers away. As a minimum, the site should clearly display messaging throughout the user journey and there should be an option for free shipping, whether that’s threshold dependent or not.
Comments and questions
I appreciate that there are many other facets of the leading websites that smaller businesses can apply to their own websites.
What features and capabilities of leading ecommerce websites have you successfully applied to other websites? What do you think we can learn from brands like John Lewis, Amazon and Ao.com?
Please drop by and share your comments, questions and experience.