Optimizing Product Pages to Increase Conversion

Website Conversion April 22nd, 2010



Optimizing Product Pages to Increase ConversionWe love working with ecommerce websites. The potential for growth is larger due to the fact that we’re working directly with the sales engine itself. Instead of sending leads through to a sales team, which may or may not close the sale, we can track and improve the actual sales process itself as the visitor moves through the product pages, over to checkout and purchase.

In other words, we have direct control over improving conversion – and we like that!

Perhaps the strongest element for conversion of any ecommerce website is the product details page. This is where you show the product off, give away all the details and hope that they’ll click the all mighty “add to cart” or 'buy now' button. There are many factors involved in optimizing these pages and this post is going to explore some of those elements. Finally, we’ll talk a bit about using website optimizer to multivariate test the different variations and find out which combination works best for you.  As we go along, be sure to click each image to see a larger preview.

Examining The Product Page

First, let’s take a look at the product page that I have created for the purpose of these explanations. At first glance it looks like a perfectly decent product page:


While this seems like a nice looking product page which we would normally assume would do well, the data may show otherwise. Let’s say that our conversion rate is less than 1% on this page. So how do we improve it? First, we identify the important elements to adjust and then we run tests to find out how visitors to respond to those changes.

Let’s start with the image.

1) A picture is worth a thousand words.

Take a look at the product image. How do the chocolates look. Do they look good? Is your mouth watering? Of course not, because you can’t see them!

Make sure you show the product in its best light. The very first thing we’ll do is replace the image with one in which the box is open and our customers can see how good the food looks. I can tell you honestly, I’d gladly eat a few.


2) Put the price and action in the forefront.

It’s important to make sure that you put the right things, in the right order. While it may seem logical to entice the visitor before you ask for the sale, it’s actually backward to what works online. The most important things to show your visitors, within 3 seconds are value and action. In this example it’s our image and the ‘buy now’ button.

In order to shift our focus, we’ll need to move the price and action up, push the text down and get our visitors looking at these elements in the right order. Here’s how that looks with the new image. Can you see how easy it now is to click on ‘buy now’?


3) Keep text simple and use bullets.

Finally, we’re going to make a few simple changes to the text. Visitors typically don’t read large blocks of text, they skim. They will gloss over the description looking for anything that may entice them to buy. With this in mind, we’ve put the flavors on their own line and made them loud and proud.

Whenever possible, try to use a quick description with a series of bullet points to emphasize the product benefits or features. It’s much less overwhelming and far easier to read.


Putting it to the test

Now I can sit here all day long and tell you what I ‘know’ or think will work but that would be a poor decision on my part. In the case of a product page, there are many variables, most of which are industry and product specific, which can influence a buying decision. So instead, let’s get your visitors to tell us by measuring their actions.

It’s time to bring in our favourite tool, Google’s Website Optimizer. With website optimizer, we can setup an experiment to test out all combinations of the above changes and find out which version converts the best. The process can be quite technical so for today, I’ll just be giving you the basic concept of how this works.

1) We create a multi-variant test within the product page, identifying each change as a variant within the page. We also identify our goal as the visitor clicking the ‘buy now’ button.

2) When the test goes live, each visitor is shown one of the 9 versions of the content and their actions are recorded.

3) Once enough traffic has gone through, the top performing combination is declared a winner and we can place these changes live to benefit from the increased conversion.

And there we have it. We’ve created our variations, tested it against actual visitor behavior, and not only do we know without guessing which version works but we’ve been able to improve our conversion rates on that page as a result! Our aim is to help our customers generate increased revenue from data driven decisions!

To Sum Up

Just to wrap this explanation in a bow, here is a quick re-cap:

1) Make sure the image sells the product wherever possible. A picture of a gift card is nice, but a picture of a gift card surround by cool stuff I’d like to buy is better!

2) Put the action first and the persuasion second. Once they see the action, they can decide if they want to click or continue reading, but never force them to read before clicking.

3) Keep copy clear, simple and use bullets to describe features and benefits. Remember, visitors don’t read – they skim.

4) Test, test, test! Never assume that you, or I, or anyone other than your visitors know what makes them buy. Run split and multivariate tests to find out, without a shadow of a doubt, what works.

Here is one last look at the original and final images. By the way the final image is a result of hundreds of product page tests. My bet is that it would win, but I’ll still always give the data a chance to prove me wrong!

Chocolate-original Chocolate-image-price-text

Post By Chris (37 Posts)

Chris can usually be found in one of two places: Behind a computer screen wizarding websites and marketing strategies, or on a stage making things disappear. Chris has been applying his conversion focused website skills for over 10 years and is happy to share some of that experience here on the TechWyse blog!

Website: →


Chris can usually be found in one of two places: Behind a computer screen wizarding websites and marketing strategies, or on a stage making things disappear. Chris has been applying his conversion focused website skills for over 10 years and is happy to share some of that experience here on the TechWyse blog!

Post a Comment

Send me SEO tips!