In our mission to create a kick-ass ecommerce product page, we’ve dug out the best practices for e-commerce product pages from various web sources.
Info has been curated from the best blogs in an effort to find the ideal product page layout. Here goes…
- Big image – The image on your product page is the hero of your movie. It’s the lead singer of your rock band. It should be enticing, zoom-able, definitely be placed above the fold and must be of jaw-dropping quality
- 360-Degree View – DueMaternity saw that conversions from products that featured 360 degree views increased by 27% when compared to the original, two dimensional product images
- Badge – Any small message or safety logo can boost customer’s confidence. Express Watches used the badge ‘Seiko Authorized Dealer Site‘. It registered a whopping 107% increase in sales!
- Scarcity – It has been scientifically proven that people pay more for stuff that is about to disappear. Don’t give your customers unnecessary time to mull over the purchase. Your scarcity weapon could be the last day of offer, last 2 hour of free shipping or last 3 items in stocks.
- Video – A nicely done video can have huge recall value and instructional videos assume even more importance when you are trying to sell something rather complicated. Stacks and Stacks found that those shoppers who saw videos on its product pages were 144% more likely to add to cart.
- Customer Reviews – If you have them, flaunt them. According to an iPerceptions study, 61% of shoppers go through reviews before deciding on a purchase. It also says that 63% of users prefer buying from a site that has customer reviews.
- Product Stories, not boring descriptions – Throw the manufacturer’s product copy in the bin and create a compelling story. A good product description is an art that needs practice.
“Throw the manufacturer’s product copy in the bin and create a compelling story. A good product description is an art that needs practice”
This visual post from Econsultancy is very comprehensive and a go-to place if you’re beginning to build your product page or need some inspiration to improve your sales.
Econsultancy have neatly divided their product page into 4 sections and here are tips from each section.
- Displaying products in ways to excite consumers and allow them to see themselves using and benefiting from the product will have an advantage over their competitors.
- The ‘Sharing’ section comprises both social icons and sharing functionality. Have this section close to the images and away from the buying area.
- Wishlist – Prompt the consumer to send the wishlist item(s) to a family member, spouse or friend to purchase for you. There could be triggers to send this message i.e. Birthday, Christmas, Valentine’s, Mother’s Day.
- Social Sharing – Use the affinity shift in the customer journey through the tactical placement of social sites post purchase (i.e. confirmation pages, and confirmation emails).
- List the RRP, the Sale price (if applicable) and the savings. Tip: Make the percentage saved obvious. Years of studies have proven the power of showing the percentage savings.
- Customer Reviews – This is in the form of a star rating and a link to read the customer comments (link takes consumers to the bottom of the page). 61% of people read reviews and 63% are more likely to purchase after reading a review.
- Product benefit copy – Common “what’s in it for me” questions relate to how the product will benefit a consumer (i.e. “how can this make my life better”), making this concise message important.
- SKU/product code – With the immense popularity of showrooming and general comparison-shopping with mobile devices, the presence of a product code near the top of the page assists this information/buying process.
- Add to cart button – Since this is the primary desired action for this page, it’s worth sharing a few key characteristics of a best practice add to cart button:
- It is a contrasting colour to your site. If your site is green, regardless of the “green means go” mantra, do not have a green button.
- It is large (size matters).
- It draws the eye of the consumers; making it obvious what action he/she is supposed to take.
- It looks “clickable” i.e. it’s not “flat”.
- Delivery detail – Same as returns information in the sense that it’s OK if it’s the same message throughout the site, it is keeping the consumer on the page. The entire delivery story must be told. All costs for all regions. Tip: Mention the track and trace service if it is available. It is another method to de-risk the purchase.
3. No time for reading? Here’s my top 2 product page designs with notes below each
My favourite bits
- Large product image and zoom functionality helps to get a great idea of the product
- Even though the associated picture of the model is a bit too “model-ie”, it’s great for showing me how it fits
- Shop the look button below main image is very helpful in assisting me to complete the outfit, so that I can look like the model
- “Free Delivery & Returns” – very well placed directly under the price
My favourite bits
- Review stars and how many reviews underneath product title
- “Ships Free!” underneath main price
- Massive main image gives plenty of detail
- “Fit Survey” – Amazing way to answer very specific and immediate questions. This would definitely push me to the ‘Add to cart’ button
- Quick over of the product description, then a “show more information” button keeps the page clean whilst offering more info