Daily Archives: January 19, 2010

Web Design

See what your website looks like in all screen sizes and resolutions

A couple of months ago we had a guest blog from Alison Cross of Alisoncross4webs that talked about how to put The Gold above the Fold.


Newspaper Talk

This phrase is borrowed from Newspaper publishing. It means that if you have something really important that you want everyone to notice, make sure you put it high up on the page, above the place where people fold  their newspaper.

Website Talk

When this applies to building a website, the ‘fold’ is the lowest part on the page that people can see without scrolling.

As many people do not scroll down web pages, it’s important to put your most important information (your gold) above this point (the fold).

Screen Sizes & Resolutions

That’s all very well, but there is a problem: There are a lot of different sized screens with different resolutions. And some people have toolbars installed too. This means that some users can see more of your website than others. And that means that the fold can fall in many different places.

Finding the Fold

So how do you find out where this fold is? Thanks to a handy little visualisation tool from Google, its now possible to accurately see where the fold is for your website for people using different screens.

The Google Browser Size tool lets you understand how everyone sees your website. For any point on the screen, the tool lets you know what percentage of people can see it without scrolling.

Here’s an image of what it looks like:

The tool isn’t perfect. It assumes that your website is left hand justified rather than centre justified (like most WebEden websites are). Nevertheless, when you’re making a website you can use the tool to make sure the important stuff can be seen by everyone.

Try using the browser size tool on your website and leave us a comment below.

Published by: