User-interface guru Jackob Nielsen’s concludes that “Web users spend 69% of their time viewing the left half of the page and 30% viewing the right half. A conventional layout is thus more likely [to improve website conversion rate].”
On the FutureNow blog, Brendan Regan suggests developing an infographic to let you lay Nielsen’s findings over your own website.
We’ve taken this one step further and created a tool that you can download today to do your own tests,
- Download our tool by clicking here for .PNG or here for .JPEG .
- Lay it over a screenshot of your website in any photo editing tool.
- Lower the opacity of the screenshot to see it laid over your
- The “red” areas represent where users spend most of their focus.
- The “blue” areas represent areas that users are prone to ignore.
This will give you a solid idea about how well your website design is matching the habits of your visitor.
Matching the habits of your visitor, will increase your conversion rate.
It is worth noting, that there are a few flaws in Nielsen’s conclusions:
- Nielsen’s conclusions were drawn from testing users on static 1024×768 resolutions. We’re not sure that this makes sense, as over the past year more than 76% use larger screen settings that that.
- Nielsen’s examples focus on content sites, not necessarily sales pages or ecommerce.
However, we do agree that accessibility leads to higher website conversion rates, and the data is strong enough to test this methodology on your website.
Update June 1st, 2010: We’ve take it one step further – try our new Horizontal Overlay Tool to superimpose a guide showing you where users focus most of their time on your website. The horizontal layout overlay graphic from our blog post regarding layouts can now be used on any URL you choose.
Update April 28, 2010: The GetElastic team points out recent results showing that putting a “Add to Cart” button on the left side of the screen drives an increase in website conversion rate.
Nice PNG thanks, I will be definately testing out whether a left layout or right layout on my site makes a difference to my conversion rate – and I wrote a little blog post about it here https://online-invoices.tumblr.com/post/646807372/reading-test-your-horizontal-layout-to-maximize
What a great blog. I spend hours on the net reading blogs, about tons of various subjects. I have to first of all give praise to whoever built your theme and second of all to you for writing what i can only describe as an astounding article. I honestly believe there is a ability to writing articles that only a few posses and honestly you have it. The combining of demonstrative and upper-class content is definitely highly uncommon with the large amount of blogs on the cyberspace.
This is great info and a useful tool for evaluating layout. Supports the notion that people read web pages in a ‘F’ shaped heatmap from top to bottom.
We where testing the layout and usability of our website cms by using mouseflow, but not result because there is a login/password before getting in to the cms.
Is this possible with you software? Getting information behind a login?
Probably the easiest thing to do would be to grab the actual image:
https://d393l9f30gx0gj.cloudfront.net/blog/wp-content/uploads/2010/04/HorizontalHeatMapWithValues.png
And then screenshot your website CMS, lay our image over using just about any photo image editing tool and increase the transparency so you can see one over the other.
Thanks for commenting!