Measuring Time On (Bounce) Page

For people measuring their website traffic with Google Analytics, there is nothing more frustrating than building a really popular web page that gets tons of visits, but GA shows Session Duration close to ZERO! The problem is that Google Analytics doesn’t measure the time on the last page of a visit, so even if they read your article for 5 minutes, if they don’t click on another page, their session is recorded as 0 seconds. Sigh….

engagement-reportSeveral people have suggested methods to measure the real time on page, and most of them have some combination of ‘did they scroll?’ or ‘did they read all the way to the bottom?’, and they record the time in seconds. After trying a few, I finally realized what I wanted was the Audience-Behavior-Engagement report.  A simple count of the number of sessions in a histogram, I realized there is a better way…a simpler way.

Instead of tracking the actual time on page and then fussing with data to build a pretty histogram report, I could capture the actual histogram groups themselves! The result lets me  easily build a report to visualize how long people are spending on my landing pages even if they bounce!

time-on-page-report

The magic is performed with a simple Javascript snippet, placed just before the </head> tag. You may need to adjust the code to match your tracking code implementation. If you use the analytics.js tracking snippet:

<script type="text/javascript">
function timer11(){ga('send', 'event', 'TimeOnPage', '1', '11-30 seconds', { 'nonInteraction': 1 });}
function timer31(){ga('send', 'event', 'TimeOnPage', '2', '31-60 seconds', { 'nonInteraction': 1 });}
function timer61(){ga('send', 'event', 'TimeOnPage', '3', '61-180 seconds', { 'nonInteraction': 1 });}
function timer181(){ga('send', 'event', 'TimeOnPage', '4', '181-600 seconds', { 'nonInteraction': 1 });}
function timer601(){ga('send', 'event', 'TimeOnPage', '5', '601-1800 seconds', { 'nonInteraction': 1 });}
function timer1801(){ga('send', 'event', 'TimeOnPage', '6', '1801+ seconds', { 'nonInteraction': 1 });}
ga('send', 'event', 'TimeOnPage', '0', '0-10 seconds', { 'nonInteraction': 1 });
setTimeout(timer11,11000);
setTimeout(timer31,31000);
setTimeout(timer61,61000);
setTimeout(timer181,181000);
setTimeout(timer601,601000);
setTimeout(timer1801,1801000);
</script>
</head> 

If you use the gtag.js tracking snippet (used by Google’s Site Kit WP plugin):

<script type="text/javascript">
function timer11(){gtag('event','1', {'event_category':'TimeOnPage','event_label':'11-30 seconds','non_interaction':true});}
function timer31(){gtag('event','2', {'event_category':'TimeOnPage','event_label':'31-60 seconds','non_interaction':true});}
function timer61(){gtag('event','3', {'event_category':'TimeOnPage','event_label':'61-180 seconds','non_interaction':true});}
function timer181(){gtag('event','4', {'event_category':'TimeOnPage','event_label':'181-600 seconds','non_interaction':true});}
function timer601(){gtag('event','5', {'event_category':'TimeOnPage','event_label':'601-1800 seconds','non_interaction':true});}
function timer1801(){gtag('event','6', {'event_category':'TimeOnPage','event_label':'1801+ seconds','non_interaction':true});}
gtag('event','0', {'event_category':'TimeOnPage','event_label':'0-10 seconds','non_interaction':true});
setTimeout(timer11,11000);
setTimeout(timer31,31000);
setTimeout(timer61,61000);
setTimeout(timer181,181000);
setTimeout(timer601,601000);
setTimeout(timer1801,1801000);
</script>
</head> 

If you use the popular WordPress plugin by MonsterInsights, this will probably work for you:

<script type="text/javascript">
function timer11(){_gaq.push(['_trackEvent', 'TimeOnPage', '1', '11-30 seconds', 0, true]);
function timer31(){_gaq.push(['_trackEvent', 'TimeOnPage', '2', '31-60 seconds', 0, true]);
function timer61(){_gaq.push(['_trackEvent', 'TimeOnPage', '3', '61-180 seconds', 0, true]);
function timer181(){_gaq.push(['_trackEvent', 'TimeOnPage', '4', '181-600 seconds', 0, true]);
function timer601(){_gaq.push(['_trackEvent', 'TimeOnPage', '5', '601-1800 seconds', 0, true]);
function timer1801(){_gaq.push(['_trackEvent', 'TimeOnPage', '6', '1801+ seconds', 0, true]);
_gaq.push(['_trackEvent', 'TimeOnPage', '0', '0-10 seconds', 0, true]);
setTimeout(timer11,11000);
setTimeout(timer31,31000);
setTimeout(timer61,61000);
setTimeout(timer181,181000);
setTimeout(timer601,601000);
setTimeout(timer1801,1801000);
</script>
</head> 

time-on-page-event-labelsVery simply, it sets up a series of timers that trigger after a period of time, and when they do, they trigger a non-interaction event in Google Analytics.  The events use a Category of ‘TimeOnPage’, and an Action of 0 through 6 in order of the time spent on the page.

I populated the Event Labels with the actual group labels I wanted in my report, so I could use them in my reports.

All of the sessions should trigger the first event (0-10 seconds), and then they should continue triggering each new level until they leave the page. What you get is a simple count of the number of sessions that stayed the length of time in the category…not exactly like the Behavior report, but good enough for my reporting purposes.

Its been running for a couple of weeks now, and I am really pleased with the results, so I thought I’d share.

Enjoy!

ref: https://analytics.googleblog.com/2012/07/tracking-adjusted-bounce-rate-in-google.html

Related posts:

Misunderstood Metrics: Bounce Rate

Misunderstood Metrics: Time on Page/Session Duration