As it was discussed in the article about screen resolution, the visual height of the page varies both with screen resolution and customized browser toolbars.
This brought us to the conclusion that:
The navigational structure of the page should be kept at the upper 300 pixels of the page.
(Actually the upper 294 pixels to be very precise.)
In the samples below, this area is shown in a dark gray color.
This is our first logical division of the page: Into the upper 300 pixels and the rest!
Many webdesigners suggest that the entire page should be viewable even on 640x480 screens. (And if the webdesigners didn't, their customers certainly would make them!).
Therefore, we will start to look at how a fixed design limited to 640 pixels looks on different screens.
First we need to understand:
If a page needs a scrollbar there aren't 640 pixels available!
The scrollbar itself will take up 20 pixels, leaving only 620 pixels for the page.
Look at these examples:
As you can see, a fixed design at 620 pixels width works okay on 800x600 screens, but on 1024x768 screens the empty space simply takes up some 40% of the screen.
In most cases this will seem uncomfortable to the visitor arriving with this resolution.
A workaround may be to center the content part of the webpage, leaving blank space to the left and to the right.
Look at this example:
Centering the content definitely makes the wasted space less obvious. (However, it still does not remove the fact that close to 40% of the screen is left unused for visitors arriving at 1024x768 pixels).
Therefore, if you decide to design for 620 pixels width you should center the content.