Commonly used pixel sizes for webpages and their pros/cons

Question

What are the most commonly used pixel sizes (primarily widths) and what are there advantages and disadvantages?

How can I best find a happy medium to give a good experience to people with a wide variety of monitor sizes?

An answer with an explanation rather than just the size would be greatly appreciated.

Solution 1

the most grids use a width of 960px. (When the design has a fixed width). When you take a look at global statistics 1024 range resolutions are still the most common: http://gs.statcounter.com/#resolution-ww-monthly-201006-201106

Do not use 1000 width. (You have to count in the border width of the browser and the scrollbar, in certain browsers / OS they are larger then in others)

I don't think there is a ultimate resolution that's why you should check the statistics on the concerned webpage (if the page already exists), to decide what resolution is most appropriate. If you can't do this you can check stats for you target market on http://gs.statcounter.com/

Or even better use responsive webdesign: http://www.alistapart.com/articles/responsive-web-design/

Since max- and min-width attributes in CSS, you can target whatever resolution you want, if you have the time / budget for it of course.

Solution 2

960px width is a good standard, as others have already elaborated on.

However, one should keep in mind that websites are viewed on a lot more than just desktops these days, so the answer could vary based on what the site is being styled for. For example, 960px would be a poor width for a mobile stylesheet.

One resource that could help you is www.resizemybrowser.com. (There is a similar tool built into Firebug.)

At the end of the day, I think 960px is a good standard, but really, "it depends". :)

Solution 3

960 is a standard for fixed-width websites. It is to ensure that 1024x768 resolution will pick it up easily. As for height - it does not really matter.

Solution 4

The most common size is between 900-1000 pixels there are some good sources for screen size useage which most people tend to desgin for the largest group. mostly its assumed anyone with a 800 by 600 screen wont want to be doing much business. ie strapped for cash (big generalisation)

Solution 5

Out of experience, for the web i would say a width greater than 850 and less than 1000 px preferably in the 900's and a height of around 750 px, but bear in mind that the height would be variable in case of dynamic content. so the height could be set to 100% or auto. and best to align the website in the center, via the css property margin: 0 auto;

View more solutions

Comments

[Nic]

+++++++++++responsive web design. That should be the first consideration (if possible).