ASOS.com is one of the world’s largest online fashion retailers with a market capitalisation of 2.51 Billion British Pounds (4th March, 2016) so it would be a fair guess that they know a thing or two about how to present a product on a website.
Below is a screenshot of an ASOS product page with notations on 5 simple presentation tips you can use to make your product pages better.
1. Reassurances – at the top of the page are three reassurances aimed to ease any doubts in the buyer’s mind before they click the purchase button. ASOS must have tonnes of intelligence on why their user’s don’t purchase, and these reassurances aim to address that. Knowing about shipping costs and returns are obviously large mental roadblocks for consumers of fashion online, so are immediately and prominently addressed at the top of the screen.
2. Contrasting Colours on the “add to cart” Button – the goal of any product page is to have the user click the add to cart button and ASOS make this as easy as possible by using a highly contrasting colour to make the button stand out against the background.
Importantly the button is ‘above the fold’ so users don’t have to go hunting for it. They simply select the colour and size then add to cart.
3. Product Images & Video – ASOS use multiple product images taken from various angles and different contexts (standing / walking). They also show a video of the product in action. Highly recommended for selling clothing online.
4. Social Proof – Immediately below the product is a social media ‘share’ bar. Lot’s of likes and shares indicate the popularity of a product with other users, so may help sell the product. Unfortunately, low or no likes and shares can have the opposite effect.
5. Above the Fold – keep everything that’s important above the fold, including:
a) The price
b) The add to cart button as well as the size and colour buttons
c) The images
d) The product title
e) Everything required to sell the product