Pretty Simple: web, digital, social

Yesterday, the Google Code Blog announced Google Browser Size. It’s a handy little tool which allows you to take a contour visualisation of common browser sizes and overlay it onto your own sites, to easily spot which areas people can see without needing to scroll. So for example, here’s my site with the overlay applied:

Browser sizes

Browser sizes as an overlay

What this shows is that, for example:

  • only 1% of users have to scroll to see all of the main banner on my site
  • 80% can see the Latest News box in its entirety, without scrolling
  • Half of users have to scroll to read the Good Causes section

That’s all very interesting, and Google cites a good example where a call to action on a page (in their case, a “download” button) was below the fold for 10% of users. However, the logic gets a little fuzzier when they state:

Using this visualization, Bruno confirmed that about 10% of users couldn’t see the download button without scrolling, and thus never noticed it.

Introducing Google Browser Size – Google Code Blog

Spot the error – the assumption that users will not notice things below the fold.

Thinking beyond the fold

This assumption doesn’t ring true with my experience of user testing, where people will almost always scroll if it is clear that more information exists below the fold. And I’m not alone in observing this. A recent article over at cxpartners talks about the myth of the page fold, describing how user testing revealed that users don’t actually mind scrolling:

People tell us that they don’t mind scrolling and the behaviour we see in user testing backs that up. We see that people are more than comfortable scrolling long, long pages to find what they are looking for. A quick snoop around the web will show you successful brands that are not worrying about the fold either.

The Myth of the page fold –

This is a really good example of how user testing can be used to prove (or disprove) dominant assumptions about user behaviour.

And there’s a wider issue here – that of separating content from presentation. We shouldn’t be wasting our time worrying about the minutiae of how web pages look, especially given that the rise of mobile browsing makes this pretty hard to do anyway. When you add user preferences such as increased text size, this becomes even harder, if not impossible, to truly account for.

With that said, I really like Google Browser Size, and think that what it does do well is remind us that there are so many variations out there that we simply can’t account for them all. By all means use it to identify a few quick wins (for example, an important call to action should be at the top anyway), but don’t get too hung up on making your site fit every shape and size of browser.

Horizontal scroll

It’s probably worth pointing out that when we say that users don’t mind scrolling, we usually just mean vertical scrolling (up and down). Horizontal scrolling is a different matter entirely, and in my experience users hate to have to scroll horizontally. There are some nice examples of how you might get away with it if part of the design (see Design Meltdown’s gallery of horizontal scrollers), but unintentional horizontal scrolling can drive users away in no time at all. Avoid inflicting this upon your users by designing to the lowest common width of your intended users, or (far better) implement a fluid-width design.

This entry was posted in Blog and tagged , , , , . Bookmark the permalink.

3 Responses to Google Browser Size and thinking beyond the fold

  1. Gary Miller says:

    Nice informative article James.

    I’ll have to give the Google tool a run for myself. Do you think that the move away from original thinking on vertical scrolling and having important information above the fold – if, indeed, having a fold at all – has anything to do with the evolution of the humble mouse?

    For example, earlier mice required you to either move the cursor to the down arrow or the slide bar, then click and hold or click, hold and move the slider down respectively.

    As mice evolved in functionality it is now, for example, a simple matter for a user to flick a scroll wheel to ‘travel’ down the page.

    There must, surely, be some correlation there?

    p.s. I must add that I haven’t forgotten the importance of monitor size and screen resolution in these changes in trends!

  2. Thanks for the information and the tool is pretty useful.

    However, with layouts that have a centered fixed-width content block (such as your blog) it is necessary to tweak the browser window size to get a good judge of a page’s visibility. I’m using a wide screen laptop as it would appear that you may have been when you took the screenshot above. Your pages actually would be totally visible on 800 x 600 – using the tool with a maximised window implies the opposite.

    Please don’t take this as a criticism of your post – I mention it only to point out something that is not covered on the Google Labs page itself, and I will be feeding this back to them too.

  3. James says:

    Absolutely right Graham, the vertical parameters don’t work with centered fixed-width websites unless you manually adjust your own viewport size to match each resolution you want to check (which kind of defeats the purpose of the tool). It shouldn’t be difficult for Google to create a centered version of the overlay, to apply to sites such as this blog.

Leave a Reply

Your email address will not be published.

Browse by Category