What Screen Resolution? 1

Screen resolutions are changing

Screen resolutions are changing all the time. Photo copyright by ktylerconk and used under creative commons license.

When designing a web site one of the big decisions to make is what screen resolution you want to optimise for.

I guess the flippant answer is all of them or make a liquid design than will shrink and expand according to the resolution of the user browsing.

However, that is often easier said than done and often if you have a lot of data to present, need adverts in certain place or some other need for exact positioning then a fully liquid design not an option.

If you are going for a static design you will have to decide what resolution to design for. Its here that if you have an existing site you can use your analytics program or server logs to get some useful data.

I have some numbers here from Monsters and Critics showing the top ten resolutions used each year, this is sampled from millions of unique users via Google Analytics. Red shows resolutions that whose use on the site is falling from 2011-2012 and green those on the rise.

 Notes

 Resolution

 2011

 2012

 Change
 1366×768  11.35%  16.19%  +4.84
 1280×800  15.89%  13.09%  -2.8
   1024×768  14.70%  11.03%  -3.67
 1440×900  7.44%   6.49%  -0.95
 1280×1024  8.64%  6.45%  -2.19
 iphones and ipod  320×480  4.18%  6.25%  +2.07
 1920×1080   3.79%  5.60%  +1.81
 Mostly ipads  768×1024  2.19%  4.07%  +1.88
 1680×1050  4.86%  3.93%  -0.93
 1600×900  2.84%   3.83%  +0.99

So you can see the standard 1024, which was the most popular by some way for a long time, is no longer the most popular and is in decline as monitors get bigger. However, you can see the smart phone and tablets are pushing up the lower resolutions as well. Though it is always an option to serve up a mobile and even touch version of your site to these users.

My reason for looking into this tonight was a dilemma on a new picture site I have been working on. I decided a second column to the right was needed to show the most popular images and maybe an Google Adsense tower ad. But that means I have to either increase the width of the overall page or shrink the maximim width of the images in the left column.

Given these figures I think I will probably increase the width of the site beyond 1024. For one the right column is sort of bonus material on this site and secondly the users tend to have even larger screens.

There are a few tools on the web you can use to check your site or blog. The likes of Google’s browser tool (soon to go) or if you use Google Analytics you can now use In-page Analytics and get a really good idea of what people can see and what percentage for your site. There are a few others you can try and a search will pull up a bunch, many browsers have extensions that can help with this too.

Anyway, I thought it is something you face quite a lot when designing sites and its an every changing, albeit slowly, factor.

  • jwray1420

    Just by way of contrast in 2006 47.67% were using 1024×768 and 10% 800×600.