EYE SEE | With online shopping booming, significant growth opportunities are opening up for retailers and brands. To take advantage of this potential, companies need to invest in a clean and streamlined user experience, but some webpage elements are more important than others. It was found that product pages are one of the key factors that can make or break your online sales.
To unveil the basic elements that drive conversion on these pages, our team conducted an eye tracking study analyzing the leading retailers’ product pages – Walmart, Amazon and Target. The research showed that shoppers are 14% more likely to buy the product from Walmart than from the other two retailers after browsing their product pages. Our goal was to discover the elements that correlate with purchase intent and offer recommendations for both retailers and their client companies.
We conducted our study in partnership with the panel company Lightspeed. The recruited 300 online shoppers were asked to browse two product pages of their preferred online grocery shop while the EyeSee team tracked their eye gaze. We chose popular brands within two large categories: Colgate (toothpaste) and Tide (laundry detergent). Afterwards, the online shoppers were asked to choose products they would prefer to buy.
Why is the product page so important?
You may think of a product page as an equivalent of picking up a product with one’s hands and mulling over the purchase. Many questions emerge in this thought process, but most of these activities take place in the subconscious part of the mind of which we are seldom aware. By changing features of the product page, we can influence both conscious and subconscious aspects of the decision-making process.
Walmart’s 14% sales conversion advantage
More than half of the shoppers (i.e. 53%) who land on the Walmart product page also end up purchasing the product, while only 47% of Amazon- and 46% of Target-based shoppers make the purchase after browsing the product page. What drives this 14% advantage?
Although all three pages have essential elements that help to drive successful online sales, Walmart’s product page has slight advantages.
- Larger product image;
• Visible and user-friendly “add to cart” section;
• Visible and user-friendly size and quantity options.
Walmart shoppers spent up to 70% more time browsing product images
Eye-tracking heatmaps: red signifies higher attention, green lower attention.
Eye tracking enabled us to measure the amount of time online shoppers spent gazing the different elements of the product pages. At Walmart, they paid much more attention to the product image: 23% out of total time spent per page, with much lower rates on Amazon and Target pages (i.e. 14% and 17% respectively).
Given its larger size, design and proximity to the product image, the “add to cart” section yielded a greater number of views as well. On top of that, Walmart’s “add to cart” is considered to be much more relevant and useful for purchase decision than the same section on other websites (30% better than Amazon and four times better than Target).
Key performance indicator: time spent looking at the image, not the page
While the time people spend looking at the product image is positively related to purchase intent, this is not the case with the time spent on the page as a whole. Amazon holds shoppers on the page 50% longer compared to Walmart and Target, but this alone does not translate into purchase intent.
Exploring the product image for a longer period of time shows positive emotional engagement – in this case, consumers presumably like what they see and are interested in learning more.
However, spending too much time on the product page might also indicate confusion. It is possible that the consumers could not find what they were looking for or that the page was not entirely user-friendly. Shoppers might find this frustrating and give up on further browsing of that particular site.
(Product) image is worth a thousand words
Product picture is the most attention-grabbing element of the product page. It is the first-to-be-seen and the-longest-looked-at element, taking in around 20% of the total time dedicated to the product page. This section is one of two areas considered the most useful and relevant for the purchase decision.
A shopper can obtain a lot of information about the product just by looking at the image; he/she does not need to read the description to make a purchase decision. Also, since people base their purchase decisions on the package design while shopping in the store, it makes sense that they’re influenced by the product image in an online environment. Plus, images attract more attention in general and communicate more efficiently than words.
Optimizing the product page
Optimization of the product page should be focused on the most important areas of the page. According to our data, these are (1) the product image and (2) “add to cart” section, followed by product name and suggested products. People devote most of their attention to these areas and consider them useful and relevant for their purchase decision.
Size matters. To make the most of the online “moment of truth,” product image should be optimally sized, at a high resolution and well positioned. Multiple-angle product images are an added bonus. On average, respondents spend more time looking at larger product images, as they attract more attention, which is positively correlated with the purchase intent. On the tested pages, the product image area with Walmart is twice as big as the same area with Amazon and 1.5 times bigger than with Target.
Another example of good practice demonstrated by Amazon is boosting the product image area with hero shots (visually presented product benefits). This “detail” has turned out to be very useful and relevant for the purchase decision.
Tweaking the “Add to cart” section. It’s vital for this section to be clear and user-friendly. Walmart’s design takes the prize, being large, with sizeable buttons and print, and positioned close to the product image. The information offered is clear, with important details highlighted (price, discount, shipping etc) and excessive ones omitted. This design attracted the most attention compared to other sites, as all these factors contribute to better visibility. On average, 92% of respondents noticed this section on the Walmart webpage, 86% on the Amazon page and 34% on the Target product page.
Amazon’s “add to cart” is overloaded with small-print and is potentially missing the most relevant information – therefore, visitors don’t consider this section useful and relevant for their purchase decision (on average 4 times less frequently than on other websites). Target, on the other hand, has too poor “add to cart” section, but consumers still evaluated it much better than Amazon’s crowded check-out area.
Complementary vs. alternative products. While Target and Walmart offer “alternative products” (i.e. variants of the SKUs within the category), Amazon uses the “complementary products” strategy that shows other categories of products that are frequently bought together. Both strategies are legitimate, but they support different goals: while the “alternative products” strategy helps shoppers decide on the exact product they want, with the aim of reducing drop-offs or selling more expensive product (upsell), the “complete-the-basket” strategy can drive direct sales (cross-sell).
When it comes to boosting e-commerce revenue, it is expected for complementary products (cross-sell) to be the most effective at the checkout page. Our study shows some advantages of the cross-sell strategy at the product page as well. The complementary products section holds 30% more attention than the alternative products section, which could also signify higher purchase consideration. As expected, visitors spend more time looking at new items rather than contemplating on, or second-guessing whether, their purchase was the right one.
When choosing between these two strategies, companies should primarily consider customer experience, that is, offer what is appropriate at each stage of the decision-making process. Dependent on the category, these strategies can be equally useful and relevant for the purchase decision. Alternative products are perceived as more useful once they provided an opportunity for price comparison between single and multi-packs (toothpaste) while in detergent category complementary products performed better.
This section should be positioned closely below the product image (above the fold) rather than below description and other information. This way it would have sufficient visibility to potentially affect purchase decisions.
In summary, when optimizing the design of product pages, retailers should focus on key elements (i.e. product image, the “add to cart” section, etc.), their size and positioning. These are directly correlated to consumers’ attention spans and the time they spend on the page, which can either positively or negatively impact the level of sales. Leading shoppers through the browsing and shopping processes and providing a seamless user experience is vital for achieving consumer satisfaction and, therefore, increasing conversion rates.
Mirna Djuric, Senior Research Manager, EyeSee Research
Olivier Tilleuil, Founder & CEO, EyeSee Research
Mina Miljkovic, former Marketing & Behavioral Science Projects Manager, EyeSee Research
