Is there any reliable current information on the percentages of screen resolutions and font sizes used online?

July 19, 2004 3:14 PM

Years ago, Webmonkey posted an article talking about screen real estate / font size across different browsers/platforms. It also discussed the percentages of people using each resolution. Does anyone know of a more up-to-date reference for this information? If not, what resolutions do you design for? In addition, I've got a few color palette selecting helper apps bookmarked from mefi over the years, but I'm sure I missed a few. Which do you recommend?
posted by dobbs to Computers & Internet (12 answers total)

In gaging that, I often rely on companies who can afford primary research... and my reading of that data is that 800x600 is the size to design to.

But that's just my reading.
posted by silusGROK at 3:53 PM on July 19, 2004

It also discussed the percentages of people using each resolution.

No it didn't. Or at least it doesn't. It links to thecounter.com, which has recent stats. Skewed towards novice Windows users, I fear, but close enough. Other sources for browser statistics here and here. They all agree that a small majority of users have 1024x768 or better, most of the rest at 800x600.

IMO, you should aim for something that looks reasonable everywhere from 640x480 up to at least 1024x768. Not everyone devotes a full screen to the browser.
posted by sfenders at 4:12 PM on July 19, 2004

Response by poster: No it didn't.

Oops. My mistake. They've "updated" it in May 2002 (I think it was written in 1999) and it looks to be half as long as I remember and missing that info.
posted by dobbs at 4:34 PM on July 19, 2004

I haven't designed for 640x480 for a few years now. For most sites, I optimize for 800x600, with the realization that it also has to look good on larger sizes. It depends on the audience though. K10K for instance optimizes for 1024x768 (though I think they may have recently recanted to support iBooks).

One note. This was also from Webmonkey a few years ago. 800x600 only amounts to 717x390 of designable "above the fold" space when you take GCF browser chrome into account. I haven't checked those dimensions in a few years, but it's probably nearer to 760px wide if you ditch the 3.0 and 4.0 browsers.
posted by Jeff Howard at 4:38 PM on July 19, 2004

There was recently an Ask Slashdot on this very topic. The conclusion of the discussion (to the extent that such a thing is possible on Slashdot) was please, for the love of god, don't design for a specific resolution, but make your creations thoroughly flexible.
posted by waldo at 5:04 PM on July 19, 2004

I recently saw Red Sherrif data for two large general interest sites (a telco and an ISP). 800x600 accounted for about 40%, 1024x768 another 40%. Based on that, we opted to stay nice to 800x600 folks.

A lot of older people like low res because it's really easy for them to read.

Remember that while the typical system sold now probably has a 17" monitor and defaults to 1024, there is a bigger and markedly inferior installed base out there.

And yeah, if you design for flexible layout from the outset you won't have to worry about who to piss off.
posted by i_am_joe's_spleen at 5:12 PM on July 19, 2004

752px is the viewable width of IE5+ at 800x600, the fold hits at 390px
posted by Mick at 5:25 PM on July 19, 2004

"The fold" also depends if they have toolbars installed--Google, Yahoo--there's a ton now. Or if they use the links bar, etc. Obviously same issues with other browsers.
posted by gramcracker at 5:31 PM on July 19, 2004

Like everything else, it depends on your audience. Flexible layouts can be nice, but if someone has a resolution of, say, 1280x1024 and browses in a window at 1024x768, text will be way to wide. There are tricks to build liquid layouts that don't expand forever, but I can't find the link right now. 800x600 is safe. Boring, but safe. According to this, the most common width chosen for a layout is between 751 and 800 pixels while the most common lenght per page is between 801 and 900. So for a large audience stick with 800 for a max width and you'll probably do fine.
posted by Grod at 7:33 PM on July 19, 2004

I usually design to look good at 800 x 600 and 1024 x 768.

You could spec the width in ems using the techniques by Max Design and The Man in Blue and set max-width in Internet Explorer.

Web Page Design for Designers has a nice browser grid that "shows the 'safe areas' for different screen sizes. This takes into account the 'dead' areas populated by menu and button bars at the top and bottom of the screen and by scroll bars at the sides." The Web Style Guide has a related article.
posted by kirkaracha at 8:54 PM on July 19, 2004

Re-Invigorate gathers stats on a daily basis from the millions of hits that sites which have registered with the service receive, supplying us with fairly decent averages for browsers, resolutions and other useful web statistics.
posted by nautone at 11:21 PM on July 19, 2004

I teach computer classes to senior citizens and I have to say that I'm immensely grateful when someone designs a site that doesn't completely break when the text is jacked up to whatever the largest size is. It doesn't have to look lovely, but it's nice if it's not all overlapping. When I designed our library web site, I aimed for 800x600 users, witha flexible design that scaled pretty well. Since the majority of our web site hits are from people looking at the site in the library, and I know they're using 800x600 resolution Windows machines, this was a no-brainer. Ultimately, you should think about who your audience is and aim towards them while trying not to disinclude anyone who uses drastically higher or lower resolutions, font sizes, or different colors.
posted by jessamyn at 5:35 AM on July 20, 2004