The following post is now outdated and will be closed to future comments. Why? There is a better way. Today we simply have far too many devices and dimensions to deal with. Optimizing a site for the most common width is no longer a valid way to build websites. A new technique call Responsive Web Design (RWD) or Adaptable Websites is on the rise. If you haven’t heard of it, look into it, it’s the future of web design.
See Responsive Web Design for more details.
With so many different resolutions (800×600, 1024×768, etc.), browsers (Internet Explorer, Firefox, etc.), and platforms (Windows, Mac, Mobile ,etc.) in use, it is very difficult to design a page that looks good (or at least looks the same) in all configurations.
To design a page that looks good with most configurations, let’s start by defining our main objective: we must never force a user to scroll horizontally. In other words, our page must always fit within the available screen width. This would suggest that we have to design our page for the lowest common denominator.
So let’s look at the stats
Get the latest in stat at http://www.w3counter.com/globalstats.php
Ready for our next decision
Should we design a fixed-width page, or should we specify the width of our page in percentage terms?
There are pros and cons for both. The main advantage of a fixed-width page is that the layout will always remain as you intended, even when viewed at higher resolutions. The main disadvantage is that users with larger screens, set at higher resolutions, will not be able to fully utilize them, and will instead see large, unused blocks of space around your page.
The advantage of establishing our page width in percentage terms, as 100%, is that the page will adjust itself to the resolution of the screen. This is called a “liquid page design”. The main benefit of this method is that all the available screen real estate will be utilized. The disadvantage is that the layout of your page will change, and users may find it uncomfortable to read the extremely wide sentences that will result when higher resolutions are used.
If you decide optimize your page for 1024×768, and then decide to follow the fixed-width page method, you must take into account that not all the 1024 pixels will be available (some of them will be used by the browser to display the scrollbar and other “browser chrome”). To accommodate most browsers and platforms, specify your page width at a maximum of 960 pixels.
If you decide to specify your page at 100% width, you won’t have that problem, since it will adjust automatically to the available width. Just make sure that your page looks best at 1024×768, and that the layout doesn’t change much when you view your page at 1280×1024.