What is a 'safe' screen resolution to design for in web design?

I’m no web designer, but I can’t believe people are still using 1024×768. Ive been on a 1680×1050 for the last few years, and it pisses me off that almost every webpage is formatted for screens almost half the size.

1024×768 still accounts for a lot of users (about 40%)

800×600 is about 15%

The rest are set higher than 1024×768

If you willing to alienate 55% of your potential viewers, than design for greater than 1024×768.

1024×768 isn’t safe, since it won’t give space for toolbars and scrollbars. i usually work with 960 width and dynamic height or 500px if it’s static.

It depends on the content. For me, my visitors are pretty tech savvy, and I expect most of them to use services like Twitter, Gmail or other web apps. 800×600 isn’t even on the list.

35,000 visitors last month:

1280×800 – 23.58%
1024×768 – 16.73%
1440×900 – 14.98%
1280×1024 – 13.94%
1680×1050 – 11.33%
1920×1200 – 5.51%
1600×1200 – 2.28%
320×396 – 2.13%
1152×864 – 1.77%
1280×768 – 1.12%

More stats. Please share yours, too.

Browsers and OS
Firefox / Windows – 46.32%
Firefox / Macintosh – 16.12%
Internet Explorer / Windows – 13.53%
Safari / Macintosh – 11.39%
Firefox / Linux – 3.52%
Chrome / Windows – 3.32%
Safari / iPhone – 1.42%
Opera / Windows – 1.13%
Firefox / FreeBSD – 0.61%
Mozilla Compatible Agent / iPhone – 0.44%

OS
Windows – 64.86%
Macintosh – 28.16%
Linux – 3.89%
iPhone – 1.86%
FreeBSD – 0.61%
iPod – 0.26%
(not set) – 0.16%
Android – 0.06%
Danger Hiptop – 0.02%
SymbianOS – 0.02%

I hope the 320×396 was a blackberry or similar.

I would suggest learning a little css or php. It sounds to me like your doing only html.

@popo: What?

Any fixed-width designs I create are to fit in 1024px width (I go for about 950 to take the ‘safe area’ into account). I can’t remember the last time I made a fixed height design..

For a guide on the actual ‘safe area’ of different browsers & OS, check this out: http://www.designerstoolbox.com/designresources/ (a gem of a resource)

I still design for 800×600 but that’s only cause there are still projectors that have it as a maximum resolution, and it has a bit of market share. Designing for 1024×768 is a safe bet nowadays but you might lose a few users who still use 800. I usually use a width of 750 pixels.

It is far too early to not design for 1024 monitors. Also note that as people get older, they won’t be able to use a high screen resolution because things will be too small for them, so we will see a larger number of lower resolution monitors (I’d say 1024) being used. I don’t think websites will ever be designed mainstream for monitors bigger than 1920 or even 1280, you get into issues such as line length being too long to read easily on a maximized window, etc.

Personally, I’m using a 1920 monitor and I never have my browser window maximized. So there’s one data point regarding bigger screens.

I’d also have to vote for 1024×768 being the minimum.

buuuutttt….i’d say it depends on who your target audience will be. If it’s a “print paint by number pages for your grandkids” website, then I’d drop it to 800×600
but if it’s a “cintiq tutorial site” then 1600×1200

yay…INTERNET!!!

My mother doesn’t want a resolution higher than 1024×768 because things would get too small.

Of course, you could also do a fluid width (up to a certain size) to appease widescreen users ;-)

Also see W3Counter, and of course be sure to take your target audience and some margin into account, but those have been mentioned before.

System statistics at Cardsinner are:

1024×768 – 34.1%
1280×800 – 19.16%
1280×1024 – 8.28%
1440×900 – 8%
800×600 – 4.98%
other -25.48%

I shoot for 1024×768 and plan on much vertical real estate being eaten by Windows & IE task bars.

Transferr (a site I’m working on with a friend) gets:

1920×1200: 55.87%
1440×900: 10.03%
1280×800: 9.46%
1280×960: 8.88%
1024×768: 7.45%
1280×1024 : 5.16%
1680×1050: 2.01%
800×600: 0.57%
1152×864: 0.29%
1280×720: 0.29%

…and what the hell was Popo7676 on about?

@bluemukaki: I think that by using the CSS-PHPs, we can deliver better HTML-monitors to people that are bigger are therefore avoid all of these problems in the first place. Why we didn’t think of this earlier, I’m not sure. CGI?

Thanks everyone for their input.
It seems 1024×768 (-toolbars etc) is a pretty safe bet.

The website I am currently designing is for an architect and is very image heavy, so i thought of using the ‘static menu bar top and bottom’ and have the content on a horizontal timeline in the center. but images being just 300px ish is just way too small.

I guess I ll have to look for a different solution to this.

@richardhenry: sorry i misread the question. I was thinking of something else. For some reason i read screen resolution and thought of something else. wow i feel like a noob right now.

Now I’m wondering what you were thinking of ;-)

Seriously i don’t even remember, but at the time what i said made sense to me.

960 ftw! hands down

I second rainsmoker, 960 rocks, especially when you use Nathan Smith’s 960 Grid System setup.

right on @designfire!

As a web developer, we always assume 1024×768 unless specifically asked otherwise by a client. However, you should always make it expand for larger resolutions, otherwise you’re wasting all of the wonderful screen real-estate.

@designfire / @rainsmoker I agree, 960 makes life easy :)