Facebook Pixel
Join our Facebook Community

Create a Heatmap of Where Readers Click on Your Blog

Building-A-Better-Blog-2Have you ever wondered what readers of your blog do when they arrive at it? What do they look at? What links do they click on? What internal navigation do they use? What ads do they click? What positions on your blog do people gravitate towards?

Today your task in the 31 Day Project is to do some analysis of what people do when they’re on your blog by creating a heatmap.

This is a little similar to one of our earlier tasks (doing a first time reader audit) but this one is on a larger scale and using a clever tool that I find incredibly useful by the name of CrazyEgg.

Some of you will be familiar with CrazyEgg already as I’ve mentioned it numerous times previously at ProBlogger but I’ve never really given it a full review.

The basics of this tool are that it tracks where readers of your blog click when surfing on your blog. It creates a heatmap of the results.

All it takes is to embed a little javascript on the page that you want to track and CrazyEgg will do the rest. Here’s an example of a heatmap of a page from Digital Photography School that I ran a CrazyEgg test on recently (click for an enlargement):


This is just the section of the page above the fold (CrazyEgg tracks the full page) but it shows you quite clearly a number of hotspots on the page (particularly the top left hand navigation section and the picture).

The other useful tool that CrazyEgg offers is one that they call ‘Confetti’ (pictured below). This pinpoints the exact position on the page that people click and analyses them by a variety of ways. In the following screen shot the different colors signify different sources of traffic.

The red dots are where Digg users clicked, the yellow dots are tracking visitors from Google etc. Confetti also lets you track people according to their operating system, the keyword that they arrive on a page using, browser, window size and even how long they stay on the court before they click.


So why would you want this type of information?

Knowing where your readers click when arriving on your blog is GOLD! I can’t emphasize to you enough how much you’ll learn about your blog and reader by doing this type of analysis.

Here are just some of the ways you can use this information:

  • Ad Positioning – CrazyEgg tracks clicks on ads like AdSense. You can track where on the ad they click, test ads in different positions and of different designs (run one test for a few days, then make a change and run another one).
  • Design Testing – Once we finish a few more tweaks of the ProBlogger design I’ll be running CrazyEgg tests on the front page and single posts of this site and comparing the results to the previous design of ProBlogger. In doing so I can compare how different design elements, navigation etc are working to fine tune them.
  • Content Development – I’ve learned a lot about writing and how to structure posts using CrazyEgg. Particularly interesting is how readers click different links in your posts. It’s also fascinating to see where people click on your blog where there are non live links (you can track these too)
  • Reader Analysis – Being able to track how readers from different sources use your blog differently is very useful. For example what if you could find out what type of links or ads Digg users click as opposed to Google traffic? You could use this information to serve up different type of design to different users etc.

Really the list goes on and the more you use CrazyEgg on different parts of your blog will reveal all kinds of useful information.

Give it a go. CrazyEgg does have a free option (that allows you to track 6000 impressions per month on up to 4 pages). I personally use a paid plan which allows more impressions and pages but even the free plan will teach you a lot.

Once you’ve given it a go let us know in comments below what you learn. I’d be fascinated to know what you find and how you use the information.

Please note – that the link to CrazyEgg in this post isn’t an affiliate program but has a problogger code embedded in it because CrazyEgg is doing a special offer for ProBlogger readers to give them extra impressions for the ‘free trial version’ (6000 impressions instead of the normal 4000).

About Darren Rowse
Darren Rowse is the founder and editor of ProBlogger Blog Tips and Digital Photography School. Learn more about him here and connect with him on Twitter, Facebook and LinkedIn.
  1. This is a fun tool that has a lot of value. A tool like this can help you develop a decent CTR.

  2. Indeed CrazyEgg is a useful tool and a must for those considering a redesign of their site – or those with a redesigned site.

    I used it on my website a few months back.

    First I learnt that I needed to switch the positions of the “Categories” and the “Archives” in the sidebar.
    Also I saw the need of linking the headlines to the rest of the articles – and later having to underline them too !

    Awesome tool !

  3. Hi Darren,

    Excellent tip! The heatmap looks great and very informative. And, can’t we not thank you for the link? :)

  4. I really like the graphical element of this, but Google Analytics will also give you an overview showing where people click and how many times.

  5. I’m not sure where I put the code in my WordPress Theme. Does it really matter if it’s right before the closing body tag? That would mean putting it in my footer template, but then the code would be shown on pages where I don’t want it.

  6. I’ve been meaning to do this for some time. Thanks for the nudge! There’s also a brand new service called ClickTale that actually lets you watch screencasts of visitor heatmap activity. I’m not affiliated with them, I just mentioned their launch announcement on my own blog a couple weeks ago. And there are other similar services, so play around with the different ones to see which one works best for your analysis needs.

  7. That’s really cool! It’s analytics for a more visual person…

  8. Do you think refferal advertisement on blog causes bad reputation of blogger, because i have not seen decrease in traffic of my blog when i advertise my affiliate link at my blog.

  9. The visual element to this is very interesting.

  10. Yes, definately it will help to boost your earning from click programs like adsense.

  11. I tried something similar to this before but it wasn’t as graphic…I’ll be heading on over to their site right now, thanks Darren!

  12. I’ve tried this tool when I first heard about it. It’s definitely a great idea to find out where people are clicking and it’s useful to know where to position ads.

  13. excellent tool. very interesting

  14. This is fantastic. I didn’t know you could break ti down from referring source, but after analytics I shouldn’t be surprised by much anymore. Thanks for the extra impressions ;)

  15. Hm…
    That’s quite nice.
    The only downside is that you have to pay for the full version. lol
    I like free things. Who doesn’t?

    Something to remember is that Google Analytics does the same thing – but not quite as detailed. It won’t give you as much of a visual emphasis on the quantity of clicks or a breakdown… but it still is very similar and something to take into consideration – especially if you are already using Google Analytics. (which you should!)

  16. That is very neat!!

  17. I’ve been using CrazyEgg for a while. What interests me is how few times visitors click on the sidebar. It might as well not be there. Virtually all clicks occur within the main post content.

    That could be down to the type of visitors my site attracts, 70-80% of visitors are search engine traffic from people who may not know what a blog is or understand what the sidebar offers. Or it could be down to poor sidebar design or uninteresting sidebar content.

    These analysis tools are great. I’ll be completely overhauling the sidebar and see what happens.

  18. Darren, thanks for the tip. I am a visual person and this will definitely help.

  19. This looks very interesting! Thanks for writing about it! I went and signed up.

  20. Great tip. Knowing where users click will help us to know where to concentrate on. Also how to change our design to drive more attention to other areas on our blog.

  21. My boss flipped when he saw this and immediately signed us up for the Pro plan. Very, very cool.

  22. Darren,

    I am going to have test that out on my blog. From the looks of your map it looks people are clicking mostly on the links in the top-left hand corner. Isn’t that what most heat maps show?

    I would be most intereted in seeing what places people are clicking on my blog that don’t contain links.

  23. Something like this would be very useful, especially for ad placement! Of course, it would also be nice to know what other links readers are clicking on.

    A very valuable tool indeed! Thanks for the great post!!!

  24. I have talked about that very nice service on my site about a month ago. Not many people really cared about it though. But with this post, more people will surely know about it more. Nice post Darren.

    Sly from Slyvisions.com

  25. Excellent tip, Darren!

    It’s a topic I’ve been meaning to explore on my blog for increasing clickthrough rates for Google AdSense ad units.

  26. That is an AWESOME tip Darren!

    This is something I am going to try, great for increasing AdSense clicks.

  27. This is very cool indeed. So many cool things and so little time! Too bad I have a job.

  28. Hi Daren
    Recently I started to use crazyegg and was highly impressed what it was showing. I was able to find out where google adsense clicks were coming most. Every one should use it.

  29. Thanks for the tip Darren. I have been relying on Google Analytics thus far but your post has encouraged me to give CrazyEgg a go!

  30. very great tool, thank you :)

  31. Thanks Darren. I wasn’t aware that Crazy Egg had a free version.

  32. Great tool! So far the most interesting thing I’ve noticed is that users get easily distracted. They come to the site looking for something specific, and end up clicking on a different topic.

  33. Wow this is a really neat little tool.
    I will most certainly be using this on all my pages from now on!

  34. A useful tool to analyze readers clicking preference. I just signed up.

  35. This is AMAZING! Thanks so much for the hookup- its very informative. I appreciate it!

  36. Thank you Darren, this looks like a fantastic tool, I just signed up :)

  37. There is also an implementation you can run directly on your server called ClickHeat (http://www.labsmedia.com/clickheat/index.html). Not that much features, but still very valuable.

    Read about it in my blog (german): http://blog.oncode.info/2007/09/16/clickheat-klick-zeig-dich-du-bist-umzingelt/

  38. I am putting a version together which will be a heatmap, clicksmap and ads tracking tool combined. Although it is closed doors at the moment it is going to track everything; from keywords, to urls , referrals and these are for these ads i means:


  39. Wow, this is fantastic! Way better than what google does with it’s analytics product. Just wanted to say thanks for pointing out this great resource, this is my first post on your site!

    Would be nice if there was just one script you could put in the footer of all pages (if you use SSI like me) and instantly get clickmaps of your entire site. Haven’t looked into this enough, more than getting a heatmap after about 10 minutes, but I’m really looking forward to this!


  40. just what I was looking for. I have a starters web hosting plan from Yahoo. It’s not been a month but average monthly visits are well beyond 15000 (going by my previous GPC hosting).

    This is just the tool I was looking for. What better way to monetize than this one? I guess till now all was waste. But now that I see the heatmap I’ll place the ads acordingly.

    I’m planning to purchase a plan now.


  41. I just went over to play…I love the visual element. I’m a big time visual learner, so being able to “see” the differences will help it click on place for m e

  42. I have no idea how to use the ClickHeat thing. I downloaded three files from their site and now dont know whats next. Do you have any idea?



  43. You can use a service called ClickHeat too. It’s fully hosted on your own domain, but doesn’t provide as in-depth statistics. I personally think I’ll try CrazyEgg.

  44. Does this register clicks on Flash movies? Currently I use similar click data using Google’s Site Overlay feature. However any links that occur within a Flash movie are not captured by Site Overlay.

    The ClickHeat script looks interesting and worth trying though I have the same question relating to Flash movies.

    On the flip side, the Google Site Overlay feature is a great tool because it is so tightly integrated to the rest of your Google Analytics and if you have Goals and Goal Values set up, can actually help you understand the value of each click on your site.

  45. Very helpful! While it may not provide as much as Google Analytics it really gives you a more visual interpretation which is most insightful.

  46. Great product that I have used for quite a few years – I also have used it on my client sites I design to offer some information about usability and architecture of a site. I do want to check out some of the other options mentioned in the comments, but I am always very supportive of sharing the tools that help do our job better.

  47. Great resource on blogging! This will generally increase commissions via ad placement.

A Practical Podcast… to Help You Build a Better Blog

The ProBlogger Podcast

A Practical Podcast…