The Left Side of a Web Page is Most Important

I found some research by Jackob Nielsen into eye tracking on web pages really interesting, in particular the conclusion that horizontal attention leans to the left where research found that web users spend 69% of their time viewing the left half of the page and 30% viewing the right half meaning a conventional left-to-right layout is more likely to make sites profitable.

The analysis was performed on static 1024×768 web page resolutions with a focus on content rather than transactional websites but it would be interesting to see what impact this would have if changes to a layout were made.

Most e-commerce websites choose the familiar layout of product to the left, call to action on the right. Here’s a mockup of a Vodafone.ie product page with a heatmap of the Nielsen research laid on top (heatmap borrowed from ConversionVoodoo)

As you can see the product image and content are in the hot zone, but the price and purchase button are in relatively cold area of just below 7%.

Lets try that again, but this time with some layout tweaks by myself, putting the call to action right in the hot zone.

I’ve moved the image to the left most side of the page, and call to action right in the hot area. As 69% of visitors look at the leftmost 500 pixels – It’s worth putting all relevant content in that area.

Would this increase conversion? It’s difficult to say as there are many layout changes which would have a positive affect on Vodafone’s product page but the great thing about A/B split testing is it would allow an infinite number of contests to fine tune conversion.

It’s also no surprise to see this in the wild with BabeAge.com testing left side layouts converting 16.7% higher than conventional ones, something which they’ve been integrating throughout their website already. While it may seem odd to see the add to cart button on the left, based on Nielsens study and their internal testing it doesn’t seem that strange that it doesn’t conform to most other e-commerce websites out there.

Applying the same heatmap overlay to Apple.ie shows a strong correlation between content and call to action being in the right places.

Although eye tracking is incredibly useful, it’s also quite expensive. An alternative is to use HeatMap tools on your website to determine where users are clicking and moving their mouse. I love using CrazyEgg & ClickTale (Paid) but ClickHeat is a solid free alternative.

Switching all your content and call to actions to the left side of the page based on the research alone is probably not a good idea, but using A/B split testing will determine if small changes have a positive impact on your websites performance.

Tweet