Free Webmaster Help Logo
Tutorials Articles Tools Images Directory Ask Newsletter

Advanced HTML
Frames & Tables
Rounded Table Corners
Flash 5
Site Promotion
Mobile Internet: WML/WAP
Server Side Includes (SSI)
HTML - The Basics


Related Links
Frames - An Introduction
Frames Page Generator
More Frames & Tables Sites

Sitemap | Contact | Link To Us | Advertise
Report A Problem

Frames & Tables Tutorial
Part 1 - Introduction

Why Do I Need Them?

Frames and tables are extremely important in web design. It is impossible to create a navigation bar on a website without using frames or tables in one form or another.

An example of this is that this page is completely enclosed in a giant invisible table. It has a column down the side to put the navigation in and a giant cell for all the page text. I could also have got the same effect using frames.

What Is The Difference?

There is one major difference between frames and tables.

Frames divide up your browser window into separate areas. In each of these a page is loaded. Links in different pages can be made to change the pages in other frames and frames can stay the same when another page changes. This means that you can have one page which has the navigation bar for a whole site on it and it never changes.

Tables divide up a web page into separate cells (like in a spreadsheet). This means that you have a lot more control over where text and pictures can be placed. By using the method I described earlier (having a column for a navigation bar and a cell for the page text) you can create complex page structures. A page looking the same could be created with frames and tables.

Frames: Good and Bad

The best feature of using frames is, of course, the ability to update every page on your site using one file. For example: if I used frames on Free Webmaster Help I could add another link to the navigation bar on one page. When the frames loaded on the web you would see this change, whatever page you are on.

Frames also make very consistent pages. As you are only changing the text for each page of the site, the actual look of the page will not change much in the user's browser.

When used properly frames can make a very good design feature and, once each frame has loaded, the loading times of a site are a lot less (as, usually, only one frame is ever changed throughout the whole site).

Frames do have their bad points, though. One of the major ones is that, even though frames have been around for a long time, they are still not fully supported. Some people who are still using older browsers cannot view frames sites. Even worse, some search engines will not index pages using frames! This could mean a great loss of traffic for your website

Another problem with frames is that if someone arrives at an internal page on your site the frames will not appear. This could mean that someone might read a page and not actually know they are on your site.

The final problem is that it is very difficult to bookmark an internal page in your site and if someone bookmarks a page on your site (using most browsers) and return later, they will see your first page, not the one they bookmarked.

Tables: Good and Bad

Like frames tables also have good and bad points. Their best feature is that they fix all the problems with frames. As all the parts are on each page, if you load an internal page of the site everything will appear and it is possible to bookmark these pages.

All search engines support tables so you do not need to worry about them not indexing your site. Although, some browsers do not support tables, nearly all the browsers in use do so you should not have any problems with compatibility.

Like frames, tables also have some bad points. The main one of these is that, all the parts making the page are stored on each page (not on separate ones like in frames), updating something on the whole site is more difficult. For example: adding a new link to my navigation bar in frames would mean changing one page. Doing it in tables would mean changing every page on the site. This can be overcome by using a search and replace program, though.

Keeping a consistent design is also more difficult using tables because, as I explained earlier, everything is on each page. This means that each item on yo
ur page which is supposed to remain consistent must be placed in exactly the same place on each page.

The final problem with tables is that, because everything is on every page, the individual pages take longer to load. This is not much of a problem if you are keeping quite consistent with images, but it you are not it can increase loading times greatly. Also, the whole table must load before it is displayed on the screen so users will be left with a blank screen while the page is loading (instead of seeing the text appear as it is downloaded).

Which Is Better?

I cannot really say which is better! I personally use tables, a template and a search and replace program to make Free Webmaster Help but it is really a matter of what features are most important to you.

How Do I Use Them?

Simple! Read on. In this tutorial you can learn how to create tables and frames using a WYSIWYG program or in HTML code.

© 1999 - 2019