CSS-Tricks

google analytics

Google Analytics Data Studio

# By Chris Coyier

I've said a number of times in the past:

I wish I could just check a checkbox and make certain Google Analytics data public.

I get that analytics can be a very private thing for some sites. I think there are just as many sites where that data just doesn't need to be private. Not only would it be interesting, but insight might be gleaned from having more eyeballs on the data, and it could contribute to a wider data set of analytic trends.

Anyway, there is no such checkbox. (more…)

Google Analytics Can Show You Screen Resolution ≠ Browser Window

# By Chris Coyier

It was five years ago when I wrote Screen Resolution ≠ Browser Window. The idea was that, at the time, there was a lot of talk about monitor size in relation to how we design websites. JavaScript is happy to tell the dimensions of a monitor: screen.width. But how useful is that? Isn't it more useful to know how big the actual browser window is? Of course, it is. We don't write media queries based on screen.width, we write them based on the browser window width, e.g. @media (min-width: 400px) {}. (And perchance, someday, element/container queries.)

The fact that we can and do practice responsive design means that we have all but stopped worrying about what an "average" size browser is. Still, it's interesting data to have.

(more…)

#146: Getting More from Google Analytics with Philip Walton

# By Chris Coyier

I pair with Philip Walton (who works for Google on Google Analytics) in this screencast. It complements the case-study we put together: Learning to Use Google Analytics More Effectively at CodePen.

I learned a ton about how Google Analytics works during all this. In a sense, it's dumber than you think. You can track whatever you want, you just need to send the right data. In another sense, it's super smart. By giving it just a smidge more information, you can extract a ton more out of it.

If you go in with specific questions, and take the time to implement the (pretty simple) bits necessary to track what you want, you can get the insight you need.

Plus it's free, for most of us, which is pretty huge.

Learning to Use Google Analytics More Effectively at CodePen

# Sponsored

Here's how most people use Google Analytics: you copy and paste the default tracking snippet into your templates. Look at the pageview data that comes in. That's all good, but that isn't the most useful analytics for many sites. Google Analytics can track just about anything. It's very flexible and very powerful. Philip Walton and I co-wrote this article to show you how to do some custom GA stuff to help you collect data you maybe didn't know you could collect and how you can look at that data in useful ways.

(more…)

Track Window Resizes through Google Analytics

# By Chris Coyier

Sparkbox has this snippet to help figure out how often browser windows really are resized.

(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);
  });
})();

Note how easy it is to track events in Google Analytics. That can be used for just about anything.

#31: Introduction to Google Analytics

# By Chris Coyier

Google Analytics is a free service to track all sorts of information about the visitors to your website. I recently had a weird experience with the Analytics on CSS-Tricks, so I thought it would be a good time to introduce it to folks who might not already know much about it and also share that experience. As with most things, it has its ups and downs, so I introduce an alternative product at the end as well.

Links from video:

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag