Layout

Layout is an extremely important part of the design process. The designer has the power and control to finesse the usability of the web page, and to enable the reader the ability to find what they want easily and quickly. Studies have shown that even if you have the best possible products at the best possible prices, the potential customers would not even stay on your site long enough to figure this out. People just don't buy things from a website they don't like and can't use because they become frustrated. Not many people have the patience to wait even a few extra seconds before making the decision to not visit your site anymore.

These are just a few of the basic types of layouts for a web-site which most of you who are reading this have probably come in contact with in your journeys around the World Wide Web. They can mostly be categorized by looking at how and where the navigation for the site is set up. For many commercial web site's I have come across three basic designs, the top-center navigation bar, the right vertical navigation column, and the left vertical navigation column. More complex layouts actually may incorporate all three of these methods along with fly out menus that respond to where your mouse is. For more creative based web sites, such as for a photographer or an artist, there are no hard and fast rules. It does help however to be cutting edge in this aspect and to be able to impress your visitors and keep them on your site without any difficulty in finding the information they require.


This information would be incomplete if we failed to mention the other most important aspect of two types of layouts - fixed width layouts, and fluid layouts. A rough but accurate definition of these terms are as follows below:

Fixed Width Layout

A fixed layout is a layout in which the size of the enclosing invisible boxes of text and graphics are set to an exact specification. This does NOT take into account the size of the screen the web-page is being viewed with or the zoom value of the web site which the user can set to see the site better.

Liquid Layout

A liquid layout is a layout with no specific dimensions of the invisible boxes that contain the text and/or graphics. This method uses calculations based on percentages that the computer makes based on the size of the screen it's being viewed upon. The text is also specified in an EM value which also is a variable size based on calculations as well. This method is much more complex and time consuming but pays off in the end in aesthetics and usability of your site in any browser and on any screen size, and at most any zoom level.

More to come...