HOW TO CREATE A WINNING PRODUCT PAGE

Research Results…

Images

IMAGES…RESEARCH RESULTS

• Retailers should have at least 3-4 different high quality images (at least)

• Show different angles and the product being used.

• Add a zoom functionality so visitors can get a closer look

• Consider location of the image. Common online practise is to place an image on the right hand side of the page, however competitors such as Autoquake, Autotrader etc tend to use image on the left hand side of page as well as many popular high street retailers (See reference documents). Apple locate their image on the right hand side and Nike locate their image centrally taking up the top 3rd of the page with the price, detail and CTA above the Image.

• Test image pages - images showing car against white background vs images with a backdrop.

Research Results…

CTA’s

CTA’s…RESEARCH RESULTS

• A Product page should have a single call to Action Button with a small number of distinct secondary actions. Studies in supermarkets have shown that if a shopper is presented with too many varieties they are less likely to make a purchase, the same applies to CTA’s. Make the process simple for the shopper.

• Always place the CTA above the fold.

• Test the size of the CTA Button. Bigger is better, a CTA button should be bigger than other buttons on the page.

• Consider the use of white space to make the CTA easily visible. The more space around the CTA the more attention is drawn to it.

• Test different designs/colour of the CTA button, it should always be contrasting to other buttons on the page.(Fact of the Day: AC.coms CTA’s are currently Red/Green, less effective with people who are colour blind. Red/green colour blindness is the most common type, 10% of the UK population have this this, and only 0.4% of that 10% are female!)

• Test different language/verbs. Any alternatives to Enquire now?

• Offer a little extra- sweeten the deal by offering incentives to ‘Enquire Now’.

• Reduce the number of mandatory fields and collecting unnecessary information.

Research Results…

Content/Description Box

CONTENTS/DESCRIPTION BOXRESEARCH RESULTS

• The content/description box is usually located in the middle section and gives the opportunity to provide a more in depth detail of the product having already presented a brief overview and allowed the user to see the product more closely.

• Should include as much detail as possible about the product, this prevents users from leaving the website in order to find out more information, increasing conversion opportunity.

• Use bullet points to emphasise offer and best attributes/features/benefits.

• Should avoid using lengthy paragraphs of text above the fold.

CONTENTS/DESCRIPTION BOXRESEARCH RESULTS

• Should list the benefits of the product before the features. People buy benefits not features.For example If selling a bbq customers want a bbq that offers:

Tasty, Healthy Food Every Time Temperature Control Grease Tray

Perfect for Easy Entertaining 300 square inches of cooking space Attached Working Area Easy to Clean

• Features and benefits complement the CTA, use graphics that support not compete with the CTA.

• Reduce the number of choice and distractions. Too much choice can mean customer maybe less likely to complete a CTA

Research Results

Reviews & Testimonials

REVIEWS & TESTIMONIALS…RESEARCH RESULTS

• Studies have shown product reviews are responsible for up to 30% increase in conversions.

• Using Reviews can be a great way to increase conversions, but ensuring they are legitimate/genuine is the key. They should be honest, independent reviews.

• Reviews should feature below all other information on the product page so the visitor doesn’t have to ‘click’ on reviews in order to see this info on the page.

• To build up reviews, offer incentives. For example; Arnold Clark service centres could offer a ‘win 3 years free servicing by filling in a review of your car’ promotion.

Retailer Analysis

Retailer AnalysisDell.com

Images:

Image displayed on left hand side of page Image option opens up a gallery of 20+

different images with different angles and images of laptop in use.

Descriptions accompanying image 360 degree view. Video of product in a presentation format,

displaying features Option to look at Image in Full Screen Mode

Retailer AnalysisDell.com

CTA’s:

X Where?X Not clearly displayed

Content/Description Box:

Describes the benefits before the features/spec.

Reviews:

Featured below the content/descriptions Rating system (5 stars maximum) Honest independent reviews

Other:

‘Comparison, you might also like’ feature Social Media Integrated – Facebook ‘like’ option.

X Cluttered, hard to navigateX Too many distractions/ too much happening on

page

Retailer AnalysisQVC.com

Images:

Over 4 different Images Different Angle Images Showing product in use Zoom Functionality Video Option

CTA’s:

? CTA’s contrasting colour but doesn’t grab your attention

Content/Description Box:

Lists benefits before features. ‘You might also like’ feature Social Media Integration

Reviews:

Reviews/Community Q&A section

Other:? Slightly cluttered?

Retailer AnalysisASOS.com

Images:

Good selection of images Zoom Image ability Video presenting product in use

CTA’s:

Clearly Displayed, Contrasting Colour Good use of white space

Content/Description Box:

Good info on delivery and return options.X Product Description not the best more specification

than benefits and features

Reviews:

? No use of reviews

Other:

Simple design Easy to Navigate and complete CTA ‘Other customers also bought’ feature Social Media Integrated – Facebook ‘like/share’

options.

Retailer AnalysisApple.com

Images:

Image displayed on right hand side of page Good selection of images showing all angles of product Descriptions accompanying Images Video also presenting product in use

CTA’s:

Clearly Displayed at top of page above product images, Contrasting Colour (blue against Grey/white) Good use of white space

Content/Description Box:

Vast amount of information on the product Tab Format used to make navigating all information easier Tab in top section of webpage rather than middle section Design details, features, and benefits all displayed before

the technical specs

Reviews:

? No use of reviews on this page but apple do have customer reviews on most other products

Other:

Simple and clean design Stacked layout reduces distractions, Easy to Navigate

Retailer AnalysisNike.com

Images:

Image Located Centrally Only 1 image but option to zoom to get a closer look at

product Option to look at Image in Full Screen Mode

CTA’s:

Price, Short Description and CTA located above the central Image

CTA clearly displayed Lots of white space

Content/Description Box:

Describes the benefits before the features/spec. Simple Tab system available for further information if

required.

Reviews:

Featured below the content/description box, Honest independent reviews Rating system (5 stars maximum)

Other:

Simple, clear design, easy on the eye. No clutter ‘You might also like’ feature

Competitor Analysis

Competitor AnalysisCarmony.com

Images: Good Selection of images✗ No option to enlarge images or zoom.

CTA’s: Prominently displayed at top of page above product images,✗ Don’t stand out, hard to distinguish (same colour as rest of

website.✗ No contrasting colours ✗ Bad use of white space, blends in with other content on site.

Content/Description Box: Tab Format used to make navigating information easier Detailed spec✗ Lists technical spec before features. No benefits, overview

or summary. ✗ Tab Format could easily be missed. Not clearly distinguished.

Reviews? No Reviews

Other Finance Calculator ‘How Green’ feature Running Costs Feature ‘Compare’ Feature, ability to compare vehicles added to

favourites.

Competitor Analysis Perrys.com

Images

Car description and price in image light box.

CTA’s

Several CTA’s, Phone number main CTA at top of page

Telephone number CTA repeated and displayed in contrasting colour.

Content/Description Box

Detailed spec available. ‘Clever and different ‘Standard features’ feature. Lists other required info such as Co2 emissions info

including Co2 comparison chart so the data actually makes sense

Tax disc information Running Costs Chart Fuel Costs Calculator Tab Format used to make navigating information

easier

Reviews? No Reviews

Other ‘Similar Deals’ Feature Finance Calculator located at top of screen✗ Slightly cluttered and uneasy on the eye

Competitor AnalysisAutoquake.com

Images: In-depth library of 30+ interior, exterior, engine and

vehicle document images (AC.com should benchmark Autoquakes’ Image section)

Vehicle condition report Images in tab system to separate interior, exterior etc.

CTA’s Prominently displayed at top of page above product

images, Contrasting Colours for CTA’s Good use of white space

Content/Description Box Vast amount of information available, enough for a car

buyer to stay on the site Finance Calculator CAP Data Tab Format used to make navigating vast amount of

information easier✗ No custom description or benefits, lists specs instead

Reviews? No Reviews

Other Ability to ‘Watch’ car and receive emails when price is

changed? ‘Similar Car’ feature (but makes page more cluttered?)

Competitor AnalysisAutotrader.com

CTA’s:

Prominently displayed at top of page above product images,

Contrasting Colour for CTA Good use of white space

Content/Description Box:

Images included in the Content/Description section.

Vast amount of information available, enough for a car buyer to stay on the site

Tab Format used to make navigating vast amount of information easier

CAP data included

Reviews:

? No Reviews

Other:

‘Compare’ Feature, ability to compare vehicles added to favourites.

Stacked layout reduces distractions, Advice section in bottom 3rd of page educating

visitor giving tips on how to buy a car, test drives etc.

ArnoldClark.com AnalysisImages:

Enlarge Image option Vehicle description in light box✗ Image seems boxed in by other features (Summary and

price)✗ Lack of consistency in number of images per vehicle✗ No images of interior✗ No Zoom Functionality

CTA’s:

Good sized CTA button and location Distinct but good sized Secondary CTA buttons? Contrasting Colour for CTA (Red/Green)? Telephone Number CTA?✗ Lack of white space in most important area (CTA)

Content/Description Box:

Vehicle Summary/spec? Co2 and Road Tax detail but no charts or diagrams to explain

or compare✗ Too much unnecessary white space/gaps and size issues✗ No benefits or custom overview/review of product✗ Only Lists technical specifications✗ Not enough vehicle details, ✗ Too much wasted white space, has a static/unfinished feel✗ Tab Format but only one tab✗ Uneasy on the eye and layout issues

Other:

? No Reviews? No Interesting/different/exciting features

Other Interesting Facts!• Landing Pages have, on average about 5 seconds

before the visitors decide to stay or bounce!

• Studies have shown that product reviews can be responsible for up to 30% increase in conversions- *Official Google Website Optimizer Blog

• Before a user is willing to complete the CTA they need to recognise the need for the product. Product description section needs to educate the user on the benefits of why they should buy the product not the technical specifications.

• Don’t worry too much about the ‘below the fold’ rule!Long web pages aren’t always a bad thing. Users are becoming webpage savvy and realise there is usually more to a page than what they can see. They also get a visual cue in the form of a scroll bar on the right hand side of their browser which indicates how long a page might be. Whilst most users won’t consciously see it, it subconsciously provides information to let them know there is more on the page than they first see.

• Ideally though, a page should not exceed 2 printed pages of double-spaced, 12 point text!

END