How Top Retailers Show Product Images
We've all heard Confucius' famed quote "a picture is worth 1,000 words" at least 1,000 times.
Online, pictures are worth more than words, they're worth dollars. But how many dollars depends on how effectively product images *speak* to customers. We're talkin' details. Just like textual product descriptions describe a product in detail, enlarged images and alternate views better describe your products. And many products cannot be fully described with words.
According to a 2007 survey of online shoppers by the E-Tailing Group:
- 77% are “very to somewhat” influenced by the quality of content (descriptions, copy, images and tools) when deciding to purchase from an online retailer
- 79% "rarely or never" purchase a product without complete product information
- 76% believe content is insufficient to complete research or purchase online "always," "most often" or "some of the time"
- When faced with incomplete information, 72% go to a competitor or research further
Future Now did its own customer experience study and found 24% of online shops do not allow customers to enlarge images, and 63% don't offer multiple image views. I decided to do some research myself, cruising the Internet Retailer 500 List looking for examples of how online retailers are showing off their goods:
Images in Action
A simple way to enlarge images is to have a link "click to enlarge" that opens up a pop-up with the thumbnail image blown up. The next level up is to offer alternative images in the pop-up with the ability to change the image with a click or mouseover.
or Adobe's Scene 7. Magic Toolbox' Magic Zoom lets you hover over any area of a product image without a pop-up or click (stay on the product page). There may be other products that also do this, but I'm only aware of this one.
This example from Danskin shows how you can view the front or back of this product in any of its 4 colors:
Scene 7 is typically launched in a popup window with the option to click a plus or minus button to enlarge, then click and drag the image around the window to look at specific detail. Or, use the magnifier to blow up one portion:
I found Scene 7 was fussy to use, and on some sites would load a blank window. Not to mention the time to load. I do prefer the Magic Toolbox product, as a web user.
Altrec uses a slider for image zoom which you can control by clicking and dragging left and right from the enlarge pop-up. You can then click and drag the big image to move it around within the window.
The Adidas Store does the same thing right on the product page (no pop-up. less clicking required).
OnlineShoes.com is like Adidas, but includes alternate views which really help describe the product. You can view them all without pop-ups.
I'm not sure the magnifying glass is a good icon here - that's more associated with a search box than image magnification.
A handful of retailers like Gap's brands use a Quick Look preview from the category page, with full product information. If you want an even larger view you can click to a popup with color switching and view switching.
Huge Category Zoom
Bidz.com explodes images on the category page with a rollover - the biggest previews I've ever seen.
Large Default Images on Product Pages
Moosejaw uses a large image on its product pages with detailed information in tabs. Just rollover alternative views for instant enlargement.
TiesNecktie.com uses large product images too. Ties are one type of product that really only need one view, so this is usable, effective and inexpensive.
By showing front and back views on one image, Causal Male saves clicking between 2 images on the product page, and also gives more product information from one thumbnail on the category page. This is great for shoppers in "competitive" buying mode who want information fast, fast, fast. Plus, it never covers up the call-to-action.
Uncommon Goods' approach is uncommon, but good (I know it's cheesy but I couldn't resist). For certain products, the image is shown in a landscape banner with zoom and move controls right there on the page.
Neiman Marcus and Venus Swimwear use floating images in the sidebar that follow you down as you scroll down the page.
Horny Toad lets you select size scaling on the category page:
ACLens offers a .pdf print-out of the actual size of its frames:
J.Crew allows enlargement and multiple color / angle views for cross-sells as well:
full cross-sell set and enlarge them and color switch them on the same page
What do you think about the call to action? Too long? Cute the first time but annoying when used on every product?
So these are some examples of providing slick product views in usable and creative ways. But how can you up the persuasion factor and tell a story with your product images? Tune in tomorrow for tips and examples on how to show products "in context."