Design Basics

There are two ways to design your website - Table design and Table-less design (using div tags).

 

For a beginner, using tables is the best solution as there isn't much that can go wrong with the use of tables. For advanced users and design professionals designing using CSS styles and div tags is a must for optimal results of load time and to follow W3C standards.

 

For stretch layouts you need to provide the width of the table(s) or div(s) in percentage.

 

To fit the whole screen for any resolution, the outer most table(s) or div(s) are given 100% width. If the design can be made to have just one outer table then it can be given a height of 100% to expand and fill the browser space vertically.

 

To make only the content area to expand do the following. After the outer most table or div is given the width in percentage all inside cells or div tags should be given fixed widths in pixels except the content cell or div.

 

If you like the fixed width concept or are forced to have a fixed width, you can give a contrasting background color and/or a shadow effect/border to the table to make it stand out. These effects can also be used along with the stretch layout concept by giving the table or div width as 90 or 95 percent.

 

Some of the templates don't fit the screen vertically due to design limitations and netscape compatibility issues. Instead of using 100% as the height, here the extra space can be cleverly hidden by using a background color or fill.