Design Tips - Web Page Layout

October 1, 2007 on 5:02 pm | In Web Design |
by Joseph Scott

Creating a web page layout that keeps consistent across all browsers can be quite a challenge. I was presented with a project this past week that provided me an opportunity to do some experimenting. The results were quite nice. I ended up with a smooth, clean, and consistent layout that appeared identical in Internet Explorer 6 & 7 as well as Firefox!

Some basic steps to follow are:

1. Use table design for your primary layout or main element placement.(This provides a permanent container for all

page elements) Tables were in use from the beginnings of the web and can display in any browser.

2. If using a WYSIWYG editor such as Dreamweaver, be sure to test files live on the server to insure they appear the

same as the local version.

3. Keep your CSS simple. More advanced use of CSS is less friendly to older browsers such as Internet Explorer 6.

4. Always validate your CSS using the W3C tool found @ http://jigsaw.w3.org/css-validator

5. Use a tool to test your page layout on all browsers. I found one @ http://browsershots.org

The main idea is to keep things as simple as possible. With the marriage of old-school table design and the wonders of CSS it is easy to create a professional web site layout that will keep your visitors coming back.