— Text by Stuart Brown

ntended screen resolution is a deciding factor in terms of a site design and layout - catering for smaller resolutions is a key factor for accessibility and for ensuring as many readers as possible can read your content. But how does screen size vary with locale?

The general rule-of thumb is to go as low as possible - if your design works perfectly at 800x600, great - if it's operable at 640x480 or lower, even better. However, as technology progresses, screens are getting larger and the sizes less uniform - 4:3 is slowly losing favour to widescreen ratios, such as 16:9 and 16:10.

In certain circumstances, the market or demographic which you are aiming at can affect your intended viewing resolution - technical and design-oriented sites can benefit from a substantially larger than average resolution. Different regions also have slightly different profiles - widescreen monitors are more popular in some regions than others, for instance.

Below are statistics compiled from 18 months worth of log data from Modern Life - a sample size of well over a million visitors, from all over the world. I took the screen resolution data from the top 25 visiting countries and compiled them into two key metrics - the average screen resolution (in megapixels, calculated by multiplying the horizontal resolution be the vertical and dividing by 1,000,000), and the average screen ratio (average height divided by average width).

The results show some interesting trends.

Here, the green countries show a trend towards higher resolution displays, the red towards lower resolutions. India had the lowest average display size, at 0.872 megapixels - an average of slightly higher than 1024x768.

The highest resolutions were found in Scandinavia and Central Europe - with Switzerland boasting an average resolution of 1.306 megapixels - about the equivalent of 1280x1024.

Average screen ratio serves as an indicator for the prevalence of widescreen monitors - countries in green have wider resolutions, on average. Denmark, Belgium, the U.S. and Italy have the highest incidence on widescreen resolutions.

Russia, on the other hand, despite a higher average resolution, favours 4:3 and 5:4 resolution screens - and thus are likely to have more vertical resolution available.

This scatter graph illustrates groupings more clearly - Western Europe is concentrated on the right hand side, Asia and South America to the left. Russia is distinct in being the only country to have an average resolution taller than 4:3 - a feat accomplished by the popularity of 1280x1024 (which is in the ratio 5:4).

There would also appear to be weak positive correlation between screen size and ratio - larger screens are more likely to be widescreen (which makes sense, given the increased suitability of larger screens for presenting widescreen content).

Total sample size: 1,110,495, based on data accrued via Google Analytics for modernlifeisrubbish.co.uk. Data from May 2006 through November 2007. Resolution data sample taken from the top 10 most commonly occurring resolutions taken (outliers excluded). Data collected for only the top 25 most commonly occurring countries.

You may download the raw data as an Excel spreadsheet here.

I think you just went of the geek scale :)

I'll join you there though as I found this to be extremely interesting reading.
It is particulary interesting to consider that the region with the lowest average resolution is still a touch over 1024x768.
What was the size of your data pool for working out these stats?

@Pete - you missed the methodology? :) It's data from my own stats (so expect a strong bias towards tech and design - and an elevation in average resolution), running from May 2006 to November 2007 (i.e. now) - 18 months of data, covering about 1.1 million visits.

Ah yes. I realised that you already said that after I posted my comment :)
In my defence I was skim reading while meant to be working on a dull form.

Hi Stuart !
Love your blog ! Been a long time reader too !

Couldn't happen to notice why you've slowed down drastically in the past few months !

Best Regards !

@Jaffer - Been busy and short on ideas for content, so I took a couple of months sabbatical to refresh and to come up with new ideas for posts :)

Ah - finally you are back from your 'sabbatical'.

This was an interesting study and definitely helps in deciding the screen resolution to aim for when designing webpages. :)

Oh, man... I missed these gorgeous charts. Welcome back, Stuart. :)

A Well researched piece, i liked it and also get valuable information about sreen resolutions worldwide. Well done, good job man

Interesting and well analyzed findings, thumbs up. Their usefulness in deciding anything in regards to web design, however, is debatable.

The screen resolution might give a nice upper boundary for how big a browser can grow, but the reality is that the browser window can be - and often is - smaller than all available screen real estate. And the content viewport area, which is really what we should be designing for, is even smaller than the browser window.

See http://www.baekdal.com/reports/actual-browser-sizes/ and http://mentalized.net/journal/2006/10/24/browser_size_does_matter_actual_numbers/ for more information and references.

@Jakob - I'd agree screen resolution isn't a great measure for design - my native screen res is 2560x1600, and I wouldn't dream of running a maximised window. At the lower end - 800x600, 1024x768 etc, it's probably more of a consideration.

Whilst there's no concrete link between actual browser size and screen size, it's likely there'll be some correlation. I just wish we could all produce 100% fluid, 100% scalable designs :-)

I just wish I could design those :P

Damn technology. I'm blaming IE and the lack of decent SVG support.

IE is definitely a pile of 'what you should be sticking in the bin' :-P

Its nice to see an insight of screen resolutions for other visitors of ML. I'm running 1680x1050px and always have all windows maximized...so I can concentrate on the website instead of being distracted by my pretty desktop picture.