Streaming live at 10am (PST)

Use Google Analytics Events to track how far users scroll on a webpage


#1

I've got a long-scroll page, and I'm trying to track interaction in analytics. Is there a way to fire an event when someone scrolls down a page?

Separately, does anyone know how to track actual time on page? Typically, time on page is calculated by taking the time someone arrived, and then subtracting it from the time they made the next click on something on your site. What this loses is if someone arrives on my site, scrolls around a bunch, but then leaves without clicking on things.

I don't want to force people to click on things (like a modal pop-up or something), but I want to be able to tell if someone spent 20 seconds on my site vs if someone clicked the back button immediately.

Thoughts?


#2

It can be done - but requires a fair amount of custom code.

Assuming you're using google analytics, you can report back whatever you want using events:

https://developers.google.com/analytics/devguides/collection/analyticsjs/events or https://developers.google.com/analytics/devguides/collection/gajs/eventTrackerGuide

Link 1 is the newer 'Universal Analytics' (mid 2014 released)
Link 2 is for the classic version of google analytics

As for knowing when the user reached a given section - that is far trickier. You would have to use the javascript scroll event or something similar and then calculate if the user has scrolled past your target. There is a javascript library called waypoint which handles some of this for you.

For tracking time on the page, in custom code you would set a variable like: var startTime = Date.now(); and then later var timeOnSite = (Date.now() - startTime) / 1000; which will give you the number of a seconds between when the user loaded the page and whenever timeOnSite was calculated.

if you're not concerned with the time and just want to know if the user has spent > 20 seconds on the page, you also could use the setTimeout function and then fire an event to google analytics with the same method as above once it triggers.

setTimeout(function() {
   /** fire google analytics event here **/

}, 20000); // This function will be called after 20 seconds (20000 milliseconds) have passed

With single page sites, bounce rates are artificially high - google touches on that and suggests using events to get more accurate data in this post: https://support.google.com/analytics/answer/1009409?hl=en


#3