8 eyetracking studies from the web’s biggest blogs.

August 11, 201021 Comments
Facebook Twitter Pinterest Plusone

One of the most difficult (and arguably most important) metrics to accurately measure online is the actions of your users. Knowing how your readers move around online is paramount to increasing conversion rates, revenue and the overall success of your site. Over the years I’ve seen a number of heat mapping and conversion optimisation tools for attempting to measuring that sort of data, and even toyed with the beginnings of a solution for my own use.

With the exception of physical user testing web applications, a number of these tools concentrate on monitoring mouse movement, dump it in a database, and show it back to you overlayed on your site.  Simples. Problem is though, that the majority only work as self hosted solutions, only providing access to the data for the owner of the site in question.

The other problem with mouse tracking is that it only does just that. Monitors your mouse. This may or may not actually be where you are focusing your attention at that moment in time.  In comparison, user testing software often gives you a written or recorded explanation of how users found your site, and any problems encountered – which is great. But, what if you could easily get feedback on the most commonly looked at areas of your site? From a multitude of users? And on any site on the web? What sort of competitive insight could that give you as a web professional?

Well now you can. To relatively little fanfare in the UX community, recently launched YCombinator startup Gazehawk does just that.  Using existing technology available in a few places on the web, Gazehawk use webcams as the primary way to monitor how people are interacting with your site. Participants are crowd-sourced and prospected from Gazehawk’s own site, and they deliver shiny reports to your door on where the focus of attention is on yours, or anyone else’s website. To backup the image report, a small amount of feedback is also delivered from the participant of the test, so you gain an additional amount of insight as to how they found your site from a usability perspective.

So impressed with the simplicity of their business model, combined with the all too familiar ‘why the hell didn’t I think of that’ feeling, I decided to take it for a spin with some of the web’s biggest blogs to put it through its paces. Bear in mind, that these results come with a pinch of salt – as these are single user reports for each of the blogs in question. The guys at Gazehawk have advised me that single user tests can be a bit on the shaky side, and the more tests you order the better – but still, interesting insight none the less, as the data is coming as the result of a live user test. So, here are the results of my tests.

Smashing Magazine

URL: http://www.smashingmagazine.com

Full Eyetracking Study Download

Some of the participants in the study gave feedback on the site that they were tasked with reviewing, this was clearly a user who had visited the site previously, however, although this was a single user study – interesting to note that the user wasn’t terribly interested with the remainder of the page. Smashing Mag have notoriously long pages.

Participant Feedback

“I like the clean design. I was interested in a few of the blog posts. Had I been able to, I would have liked to read more on a few of them. I read all that I could on the ones that were most interested to me. It was enough to give me the gist of the article, and let me know if I’d want to continue reading.”

“Right side ‘scrape ads were slow to appear, so may skew my results a bit. Love smashing mag, btw.”

Official Google Blog

URL: http://googleblog.blogspot.com/

Full Eyetracking Study Download

Google’s blog design follows a much more traditional pattern of giving away all of the content, without summaries on one page, so that you can pretty much scroll top to bottom to find and read new information without leaving that page. The eye-tracking study suggests that this is pretty much the case with new visitors to the site. A good proportion of users’ time was spent digesting the home page content, rather than scanning for new sections or interesting content and jumping to a new page. The need for a click is only when you reach the bottom of the page (to navigate to the next set of entries).

Participant Feedback

“Good interesting page.
Pretty well laid out.”

Search Engine Land

URL: http://searchengineland.com/

Full Eyetracking Study Download

Search Engine Land showed a good level of coverage across the site from left to right, and interestingly the subscription, and advertising blocks got their fair share of attention.  The eyes of this particular user made their way the whole way down the page, scanning continuously from left to right.

Participant Feedback

“Nice page the information flowed pretty well – not as dumbed down (via graphics) as some other sites i’ve seen”

Mashable

URL: http://www.mashable.com

Full Eyetracking Study Download

Mashable are another blog who’s information spans multiple pages. In this particular instance, the main story seemed to garner the majority of the attention, with stories further down the page receiving less views.  Maybe not a completely bad thing ,but perhaps the design concentrates to heavily on “what has last been published” which doesn’t encourage first time visitors landing on the home page to browse further. This particular participant was pretty clear in their feelings.

Participant Feedback

“Wanted to read more, but couldn’t find the link to the caveats that Google wants me to know.

So much crap on the screen that it stopped me from doing what I wanted to do: read the story.”

ReadWriteWeb

URL: http://www.readwriteweb.com/

Full EyeTracking Study Download

Read Write Web interesting received alot of visual attention above the log – which was surprising to me, as I assumed that top navigational bars such as this would be somewhat lost. The arrows on the links may have been enough of a visual cue to make the participant want to explore, or see what they did. Whilst this blog is particularly large in depth, it doesn’t make the massive scrolling ask that some of the others that were studied do. In other words, getting visitors off the home page, and deeper into the content that bit quicker.

Participant Feedback

None Received

ProBlogger

URL: http://www.problogger.net/

Full EyeTracking Study Download

Whilst it isn’t reflected in the image below, Darren keeps a video on his blog’s home page to engage visitors.  This is absolutely apparent on this eye tracking study, as it received a good deal of attention. Other interesting take home points were the advertising has a human face, which is known to increase conversion rates. Their certainly seems to be some truth in that from looking at this study.

Participant Feedback

There was a lot of content on the page and the interface wasn’t that clean for viewers. A more simple layout would have sufficed.

The Next Web

URL: http://thenextweb.com/

Full EyeTracking Study Download

The Next Web not that long ago underwent a bit of a design overhaul, and as one of my own favourite tech blogs, I thought it would make an interesting subject. From this single case, we can see that the logo is particularly striking, and brings across the sites branding in a fresh way. Other attention was found on the “Popular” section of the site, which helps to quickly bring new visitors across to popular content.  The mid section of the site seemed to receive more attention than the other sections – perhaps because the eye was firstly drawn to the popular stories, and this particular user continued down the site.

Participant Feedback

“The colored text definitely drew my attention.”

TUAW

URL: http://www.tuaw.com/

Full EyeTracking Study Download

TUAW makes for an interesting test case as it combines not only the “all content displayed home page” design model similar to Google, but also interlaces video, and images into the design. It’s also particular “long” as far as the depth of the page goes.  We can see from this study that the participant paused frequently around the more interactive  content. Again, first story on the home page received the majority of the attention.

Participant Feedback

None available

Conclusions

Whilst this isn’t a terrible scientific study, it did highlight to me a number of things. Blog designers take note – there’s definitely lessons to be learned on how the different content strategies play out in the above, and you might want to start testing to see if you can improve the length of stay, and the number of pageviews your blogs generate – all with a simple design tweak.

Eyetracking should be integrated into your usability testing as it shows things that even a usability test can’t, and information that potentially wouldn’t have been relayed from users can be easily gathered. It also doesn’t cost an arm and a leg to perform – if I can do it, so can anyone in the industry – this isn’t something out of reach for the average person anymore. What do you think? Will services such as GazeHawk open the door for more accessible tracking? Let me know in the comments.

Filed in: Web Design
Tagged with:

About the Author ()

Paul is a regular 30 year old web bloke / programmer with a penchant for online marketing. This blog is a personal outlet, with an eclectic mix of articles.

Comments (21)

Trackback URL | Comments RSS Feed

  1. Amazing, Such a great post, Great collection of URL. Thanks for sharing this information, Really useful.

  2. Catalina says:

    I am concerned about the bias of people having previous experiences with these websites. Nonetheless, eye tracking studies and web analytics make a killer combination.

  3. W3Spor says:

    Interesting study! Have you done, or do you know any userstudy considering similar content with different design/designmodels?

  4. VERY interesting post! I’ve recently done a redesign of my own blog, and I feel that there is always improvement to be made and your article gave a few valuable tips.

  5. This a is a really interesting study. It’s important for clients to get this kind of information so they know how effective their website is. Thanks a lot for posting!

  6. Ron Spinner says:

    I also did an eyetracking study. Your missing video reminded me of our missing menu. It didn’t appear on the screen shot provided by GazeHawk . We were puzzled that people were looking at nothing until we figured it out.

    Every new technology has its bugs and we just have to learn what they are.
    You may be interested in our full review of our eyetracking study: http://www.aims.co.il/blog/eye-tracking-review-of-gazehawk-%E2%80%93-a-useful-website-marketing-tool/

  7. Helpful info there you have,seems to be what my clients are looking for. Gonna try this out. Thanks for your effort !

  8. Thanks for sharing. great..

  9. Its always intresting for a web designer where the user is looking or clicking when they are using a website that they have created.

    On another note the software that you are using makes it look like you are trying to burn a hole through the screen, which looks kind of cool.

  10. Kevin says:

    What an awesome and ironic share. I do freelance work and had a recent client approach me who runs a basket site ( http://www.giftbasketsplus.com/ ) and wanted to install some slick design changes because he ran one of these eye tracking test.

    The difference in his results were the eye hits the main center banner first and then moves towards the left where the categories are, and it seems to just wander off from there – these were really helpful, i’ll be sure to link him to this post.

  11. Dave says:

    Interesting. It seems like users were drawn to the easiest thing to look at. Based on the data, I would say, make sure your logo is tiny and boring, make your headings smaller than the text, and make all of the text bold and in the middle of the screen :-P

  12. That’s some pretty cool findings! Thanks for the links also.

  13. Great post. I have really learned a lot from this blog. I am so thankful I have come across it today.

  14. Kyle Henderson says:

    A new service that also does webcam eye tracking, but with user testing and on more than just on static image.

    YouEye is an online user testing service with webcam powered eye tracking. Test a any website and know where users are looking with our gaze track visualizations. Review screen capture video for every user tested and listen to their audio commentary. Learn from heatmap visuals and html element analytics where users are clicking. Google, Amazon, Microsoft, and Yahoo use these technologies and tools to optimize their sites at a cost of hundred of thousands of dollars, but YouEye brings you these services for less than $100 a month.

  15. Fantastic collection of eye tracking studies, they certainly get you thinking – I would love to see the results from eye tracking studies for our business website.

  16. Great studies, very inspiring.

  17. Phil says:

    interesting study. could help when thinking of layouts.

  18. I find this kind of research very interesting so will take a look at the studies detailed here. Thanks for compiling the resource! Bookmarked :)

  19. Brillient and Fantastic collection of eye tracking studies and This a is a really interesting study. I am so thankful I have come across it these were really helpful thanks for sharing

Leave a Reply

Back to Top