Frames Tutorial part 1

What Are Frames and Why Do I Want To Use Them?

Frames allow you to combine multiple HTML pages and display them in a single browser window. The master page is called a frameset, and each of the component subpages is a frame. Visually, a collection of frames is similar to a table, but frames allow you to do a lot more. For example, each frame may have its own scrollbars. I like to think of a frameset as a window in a house, with each frame being a pane of glass in the window. (In fact, I wish the designers had called the frameset a frame and the subpages panes, but they didn't.)

Frames are most often used when the designer wants to display a menu or index and keep it visible as the visitor selects items from the menu. One of the frames (usually on the left) will contain a list of links, while a larger frame will display a single item from the list. When the visitor clicks on a link, a new page is displayed in a frame, while the menu (and any other frames that may exist in the frameset) remains unchanged.

This is much easier to show than it is to explain. Look at example1 to see what I mean.

Note: all examples will appear in new browser windows so you can read the notes and see the examples at the same time.

As the example shows, each frame may be scrolled without affecting the other frames. This is a big advantage over using a table.

Remember that a frameset is mainly used as a navigational tool. I have a lot of pictures on my site, and I put small thumbnails of each picture in my menu frame. When a visitor clicks on a thumbnail, a larger version of the same picture is displayed in the other frame along with a caption. The visitor may click on another thumbnail without having to go back to a previous page.

Why Shouldn't I Use Frames?

You should never use an HTML feature just because you think it is neat and everyone else seems to be using it on their site. If you have a small number of web pages, don't confuse your visitors by displaying your pages in frames. If you just want to divide your page into sections, use a table. In fact, WebTV converts all frames into tables.

Frames take up a lot of space.

In addition to borders and scrollbars, your menu frame is taking up space, so less of your main frame may be seen at one time. One way to minimize this problem is to put the menu along the bottom of the main frame like this instead of to the left. You may have your screen resolution set to 1024x768, but your visitor may be using 640x480 and therefore will see less of your frameset than you do.

Frames are hard to bookmark and print.

You may bookmark (or create a link to) a frameset just like any other HTML page. When you follow the link, the frameset will open the same initial subpages every time; there is no way to tell it to load a specific frame. If you link to a subpage, that is all you will see. There will be no frameset, and thus no menu.

Likewise, browsers cannot print an entire frameset. They treat each frame as a separate page, which means you may print only one frame at a time (click within the frame first to select it). If you are using a frameset to create a menu (like in these examples), that may not be a problem, but there may be times when your visitor would like to print everything at once.

Internet Explorer 5.0 has enhanced printing capabilities. You may print an individual frame just like with other browsers, or you may print all the frames in the frameset as individual pages. The feature I like is the ability to print an entire frameset at once. You will get a single printed page, regardless of the size of the frames (meaning the pages will be incomplete), which shows how the frameset looks. It's rather like a screen dump.

Some people hate frames.

What more can I say? Some people simply dislike frames. You may decide to provide all the pages at your site in both framed and non-framed versions, which can be quite a bit of extra work. You also need to make sure you create your frames properly. It is very annoying to discover that you are in a frameset inside of a frameset because someone was careless when they wrote their HTML.
    On to Frameset Code >  
1