We’ve observed, through various rounds of retail website user testing, that visitors will use the shopping basket for more than its designed purpose: for product comparison. It is therefore important to support product comparison within the shopping basket with large images, table based structures, standard fonts and simple backgrounds.
As consumers we find it useful to view related, relevant items alongside our chosen product. We want to be inspired. In the absence of a friend or personal shopper it can be helpful to have product suggestions that are based on our viewing or purchase history all thanks to affinity analysis.
When user testing product search and purchase paths for high street retailers, we discovered that the shopping basket is often used as a comparison tool on sites where users tend to buy several items. Visitors will demonstrate similar behaviours whether compiling an outfit or using the basket to compare colours, style and price.
Jakob Nielsen and Kara Pernice, co-authors of ‘Eyetracking Web Usability’, used rigorous usability methodology and eye tracking technology to analyze 1.5 million instances where users look at Web sites to understand how the human eyes interact with design. When testing, they found that “while shopping for a gift for a fictional nephew, they [the user] often added a popular CD to the cart while they continued to shop for other options, comparing as they went along.”
Comparison tools, wish lists and outfit builders are specifically designed to improve user experience and aid user decision making. The shopping basket is unlikely to replace these useful tools. While product comparison is not the intended purpose of a shopping basket, we must support this behaviour to help customers make decisions.
- Feature relevant products/accessories within the shopping basket and or mini basket
- Ensure image thumbnails are large enough for confirmation or comparison
- Use a table based structure to efficiently display product information without interruption
- Use standard fonts and avoid using complex backgrounds
- Provide a ‘continue shopping’ link