What screen resolution?

[charter]

I am going into web design and am wondering if someone can please help sort some confusion for me.

With most computer sales now coming with 19", 20" or 22" widescreen monitors, I am left wondering what screen resolution I should be designing for.

I know some people with very old monitors still use a resolution of 800 x 600.
I also know that the average for quite a while has been for 1024 x 768.

These new widescreen monitors (of which I have a 20.1" Viewsonic) has a normal resolution of 1680 x 1050.

Which resolution should I be designing to?

All help much appreciated

[oracleguy]

You should if all possible making a fluid layout. So that it will expand to use as much room as it has.

However as a minimum resolution it should work for, that would be 800x600. Also keep in mind that a lot of people with those large monitors don't always have their browser window maximized. So even if you have like 1680x1050, the browser might only be at 1024x1050 or something.

[felgall]

People viewing the web on their mobile phone don't have screens anywhere near that big.

People using web readers to listen to your site may not even have a screen.

People with huge computer monitors usually have two or more windows open side by side and so the browser only gets a fraction of the width.

Pages wider than 750 pixels will overflow the side of the paper when printed on some printers.

[Zurvan]

Over 70% of web browsers are using 1024 x 768. Almost nobody is using 800x600. Designing for that is like designing for IE5.5.

If you're concerned about mobile users & printing, you should be using separate stylesheets for those devices, and not compromising your main design.

Make your site work for 1024x768. That will keep nearly all your users happy. Worry about the outliers after.

[oracleguy]

Over 70% of web browsers are using 1024 x 768. Almost nobody is using 800x600. Designing for that is like designing for IE5.5.

73.4% of all statistics are made up on the spot.

There is a difference between the user's desktop resolution and the actual size of the browser window. People don't always keep the browser window maximized especially now days with widescreen monitors and all the other crap people can have open.

[Zurvan]

73.4% of all statistics are made up on the spot.

There is a difference between the user's desktop resolution and the actual size of the browser window. People don't always keep the browser window maximized especially now days with widescreen monitors and all the other crap people can have open.

That stat was from a survey of several major websites usage stats, I'm not making stuff up.

Most of your users are going to be just fine with a design based on 1024x768. You can't please everybody all the time. If you design a fixed-width site for 800x600, or smaller, you're going to annoy most of your users who have a bigger viewport than that.

[oracleguy]

That stat was from a survey of several major websites usage stats, I'm not making stuff up.

Sorry, I should of threw some smiles in there. I was just making a joke. But out of curiosity, do you have a link to the survey still?

[VIPStephan]

I agree with most of the stuff oracleguy said except in part the fluid layout statement. Fluid is generally the best to design as it is the most flexible solution. However, you shouldn’t let it resize to eternity if you increase your browser window width. Text is becoming very hard to read if it’s too wide (i.e. if the lines become too long) so if you make it fluid put some max width in to make it stop resizing at a certain point.

And I, too, would suggest to still use 800x600 as minimum resolution. There are more people using this resolution than using IE 5 so we shouldn’t neglect that (and as stated: browser window size ≠ screen resolution). And those for whom this resolution is too small they can still resize the text/site if it’s coded properly (i.e. sizes with percent or em units).

[croatiankid]

Hybrid and hybrid/fluid techniques are probably the best ways to present your page across a huge span of resolutions.

[felgall]

Definitely a hybrid or fluid layout is best.

If you are going to go with a fixed width then 750px is probably the best choice because it save you having to completely redesign the page for printing.

[harbingerOTV]

Agree with both steph(a/e)ns. But to add again, you should have a print style sheet. that will make the fixed width styled page unimportant when a user prints. They are easy to make and easy to make work.

[felgall]

Web pages should have at least a general stylesheet and a media=print stylesheet to start with. Other stylesheets for other media can be added later when you decide to try to better cater to visitors using those media.