Recommended website resolution (width and height)?

Question

Is there any standard on common website resolution?

We are targeting newer monitors, perhaps at least 1280px wide, but the height may varies, and each browser may have different toolbar heights too.

Is there any sort of standard to this?

Answer 1

Although the best width may by 1024 you'll have to adjust height for account for various browser settings (navigation toolbar, bookmark toolbar, status toolbar, etc) and account for taskbar settings. It'll quickly drop the 768 down to around 550.

Answer 2

Flexible or liquid layouts do restict design a little though, for example if you use background images that have to match the body background image.

I would rather make different css layouts for the site and have them apply depending on the user's resolution, or if that's not possible (have not digged into that yet), make it a choosable option.

Answer 3

Bad idea, I believe. The whole point in separating content from layout was to enable your web page to be displayed on any sort of browser.

Putting in artificial limitations such as a minimum screen size will limit your market.

Having said that, I believe every desktop should be able to display 1024x768. But what about the browsers running on iPhones or other screen-challenged devices, or even those that don't use their entire desktop for the browser?

In answer to your specific question, no, I don't believe there is any standard for a minimum or common display area in browsers.

Answer 4

I'd suggest you have a look at media-queries. This is a useful new addition to CSS that really makes so much sense, you'd wonder why this wasn't implemented waaay earlier. Basically it allows you to target browser attributes (such as max and min-widths) directly via CSS and branch your layout code from there. Similar to creating a print stylesheet, you can create your desktop and mobile layouts in parallel in the same file, which kicks ass for development.

Answer 5

I've personally always stuck to max width of 1000px, centered in the middle of the page (via margin left/right: auto).

If you're running at anything less than 1024x768, it's time to upgrade. Seriously. It's almost 2010. You can buy bargain bin lcd monitors with a native res of 1280x1024.