InformIT: Sams Teach Yourself HTML 4 in 24 Hours

Creating a Frameset Document

How did I make the sites in Figures 21.1 and 21.2? First, I created the contents of each frame as an ordinary HTML page. These pages (listed in Figure 21.4) don't contain any tags you haven't already seen in other hours.

Figure 21.4 These two Web pages were designed specifically to fit in frames shown in Figure 21.1. The bottom document in Figure 21.2 is not listed here.

To put them all together, I used a special kind of page called a frameset document.

A frameset document actually has no content. It only tells the browser which other pages to load and how to arrange them in the browser window. Figure 21.3 shows the frameset document for the Entropy Almanac site in Figures 21.1 and 21.2.

Figure 21.3 If you load this frameset document in Netscape Navigator, you see the site shown in Figure 21.1.

A frameset document is an HTML page that instructs the Web browser to split its window into multiple frames and specifies which Web page should be displayed in each frame.

In Figure 21.3, there is a <frameset> tag instead of a <body> tag. No tags that would normally be contained in a <body> tag can be within the <frameset> tag. The <frameset> tag in Figure 21.3 includes a rows attribute, meaning that the frames should be arranged on top of each other like the horizontal rows of a table. If you want your frames to be side-by-side, use a cols attribute instead of rows.

You must specify the sizes of the rows or cols, either as precise pixel values or as percentages of the total size of the browser window. You can also use an asterisk (*) to indicate that a frame should fill whatever space is available in the window. If more than one frame has an * value, the remaining space will be divided equally between them.

In Figure 21.3, <frameset rows="80,*"> means to split the window vertically into two frames. The top frame will be exactly 80 pixels tall, and the bottom frame will take up all the remaining space in the window. The top frame contains the document banner.htm, and the bottom frame contains greeting.htm (both of which are listed in Figure 21.4).

TIP

After the framesets in Figure 21.3, I included a complete Web page between the <body> and </body> tags. Notice that this doesn't appear at all in Figure 21.1 or 21.2. All Web browsers that support frames will ignore anything between the <noframes> and </noframes> tags.

Because some browsers still do not support frames, it is probably wise to include alternative content with the <noframes> tag. If nothing else, just include a note recommending that people get either Microsoft or Netscape's browser to see the frames.

Some Web page publishers actually produce two versions of their site—one with frames, one without. You can save yourself that hassle by simply including links between all the pages that will appear in your primary frame.

Because you can't predict the size of the window in which someone will view your Web page, it is often convenient to use percentages rather than exact pixel values to dictate the size of the rows and columns. For example, to make a left frame 20 percent of the width of the browser window with a right frame taking up the remaining 80 percent, you would type the following:

<frameset cols="20%,80%">

An exception to this rule is when you want a frame to contain graphics of a certain size; then you would specify that size in pixels and add a few pixels for the margins and frame borders. This is the case in Figure 21.3, where the images in the top frame are each 42 pixels tall. I allowed 38 extra pixels for margins and borders, making the entire frame 80 pixels tall.

Whenever you specify any frame size in pixels, there must also be at least one frame in the same frameset with a variable (*) width so that the document can be displayed in a window of any size.

The <frame /> Tag | Next Section

Previous Section