While searching the web for a proper way to track user behaviour, I stumbled upon a very interesting blog post written by Brian Cray. He uses the „power“ of Google Analytics‘ new Asynchronous Tracking to track all clicked links and get information about how the users behave on his site. This method gives you insights about what elements of the site are really used and how the visitors are navigating through the content. Brian sums it up quite properly:

I dare you to answer the following questions with your current Google Analytics setup:

  • Are your users using the main menu to navigate or do they use different means to find content?
  • Do your users scroll through your content and click links in the footer?
  • Do your users click on an article title or the “continue reading…” link?
  • Do your users actually go through the items in my dropdown menu, or are they
  • unaware of the dropdown menus?
  • Do your users follow your related blog entry suggestions?

As I’ve chosen Mootools as the Javascript-Framework for many of my websites, I couldn’t really copy and paste the code to the <head>-sections. I’ve not only rewritten the code-snippet to utilize Mootools instead of jQuery but also tweaked the functionality which results in better tracking.

Just copy and paste this right under the code of google analytics:

window.addEvent('domready', function() {
	$$('a').addEvent('click', function(event){
	  	var element = $(event.target || event.srcElement);

		if(element.get('tag') != 'a'){
			element = element.getParent('a[href]');
		}

	  	try{
	  		_gaq.push(['_trackEvent', (element.get('id') || element.getParent('[id]').get('id')), 'clicked', (element.get('text').trim() || ((element.getFirst('img'))?element.getFirst('img').get('alt'):element.get('href'))) || element.get('href')]);
	  	}catch(err){
	  	}	  	

	});
});

For more information about how this works and asynchronous tracking in general, please visit Brian’s blog.