Downloaded 165 times
Uploaded byBecome Customer-Centric
E commerce Best Practice Tips & Techniques from Worldwide Brands
The document outlines e-commerce best practices and techniques by Paul Rouke, focusing on enhancing usability and conversion rates for online retailers. Key strategies include providing transparency, building trust, and removing barriers to facilitate customer purchases. Effective design patterns and persuasive techniques are emphasized to improve user experience and increase conversion rates.
More Related Content
Similar to E commerce Best Practice Tips & Techniques from Worldwide Brands
E commerce Best Practice Tips & Techniques from Worldwide Brands
- 1.
- 2. E-commerce Best PracticeTips & Techniques by Paul Rouke Head of Usability at PRWD 30 th November 2011 @ Conversion Conference London
- 3. I run theUK ’ s Leading North West Based Usability & Conversion Optimisation Consultancy About Me I provide public and in-house training for Econsultancy’s global clients including Tesco, O2 and Santander I provide services to help retailers improve their website conversion rate Usability testing (moderated & remote) Expert evaluations Usability training In-house consultancy Conversion rate optimisation
- 4. PRWD Clients IncludeBrands I work with include...
- 5. Conversion principles fore-commerce Best practice tips & techniques Persuasive e-commerce design examples Summary Session agenda
- 6. What is Usabilityand User Experience? Key Conversion Principles
- 7.
- 8. Build trust &confidence
- 9. Remove barriers toentry
- 10. What is Usabilityand User Experience? Key Conversion Themes >> Provide transparency >> Build trust and confidence >> Remove barriers to entry
- 11. What is Usabilityand User Experience? Your value proposition How can you ensure your visitors see your key value proposition & unique selling points?
- 12. Introduce a site-widepromotional bar under your primary navigation – this is becoming a design pattern on major retail sites, and consumers will come to expect this
- 13. What is Usabilityand User Experience? Product page How can you encourage more visitors to add a product to their shopping basket?
- 14. Provide complete transparencyof your delivery and returns proposition – which means don’t hide them from consumers
- 15. Provide complete transparencyof your delivery and returns proposition – which means don’t hide them from consumers
- 16. Provide the rightlevel of product detail, both written and visual, to allow visitors to make informed purchase decisions
- 17. If you havecustomer ratings & reviews, promote these in close proximity to the product name & price – social proof is becoming more and more influential in improving conversion
- 18. If you havecustomer ratings & reviews, promote these in close proximity to the product name & price – social proof is becoming more and more influential in improving conversion
- 19. If you havecustomer ratings & reviews, promote these in close proximity to the product name & price – social proof is becoming more and more influential in improving conversion
- 20. If you havecustomer ratings & reviews, promote these in close proximity to the product name & price – social proof is becoming more and more influential in improving conversion
- 21. Utilise tabs toprovide intuitive access to important selling information without the user having to scroll – this approach is fast becoming another design pattern on e-commerce product pages
- 22. Utilise tabs toprovide intuitive access to important selling information without the user having to scroll – this approach is fast becoming another design pattern on e-commerce product pages
- 23. Utilise tabs toprovide intuitive access to important selling information without the user having to scroll – this approach is fast becoming another design pattern on e-commerce product pages
- 24. What is Usabilityand User Experience? Shopping bag/basket/cart How can you encourage more visitors to checkout (who are then more likely to convert)?
- 25. Provide transparency aroundyour delivery proposition, options and costs – don’t force visitors to take a leap of faith into your checkout
- 26. Provide transparency aroundyour delivery proposition, options and costs – don’t force visitors to take a leap of faith into your checkout
- 27. Provide transparency aroundyour delivery proposition, options and costs – don’t force visitors to take a leap of faith into your checkout
- 28. Focus the visitorsmind on proceeding to checkout through a clear call to action, even though there could be quite a lot of information being presented to them
- 29. Focus the visitorsmind on proceeding to checkout through a clear call to action, even though there could be quite a lot of information being presented to them
- 30. Focus the visitorsmind on proceeding to checkout through a clear call to action, even though there could be quite a lot of information being presented to them
- 31. Allow visitors toedit their shopping contents within the shopping bag rather than having to go back to the product page
- 32. Provide visibility andclarity of both your security measures and your accepted payment methods View a detailed analysis of the ASOS shopping here - http://bit.ly/ASOSbbp
- 33. Provide visibility andclarity of both your security measures and your accepted payment methods
- 34. Introduce the word‘secure’ or ‘securely’ on your call to action button – this is a simple but potentially highly effective test you can do to optimise your conversion rate
- 35. Introduce the word‘secure’ or ‘securely’ on your call to action button – this is a simple but potentially highly effective test you can do to optimise your basket conversion rate
- 36. What is Usabilityand User Experience? New customer checkout How can you remove barriers for new customers (whilst encouraging them to create an account*)? *Why? Well its damn important if you want to build long term meaningful relationships with your customers!
- 37. Speedo mention nothingabout creating an account at the start of checkout – leaving new customers to simply get on with entering their details to place their order
- 38. It is onlyat the end of checkout that Speedo encourage new customers to create an account – almost making it a ‘no-brainer’ – and they get over 75% of new customers choosing to create an account
- 39. ASOS provide onethe most simple, barrier free checkout pages for new customers – simply asking them to continue
- 40. Compare this totheir previous design which forced new customers to create an account in order to checkout
- 41. What is Usabilityand User Experience? How did this change in message and call to action impact the performance of this page Abandonment Rate Was Reduced by 50%
- 42. ASOS then simplyask new customers to choose a password as part of their checkout process – turning what is a huge ‘perceived’ usability barrier in to simply entering a few characters in to 1 text field
- 43. Lakeland also providenew customers with 1 option – continue – whilst at the same time providing confirmation to new customers that they can create an account at the end
- 44. Lakeland then provideclear customer focussed reasons as to why the new customer will want to create an account – once again making it almost a no-brainer
- 45. Argos also recognisethe important of not forcing registration yet at the same time making it clear you will have the option to register later
- 46. What is Usabilityand User Experience? Persuading users to buy What are proven persuasive design techniques that increase e-commerce conversion?
- 47. Naked Wines delivera unique and highly persuasive e-commerce experience for new and returning visitors – they are delivering a truly user-centric online experience & business strategy
- 48. View a detailedanalysis here - http://bit.ly/bookingBP Booking.com feature a wide variety of persuasion techniques, particularly on their search results pages
- 49. Summary As thesetechniques are so important to the worlds biggest retailers, they are even more important to everyone else... Transparency, trust and barrier removal Is your e-commerce site following these key conversion principles?
- 50. Connect with mehttp://uk.linkedin.com/in/paulrouke Office: +44 (0)161 228 0585 Mobile: +44 (0)7739 745 126 Email: paulrouke @ prwd.co.uk Web: http://www.prwd.co.uk PRWD 22 Lever Street Manchester M1 1EA United Kingdom http://twitter.com/paulrouke
- 51. Thankyou for listeningto “ E-commerce Best Practice Tips & Techniques ” by Paul Rouke Slides and usability & conversion best practice available here: http://bit.ly/CROresources
Editor's Notes
- #2 In this presentation I will be providing best practice tips on both usability and persuasive design with examples from some of the worlds biggest brands, including some of our clients including Speedo, Lakeland and Booking.com
- #3 In this short session I will be providing you with some key tips, techniques and case studies of how retailers can improve the usability, persuasion and conversion rate of their online experiences. I actually provide a full day training course to worldwide clients of Econsultancy on this very subject, so of course this session isn’t going to cover all the elements that you should be paying attention to, but there are some major recommendations which have the potential to significantly increase click-throughs and purchase conversions.
- #4 At PRWD we help our clients understand their customers and prospects wants, needs and desires, in order to design and refine their online experience to lead to increased conversion rate performance
- #5 As well as working directly with clients I am also one of the training team for Econsultancy, which involves delivering training to a wide range of their clients including some of the worlds biggest brands. I provide training on both usability & user experience, as well as e-commerce usability best practice & persuasive design techniques.
- #8 Transparency is such a fundamental ingredient to delivering an e-commerce user experience, and this principle can be applied throughout the browsing & buying user experience. Although as a persuasive technique sex and titillation can be extremely important, I just wasn’t able to find a photo that represented transparency only, hence the lady in the bikini!
- #9 I have very recently become a father for the first time, and this is me and our daughter when she was 12 hours old. I couldn’t think of a more powerful example of demonstrating the concept of building trust & confidence with your new born child, especially in those first few precious hours and days.
- #10 Of course the concept of removing barriers for users is one of the most fundamental principles of good usability, although there are still many retailers large and small that are putting big barriers up at key stages of the buying process. ASOS have recently removed what was a major barrier for 1 st time visitors and they have seen a huge decrease of abandonment. More on this on later in the presentation
- #12 As a growing % of visitors arrive on internal pages of e-commerce sites, whether that is category landing pages, lister pages, product pages or promotional pages, it is becoming even more important to consider the ways in which you ensure all visitors have visibility of your key value proposition and selling points. Its no longer sufficient to rely on a big homepage promotion to promote your fantastic free delivery promotion, as most visitors probably won’t even see this.
- #13 What many of the really big retailers are now doing, with ASOS being one of the first that I recall adopting, is a site-wide ‘USP promotional bar’ under the primary navigation bar. Not only does this mean that all visitors are very likely to at least pay some attention to it, irrespective of where on the website they land initially, but it also provides the retailer with a highly valuable area of real estate in which to promote both key USP’s but also seasonal promotions, strategic activities and other messages which will encourage visitors to shop with them. This approach is fast becoming a design pattern amongst many well recognised, high traffic retailers, which will soon mean that visitors will start expecting to see this type of promotional messaging area – which in turn means visibility of these messages will increase further. It is important to ensure that just a simple visual style is used to not compete with, or merge in to, the primary navigation bar. In these examples the simple use of an underline that ASOS use ensures that visitors know which messages are clickable. Compare this to the John Lewis example which appears more to just be informational messages, even though some visitors would certainly want to know more about some of these messages/USP’s.
- #14 What are some of the essential ingredients that your product pages should contain in order to provide visitors with all they need to know to have the confidence to add that product to their shopping basket?
- #15 Providing transparency of your delivery options and proposition, along with details of your returns policy, are essential to ensure visitors are quickly able to put their mind at rest without having to go looking for this information on other pages, or in links in the footer. ASOS provide a great example of providing quick and intuitive access to both delivery and returns information, whilst at the same time ensuring that the focus of the page is on the primary product information and the add to bag button. This won’t be the last time I use ASOS as an example of e-commerce best practice in this presentation!
- #16 As with ASOS, M&S also provide quick and intuitive access to their delivery and returns information, whilst at the same time keeping the focus of the product page on the primary product information. I would say that the add to basket button should be move further up the page. The initial product description could be reduced and more information put it to the product details tab to allow the button to be made more visible without scrolling.
- #17 In order to help visitors make an informed decision on whether or not this product is right for them, its vital that you understand the wants and needs of visitors when it comes to considering purchasing your products. In this example Arei performs much better than the LL Bean product page, as they recognise that an important part of hiking boots for potential customers is the quality of the tread. They have used customer purchase behaviour insights to identify this requirement and have provided visitors with more than just a standard photograph of the product. This approach doesn’t just apply to product photos – you need to ensure both written and visual product information allows visitors to make an informed purchase decision.
- #18 Social proof, particularly in the form of customer ratings and reviews, is continuing to play an increasingly important role in both increasing product page conversion but most importantly allowing other visitors to make more informed purchase decisions. Providing you have ratings and reviews for your products, don’t be shy about making these highly visible on your product pages – ideally as close to the product title as possible, as in this example on Walmart.
- #19 Although not as prominent as the Walmart example, Argos display the summary of the customer rating and the number of reviews above the majority of the product information.
- #20 Amazon have probably been featuring product reviews since their very early days, and the position of the rating summary and number of reviews has always been consistently placed right under the product title. With so much other content available on the product page, this crucial element of social proof is what many visitors will focus in on when they first visit product pages.
- #21 Booking.com, who I will be speaking about later in this session in more detail, also recognise the importance of both the hotel star rating and customer ratings and reviews in the decision making process of users. Immediately after each hotel name is the star rating of the hotel, and in a highly prominent position on the right hand side is a detailed summary of how the hotel has been rated by customers. Not only do they show the average rating out of 10, but they include a one or 2 word description such as Good, Great, Excellent, along with the number of reviews that have been made. The combination of a strong average rating and a large number of customer reviews is an extremely powerful cocktail which will influence visitors to make a booking decision for certain hotels. Booking.com also show a shapshot of one of the most useful reviews that have been made for that hotel, along with the date at which it has been made to demonstrate the recency of content and activity with this hotel.
- #22 Along with the promotional bar under the primary navigation, another emerging design pattern is the user of a tabbed area on the product page to provide quick and intuitive access to key information visitors need to make a purchase decision. This approach means that not only do you product pages remain shorter in length and potentially less overwhelming, the focus of the product page can remain on the top level product information and call to action.
- #23 M&S also utilise tabs on their product page to provide quick access to key product and proposition information for visitors
- #24 Currys also use this approach, and as can be seen there is flexibility about the tabs of information your can feature, although I would always recommend delivery & returns are featured in these tab names.
- #25 Most retailers now keep visitors on the product page when you add to basket. What this therefore means is that rather been sent to the shopping basket automatically when you click add to basket, which used to be the common approach, visitors now need to make a conscious decision to visit their shopping basket. Providing that you provide a useful mini-basket area that can expand to show both the products in your basket and the total cost, you can be pretty sure that when a visitor therefore does choose to go to their shopping basket they are more than likely considering to checkout as their next action. What this therefore means is that your efforts on your shopping basket should all be about providing complete transparency to allow the visitor to make a confident decision to move in to the checkout process.
- #26 Providing transparency and visibility of your available delivery options is a fundamental ingredient of the best shopping bag designs. ASOS do this exceptional well by providing visitors with the ability to select different delivery options that are available and see the impact this will have on the total price they will be paying. Not only does this answer the question “what are the delivery options & costs?” but it also sets expectations for the visitor, as well as potentially encouraging them to consider a slightly more expensive delivery option.
- #27 Boots approach this in a slightly different way in that they provide large promotional areas above and below the shopping basket contents. As can be seen the small but potentially pivotal word ‘Free’ is highlighted on all of the promotions, and free delivery is certainly one of the most persuasive propositions that retailers can provide online shoppers. These promotions are also aimed at encouraging visitors to increase their basket total in order to trigger one of the delivery promotions available.
- #28 Curry’s don’t provide as much visibility and prominence of delivery options, although they do pre-select the home delivery from free option. This approach isn’t as transparent as Boots and ASOS but it is at less letting visitors know they will have the option of free home delivery.
- #29 In order to answer visitor questions and provide transparency on shopping baskets, this usually results in quite a lot of information to take in for visitors. What this shouldn’t mean is the primary objective of the page, to checkout, is lost amongst the other elements. As you can see with our client Lakeland their checkout button is the most prominent action on the page. One additional refinement which we have recommended to them which they have yet to implement is also having a call to action button above the shopping basket contents, which again is becoming a design pattern on the major e-commerce sites.
- #30 On the John Lewis shopping basket there is absolutely no hesitation in determining the focus and object of the page, which is to encourage visitors to checkout. They have also adopted the call to action button above the shopping basket contents too. A quick and useful technique for determining which elements of any given page appear to the primary actions/goals is to move away from the screen slightly and squint your eyes. What should then end up standing out even more is the primary call to action on the page, in this case the continue securely button.
- #31 As with the John Lewis and Lakeland example, Curry’s also make it absolutely clear what is the action they are wanting/expecting visitors to do on the shopping basket page – continue to checkout
- #32 ASOS are one of the few retailers who allow visitors to modify the specification of products in their shopping bag, above the standard ability to change the quantity. If you compare this to the Topshop example for if a customer realised they had ordered the incorrect size jacket, ASOS customers don’t have to go back to the product page, add a new size to their bag, then go back to their bag to remove the incorrect size product. This enhanced flexibility that ASOS have implemented was the results of extensive customer insights and requests made on how they can improve their shopping bag design and functionality.
- #33 Further transparency of both payment options and the security measures in place is provided very clearly by ASOS. A key point to remember is that if such a trusted and well recognised brand like ASOS recognise the importance of these messages at this stage, especially security assurances, then it is even more important for lesser known brands, irrespective of sector/products being sold. I have provided a detailed breakdown of the ASOS shopping bag design in an Econsultancy article - http://bit.ly/ASOSbbp
- #34 As with ASOS, Currys also recognise the importance of providing cstrong visibility of both the security messages and payment options. These are 2 primary persuasive elements regarding ensuring visitors have confidence and trust to buy from the retailer,
- #35 Along with the theme of security, some retailers like John Lewis re-inforce the security message in the wording on their checkout button. This is an ideal quick test that retailers can try to determine whether for their audience the added reference to security has a positive impact on click-throughs in to checkout.
- #36 ASOS use the words ‘Pay Securely Now’ on their call to action button, and this resulted in a 3% uplift in conversion when tested against their previous checkout button ‘Proceed to checkout’.
- #37 Encouraging more prospects to checkout is a vital area for all retailers, and one which if done poorly can be potentially £millions of pounds in lost sales. Whilst removing barriers for new customers to checkout, how can retailers at the same time encourage as many as possible to create an account with them – and therefore making the first big step in allowing the retailer and consumer to develop and long term relationship?
- #38 Our client Speedo don’t mention anything about creating an account at the start of checkout. Returning customers have the option of signing in to their account, whereas for everyone else, you are simply asked to start providing the information you expect to provide when buying online. There is no reference at all to registration or creating an account, ensuring that what is a huge psychological barrier for people, doesn’t even enter their thought process. This approach ensures that at least for this first stage of checkout you have remove the major barrier that harms many retailers new customer conversion rate.
- #39 Once you have completed your order with Speedo, the order confirmation is focussed on simply encouraging visitors to enter a password and create their account. As you can see this is all benefit led, with the use of ticks to re-inforce positive messages that are important to new customers. You can also see how the words create account or registration aren’t used, instead all the copy is customer focussed.
- #40 In the middle of 2011 ASOS introduced a refreshed checkout experience, including this first, crucial stage of checkout. This is an example of probably the most barrier free first pages of checkout that I have seen, and for new customers there is absolutely no ambiguity about what to do next. What this means is that straight away new customers are able to gather momentum moving through their checkout experience, with no nagging issues or concerns about what they are committing to. Combined with their best practice driven shopping bag this delivers a superb experience for new customers.
- #42 Without the need for major layout changes or technical changes, this simple change, which went through a series of split tests, resulted in the abandonment rate for this page reducing by 50%. For any retailer this would be a major driver of increased sales and profit, but for a retailer the size of ASOS this type of improvement is staggering. This a very powerful example of the importance of removing what really is a huge barrier for online shoppers at the first stage of checkout.
- #43 Interestingly ASOS still actually force new customers to create an account, but this is simply delivered with the inclusion of a password field in the first form during checkout.
- #44 Our client Lakeland adopt a very similar approach to ASOS in keeping the decision making process for new customers to an absolute minimum. One additional piece of customer information that is featured on the Lakeland checkout is informing customers that they will have the option of creating an account at the end of the process, even though this is totally optional. This was added in based specifically on feedback from users during moderated test sessions, where some of them explained that as Lakeland is the type of retailer they would expect to shop from more than once, they would expect to have a facility to create an account and therefore speed up checkout on returning visits. The first version of the page didn’t make this option clear which is why the information has now been added in.
- #45 As I always recommend retailers do, when you are asking new customers to consider creating an account, making this very much benefit driven for them is crucial. If it isn’t then visitors are much more likely to ignore this option all together. As with the Speedo example the use of ticks provides a visual reference point indicating positive statements to the visitor too.
- #46 As with Lakeland, Argos recognise that many of their new customers would like the option to register as part of their checkout experience, but rather than forcing this on everyone they simply ask new customers to continue to checkout with the option of registering later.
- #47 In this final section of my presentation I wanted to quickly demonstrate 2 sites which adopt a truly persuasive approach with how they deliver both their business proposition and more importantly and the user interface that visitors see and interact with.
- #48 From the very start of their business Naked Wines have put their customers, who are both wine makers and wine drinkers, at the heart of their business strategy and online experience. As an example their homepage features many persuasive elements such as the countdown clock to get next day delivery, the prominent scrolling ‘what’s happening right now?’ area, and other elements such as the use of ticks to demonstrate positive messages about their proposition.
- #49 Booking.com place persuasive design at the heart of the browsing experience, and their search results page in particular provides a hige range of persuasive design techniques. Although from a pure usability and aethetics point of view you could argue that this page is quite cluttered, but Booking.com do continual testing and optimisation to determine the most effective page designs and use of content. This translates in this quite busy but highly optimal page which is all geared around persuading visitors to book with them and not other hotel search engines.
- #50 As I have demonstrated these tips and techniques are clearly extremely important to what are some of the worlds biggest brands in their sector. The concept of providing greater transparency, building trust and removing barrier are all key elements, so the message is if they are so important for brands with huge credibility and brand awareness, they are even more important for every other retailer.
- #51 Please feel free to connect with me on either Linkedin or Twitter. My Linkedin profile in particular provides a large number of client recommendations, and more about our work, services, clients, case studies and testimonials can be seen on our website.
- #52 I highly recommend you bookmark the resources page as this is continually updated with best practice articles, case studies and presentations on usability, persuasion and conversion optimisation. Thank you for taking the time to look through these slides, its much appreciated and I hope it has been of use