Fun graph: New data shows true screen sizes

EDF got nice attention lately for our apparently ground-breaking use of responsive design. Ironically, that came just as we started to think about screen resolution in a new way.

Jakob Nielsen recently wrote about screens getting bigger over time (right). Useful data, but it only goes so far. Just because we can view Twitter feeds at 1920×1600, do we?

It turns out that we might not.

We don’t always keep our browser window at the maximum size. We change it as we click around. And some of us use toolbars, which shrink the actual space available to see sites. With all the variation, how are people are really seeing our sites?

I suspect the reason that Nielsen didn’t address this question is that it’s hard to get the data, particularly historically. Out of the box, Google Analytics tells you only the physical size of the screens your visitors have. When I asked EDF’s super-developer, Patrick Cranston, for help getting beyond this limitation, he turned up this method for capturing actual dimensions. Now, we can measure the true size of viewing area.

Our awesome analyst Mathew Grimm sliced some of the early data, and the results are fascinating (click for a larger version).

The larger the circle, the more visitors saw the site through that size. See below for a note on the red square.

The biggest takeaway — it would be almost impossible to design one site that works well at this huge variety of sizes. Responsive design looks like an increasingly important solution. Other observations:

  • The old idea of one “fold” that applies to everyone is dead — while people do see the site at (somewhat) dominant widths, that’s not at all true of heights. Even people who see the site at the same width see it at a wide variety of heights.
  • A surprising  number of people see less than 800 pixels of height. And our home page is the only page I know of that responds to height as well as width…
  • The dense cluster marked by the red square is an interesting challenge. The difference between 900×512 and 1280×896 is significant from a design point of view, and there aren’t clear dividing points in that mess. People see the site every which way in between.

There’s a lot more to explore here. For example, a substantial number of visitors re-size their browsers during their visit to our site, and we want to look into when and in what direction.

I’m looking forward the next generation of EDF’s responsive design, informed by this new generation of screen size data.