Ahhh, frames! They answered one of the Web writer's greatest frustrations—keeping the title (and menu) on the screen.

Argh, frames! They reduced the size of the message area so much that it became hard to read the message and made using graphics almost impossible.

What is good design and what should be avoided? Here are some thoughts.

Return to Newsletter

What Frames Are

Frames provide a mechanism for displaying multiple pages on the screen at one time. The end result looks like a single page, but each of the framed areas works independently.

A frames page consists of a separate file for the frameset (the container for the frames) and at least one file for each frame that is displayed. All frames (and their files) are subordinate to the frameset.

Why Use Frames?

Most writers use frames to counteract the effects of scrolling. As the reader scrolls text, information disappears off the top of the screen making it hard to maintain the context of the information being presented.

Keeping the Title On the Screen
A horizontal frame at the top of the screen lets you keep the title in front of the reader and still leaves most of the screen available for your message. When you place your title in an upper frame, it's probably best to place your menu there, too.

TIP: If the information in a frame is greater than the area in which it can be displayed, the browser, by default, will add scroll bars to the frame. Never, never, never scroll the title frame intentionally. If you don't know your audience's screen resolution, be sure the frame is large enough to display both the title (and menu if used) on a 640 x 480 screen.

Keeping the Menu on the Screen
If you don't include the menu with the title, a vertical frame at the side of the screen keeps the menu in front of the reader.

On the downside, a side frame reduces the width of the screen available for your message. It also gives you less space in which to display graphics.

When you place your menu in a side frame, it's probably best to place an abbreviated title there, too, and let the top title (if used) scroll away as your reader views the message.

If you use both top and side frames, the message area will be severely reduced.

Displaying Increasing Levels of Detail
Frames can be used to display increasing levels of detail by:

• placing thumbnail graphics or brief text items in a side or top frame and providing more detailed (or longer) versions in an adjoining frame
• placing a stationary graphic with clickable areas in one frame and providing descriptions of the clicked areas in an adjoining frame.

Other Uses for Frames
Frames can also be used to display:

• sidebar information
• copyright or other information that should always be visible.

Mixing Frames and Non-Frames

Just because your document's home page is designed with frames doesn't mean that all of its pages have to be.

Linking from a framed to a non-framed page can be effective if you:

• have a segment with a lot of text that you don't want to scroll
• want to display a large graphic.

To avoid reader confusion, always give non-framed pages a purpose in your design, for example:

• detail views
• reference information
• commentary.

I often treat a non-framed page as a detailed view of the framed information, using the words "click to dismiss" to send the reader back to the original frameset.

Other Frames Considerations

Frames and Browsers
Some browsers don't support frames. Others let readers turn frames off. If you don't provide a non-frames version, nothing may display when the reader accesses your site.

Frames and Bookmarks
Bookmarks set by readers can't capture the state (content) of the frames the reader sees. Readers can only bookmark the initial state of the frameset.

Frames and Links
Links from other documents can't display internal pages in a frameset. You can only link to the frameset's initial state.

Frames and Printing
When a frameset is displayed, the reader's browser may not print anything or it may print whichever frame is in focus when the print command is invoked. It may also print only the visible part of scrolling frames.

Microsoft Internet Explorer provides these options for printing frames:

• As laid out on screen
• Only the selected frame
• All frames individually.

But, I find that I still have difficulty printing many framed documents.

Frames and Search Engines
Search engines have difficulty cataloging framed Web sites and may send readers to individual components of the frameset rather than displaying the frames properly.

More information about:

Designing with Tables

Good Frames Design

Before you use frames ask yourself, "Do I really need them? Is there another, easier way to accomplish my goal?" Many times, a table can solve a display problem as well as a frameset.

If you decide that frames are the answer, integrate the frames into your design so that the frameset isn't the first thing your reader sees. In the best designs the reader isn't even aware that frames are being used. The only clue to their presence in the fact that their content stays put.

"In the best designs, the reader isn't even aware that frames are being used. "

Design Tips
Here are some tips for good frames design:

• Make most or all frames borderless.
• Make frames large enough to display your text in your reader's browser.
• Give your screen a point of interest—a clue as to where your reader should look first.
• If your menu is in a separate frame, include a you are here indicator.
• Be sure links to non-framed pages display the pages independently, not inside the frameset. The HTML code for doing this is:

  <A HREF=NonframedPagetName.htm TARGET="top"> </A>

• Be sure return links from non-framed pages link back to the originating frameset, not an internal page. The HTML code for doing this this is:

<A HREF=FramesetName.htm TARGET="top"> </A>

• Include a non-frames version for readers whose browsers do not display frames. If you think readers will want to print information from your Web site, you can link to the non-frames version to provide a printer-friendly file.

Quick Reference Guide

Frames can offer the Web writer a powerful display and organizing tool. Just use them appropriately and design them well.