17 December 2009

Google browser size - but what about liquid?

People view the web in many different ways. There is little uniformity in the display sizes, aspect ratios, and resolutions that we use to browse the web. When creating a web site or a web-based application, you need to check how your design looks through different combinations of the above -- and then you need to make some guesses about how many people are actually using each of the combinations. Sure, some people might still be out there trying to look at your web site in 320 x 200, I suppose, though too few to warrant a lot of work on your part to optimize for them. So you need to take into account both your majority audience as well as enough of the long tail to satisfy most of your likely customers, while weighing this against the work it takes to test this.  

The goal is usually something like making sure that the "important stuff" that you want people to catch at first glance appears above the fold -- a borrowed newspaper metaphor.  

Google Labs has just released a tool called Google Browser Size that attempts to help understand what percentage of likely web audiences use various screen sizes. They measure screen size in horizontal and vertical dimensions as percentage of users. You can now understand how people are likely to interact with your page from a statistical point of view.

The tool has some neat technical aspects, such as the set of div's that allow you to interact with the underlying page even when it has been overlaid with the Google statistics. According to their about page they get these statistics from all visitors to Google (it's not clear if they mean the Google home page or all Google.com pages).

One unfortunate drawback is that the tool only supports the native (non-virtual) viewing size of the display of whoever is using the tool. This specifically presents an issue for web pages that use a liquid design which resizes itself at least partially according to the user's display. On my 1280x800 widescreen laptop display viewing a liquid page like http://www.markbeadles.com/, for example, the tool incorrectly implies that objects on the right side of my screen aren't visible to most users, when actually they are due to resizing. [I suppose the solution many of you would recommend is to not use a liquid layout. Eh. De gustibus non est disputandum.]