Best Practices for the Online Retail Shopping Experience – Part 1 of 3
Four Best Practices for Category Pages
This blog is the first in a 3-part series of posts we will be releasing over the course of this month. While some of these best practices may seem obvious, we still come across several retail websites who don’t implement these crucial features, which can diminish the chances for online customers to make a purchase. In this first entry, we’ll review 4 ways you can help your online retail customer make product selections from a category page. We hope you find these best practices helpful and look forward to your thoughts! So with no further ado, we present you with the following Category page Best Practices:
So with no further ado, we present you with the following Category page Best Practices:
1 Ensure selected filters are readily apparent to the shopper
Make it apparent to shoppers that their selected filters have been integrated into their product results while giving them the ability to remove individual filters, regardless of the order in which they were selected – the caveat being that the removal of that filter does not affect any subsequent filter selections. This eases the shopping process and reduces the hassle that customers experience when searching for specific products.
2 Provide a Quick View option to streamline searching and purchasing
Ensure a Quick View feature is provided within your category pages. Quick View buttons that appear upon mouseover are typically a best practice as they allow quick access to product details while alerting users to the presence of the feature. To ensure the buttons catch the eye of the user they should appear prominently in a contrasting color.
3 Make an interactive “mini-cart” pat of the online shopping experience
Once an item has been added to the cart, ensure a mini cart auto-expands to allow users to confirm that the item has been added. This also helps users maintain a running tab of their shopping experience.
Additionally, provide a clean, concise mini-cart view that appears upon cart mouse-over. This provides cleaner look while creating an easy and effortless interaction.
4 Provide interactive color swatches when appropriate
Interactive color swatches allow users to easily consider products in alternate colors without the need to navigate to a new page. Upon moving their mouse over each swatch, the product image should change to represent the select color scheme. A bad use case of this is adding each color variation as separate products which places a higher cognitive load on users. This, in turn, could complicate the purchasing process, which might result in lost sales.
Bonus Tip: When using Quick View, display the overlay in a shadow box
By muting the information outside of the Quick View overlay, users can more easily focus on the product information contained therein.
Of course, there are several other best practices that can be implemented at the Category page level that we did not provide here – however, these were some of the most common and crucial issues we came across in our research of retail websites. To find out how we can help your company provide a better customer experience, contact us today.
In the meantime, we hope this blog was helpful and actionable. Stay tuned for Parts 2 and 3 in this blog series: Best Practices for your Product Details page…
-Tony Moreno, Senior UX Specialist
-Jason Vasilas, Associate Director of UX