Skip to main content

Google Analytics and the Resize Event

07-24-12 Rob Tarr

There’s an ongoing debate in the responsive web design community — do users resize their browser windows or not? Rob Tarr has written a little JavaScript snippet that sends browser resize events to Google Analytics. Some data for the debate!

There’s an ongoing debate in the responsive web design community — do users resize their browser windows or not? During our Build Responsively Workshop in Columbus, Ben mentioned that he would love to have a way to track browser resize events. It seemed simple enough, so I put together this gist as a quick proof of concept:

(function() {
  var resizeTimer;
  
  // Assuming we have jQuery present
  $( window ).on( "resize", function() {
    
    // Use resizeTimer to throttle the resize handler
    clearTimeout( resizeTimer );
    resizeTimer = setTimeout(function() {

     /* Send the event to Google Analytics
      *
      * https://developers.google.com/analytics/devguides/collection/gajs/methods/gaJSApiEventTracking
      * _trackEvent(category, action, opt_label, opt_value, opt_noninteraction)   
      */
      var $window = $( window );
      _gaq.push( [ "_trackEvent", "User Actions", "Browser Resize", $window.width() + " x " + $window.height() ] );
    }, 1000);
  });
})();

This creates a handler for the browser resize event in order to fire a Google Analytics call with the browser dimensions. This solution waits for a 1 second pause before making the call to avoid a problem where some browsers would continuously fire the resize event.

Drop this code into your JavaScript, check out “events” within the “content” tab of Google Analytics, and you can see for yourself how many people are resizing your site.

Also, don’t miss Andy’s article on Google Analytics and the Retina Display.

Related Content

User-Centered Thinking: 7 Things to Consider and a Free Guide

Want the benefits of UX but not sure where to start? Grab our guide to evaluate your needs, earn buy-in, and get hiring tips.

More Details

See Everything In

Want to talk about how we can work together?

Katie can help

A portrait of Vice President of Business Development, Katie Jennings.

Katie Jennings

Vice President of Business Development