Despite a top-menu, another obvious place for a navigation menu is at the upper side of the page.
You might consider adding either a single or two menus at the sides of the top of the page.
If you choose to have only one menu, the content of the page will require horizontal scrolling if it's read on a 640x480 screen.
This is almost impossible to do - and certainly difficult enough, to force these visitors to go to other sites.
You might argue here, that you really don't care if this minority of your visitors can't read the content without scrolling. Fair enough. But there is another side-effect you should consider:
Readability.
It is hard to read text that spans over an entire page. When moving the eyes from the end of one line to the beginning of the next line, the reader easily looses track of the line.
Usually this problem is solved by writing text in columns.
A good point is here, that if you're going to write the text in columns anyway, why not keep it in a single column that can span all the way down the page?
As we shall see now, reserving the center 470 pixels for the main content, allows us to create a very sophisticated design with a primary menu to the left and a secondary menu to the right.
Unlike the case with fixed design for 640x480 screens, when designing for 800x600 one specific horizontal division is way more obvious than any other ones.
Consider this example showing a layout with two 150 pixel menus and a 470 pixel main content column:
800x600 Screen
|
|
1024x768 Screen
|
The layout works fine on both resolutions. The amount of unused space when viewed on a 1024x768-screen is not as drastic as in the case with a fixed 640x480 design.
However, the most interesting aspect of this design is how it appears when it's viewed at the low 640x480 resolution.
First off, no matter where the horizontal scrollbar is placed, the entire main content column is visible.
640x480 Left Side
|
|
640x480 Right Side
|
The reason can easily be calculated.
Let's say the scrollbar is dragged all the way to the left.
In this case you will see the left 620 pixels of our page.
The summarized width of our menu (150 pixels) and the main content column (470 pixels) is exactly 620!
This means that when you move the scrollbar either all the way to the left or all the way to the right, the screen cuts the page exactly where the main content column starts/ends.
The important aspect of this is that the design actually maintain complete readability even on 640x480 screens while at the same time, allows you to have a secondary menu at the right side of your page.
Furthermore the main content column is wide enough to allow even full banners.
Finally the menus are big enough to allow all other
standard graphics except the full (468x60) and half size (234x60) bannerstandards.
If you place all primary navigation-links in the left menu and use the right menu for secondary links and graphics, the design will work perfect on all screens.
Top
of page