Article
Designing with Frames - an Introduction
Navigation
Now that you know how to make frames, it's time to learn how to use them. This section will teach you how frames affect the way the links on your page work. After that, we will use what we have learned so far to design a Website that uses the well-known "menu bar" layout.
Targeted Links
Before frames, the only thing a Web author had to worry about when they created a hypertext link was the location of the document to be loaded. With frames, a new concern is introduced. Which frame should the document be loaded into?
Anyone with even a passing familiarity with HTML should know that you create a hypertext link using the anchor tag, <A>, with the HREF attribute.
<A HREF="newdoc.html">...</A>
By default, newdoc.html will be loaded into the frame in which the link was clicked. In some cases, this is exactly what you want. But what if you created a site with two frames -- one that contained a menu of documents that can be loaded into the other? In this case, you'd want the links in the menu frame to target the main frame.
The first step to accomplish this is to give your frames names. As described in the previous section, you do this with the NAME attribute of the <FRAME> tag. In our example, we would name our frames menu and main as shown here:
<FRAMESET COLS="75,*" FRAMEBORDER=0>
<FRAME SRC="ourmenu.html" NAME="menu">
<FRAME SRC="introduction.html" NAME="main">
</FRAMESET>
Then, to make all links in the menu frame target our main frame, we must use the TARGET attribute of the <BASE> tag in the header of ourmenu.html, which is the file loaded in our menu frame.
<HTML>
<HEAD>
<BASE TARGET="main">
</HEAD>
<BODY>
...
"Okay, this is all well and good," you say. "But what if I want different links in a single file to target different frames?" No problem! The <A> tag also supports a TARGET attribute, which overrides any target you may have specified using the <BASE> tag.
<A HREF="newdoc.html" TARGET="main">...</A>
Using this, you could actually just forget about the <BASE> tag and just put TARGETs on all of your links, but unless there is no clear default target, you'll usually save on the size of your file by setting it using the <BASE> tag.
Special Targets
As you don't always want a link to load into one of your frames, there are several special targets that you can use. These may be used with either the <BASE> or <A HREF> tags, and must be typed exactly as they appear here, as they are case sensitive.
TARGET="_self"
Loads the link into the same frame as the link itself. This is the default behavior, and works as if the TARGET attribute were not specified at all.
TARGET="_top"
Wipes out all the frames in your window and then loads the new document into the window. Typically, you would use this whenever you provided a link leading to another site. If you didn't, the other site would be loaded into your frames, leading to an ugly and sometimes unusable screen layout. Unless you have a special reason not to, always use this when providing links outside your site. There's nothing more annoying for a user than being stuck in someone's frames.
TARGET="_parent"
Loads the link into the parent of the current frame. Simply speaking, it wipes out the frameset enclosing the frame containing the link, and loads the target document in its place. The distinction between _parent and _top arises in the case of nested framesets, where you might want to load the link into the next step up in the nesting order without wiping out any "outer" frameset(s). In a simple, non-nested frameset, _parent and _top do the same thing.
TARGET="_blank"
Opens a new browser window and loads the target document into it, leaving the current frameset untouched. In some situations, this is preferable to using _top when providing a link to someone else's site.