Shargad’s Webpage Workshop

Site Map

Your Current Location is in Yellow

Home

I’ve Been Framed

I’ve Been Framed

Frames are similar to tables, but instead of cells which line up in rows and columns, frames allow you to have independent windows on your screen, with each window holding its own web page. Frames are useful, no doubt about it. And they can be used to create some great visual effects. And like all good things they can be — and are — abused. If there is no logical or compelling reason to use frames on your site, don’t.

This is not a frames tutorial, although I will hit a few technical points. If you want to know how to construct frames, see Joe Barta’s very complete frames tutorial.

Now, let’s look at some of the uses of frames. One very common use of frames is the menu bar. This allows a strip somewhere on the screen to remain a constant navigation bar. You can see one at The Foo Page. Not only does the frame provide a navigation bar, it also contains the background music link, so the music plays as you cruise around the site. Please note that the bar also includes the option to turn off the music. This can be done by clicking on the little button in the menu area, or by clicking in the “marble” on either side of the menu. This clickable area is made by using a single pixel transparent gif expanded with HTML width and height attributes to make an invisible clickable area. When a visitor clicks in that area, an identical bar loads in the frame minus the music. This has probably been done elsewhere, but I designed this little trick myself. If you have read my comments on background music, you will not be surprised to learn I don’t use this trick on my websites—but it’s still a useful trick.

A similar use is the slide show. A side bar contains the photo links, and clicking on the photo name brings up a large photograph in the main frame.

Another variation is the Title frame. This allows a graphic title to remain in place as the visitor navigates the site, thus giving the site a consistent look, but not requiring the same graphic to load each time — even though it would likely be loading from the cache, it would still needlessly increase the load time.

Some sites employ frames to allow several sets of news and navigation to appear independently on the screen so that the visitor can poke around, compare, see examples of wares without leaving the main page, etc.

Another interesting use of frames can be found on Derek Powazek’s story site. By using various frames attributes, he creates an unusual “theater” for his story.

I have used frames to create many different effects, all as experiments — but as I said at the top of this page, if there is no logical or compelling reason to use frames, don’t. And I didn’t.

If you are having problems with your frames, be sure you study a good tutorial. This will not only help you find the solution to your problem, but it will also help you learn the craft. If, however, you find yourself stuck, and the tutorial is not answering the question, please post your question on the forum, along with the URL of the problem page. The most common problems people encounter involve targeting. The pages load into the wrong frame or they forget to allow visitors to break out of the frames when following an external link. I have also encountered a problem of the wrong URL being called when a link is clicked, and this has been tracked to “helpful” EZ editors adding the BASE tag in the head of the document. Unless you know how the BASE tag works, remove it from your document if it mysteriously appears.

Targeting links

In the frames set up, always name your frames. Give them any name you like, but name them. The name is an attribute contained in the FRAME tag, not the FRAMESET tag. Looks like this:

<frame src="foo.html" name="big">

Target your links. If you have a menu bar, target each link:

<A HREF="foo2.html" target="big">Foo Two</A>

or use the BASE tag I just scolded about. In the HEAD of the menu page source document:

<BASE target="big">

That will target all your links on that page to the “big” frame.

Breaking out of Frames — be considerate of your visitors.

Any link to an external source should allow your visitors to break out of your frames unless the link is something you want loaded into the frame for a specific reason. To leave frames, add the target="_top" to your link:

<A HREF="http://www.foo.com" target="_top">Foo International</A>

A final caution about frames: be careful in setting the size and other attributes. If you set a frame for noresize and scrolling=no, be sure the frame is large enough to display the content in all resolutions. In setting the width of your frames, avoid giving all columns a set width. One column should have a “fill the rest of the screen” width, designated by the asterisk. Make sure the content of the frame is not too wide. People typically don't mind scrolling up and down — they expect that; but most people are not pleased with having to scroll left to right to see the content, especially if the content is a fat picture that cannot be viewed in its entirety. Harking back to the philosophy of frame design contained in the first paragraph: Design your frames intelligently. And if frames don't enhance your site, don't use them.

Copyright © 1999 Carlton Higginbotham, Meade Street Productions.
No part of this site, including graphics and text, may be reproduced without written permission. Please post questions and comments on the Forum

Last updated GMT