Creating Frames and Framesets

When you build a site that uses frames, you're actually creating multiple Web pages for each browser window your viewers are looking at. Coordinating these pages can get confusing, but FrontPage helps by letting you create and edit framed pages directly from within the frameset. The program also lets you insert an alternative page for visitors whose browsers don't support frames.

6.2.1. Creating Frames

FrontPage simplifies the process of creating frames with its frames pages templates. These are canned frameset pages, each with a different layout, that include buttons and other aids to help you fill the frameset with pages.

To get started using one of these templates, select File New to display the New task pane. Within the task pane, click "More page templates" and then click the Frames tab. Here, you'll find FrontPage's templates for frames. To preview and read a quick summary about each template, click each template. Then pick the frames template you want to use and click OK. FrontPage creates the empty frameset, as shown in Figure 6-2.

To help you fill the empty frames, FrontPage adds two buttons to each frame. You use the buttons to select or create the first page viewers will see when they come to your site.

Figure 6-2. FrontPage's Banner and Contents frames template creates this empty frameset. When you select pages to load into each of these three frames, you'll see them here in Design view. At that point, you'll be editing four separate HTML documents all at once within the same window.

• Set Initial Page. Click this button if you have an existing Web page you'd like to load into the frame.

  ---

  Note: Don't let the terminology here confuse you. "Initial Page" means the page that initially loads in the frame. But if you haven't created it yet, you can click New Page (which will then become the initial page).

  ---

• New Page. Click this button to create a new Web page to load into the frame. FrontPage creates a new blank page and displays it within the frame, so you can edit it. Later, when you save the frameset, FrontPage prompts you to save any new pages.

That's all you need to do to get started creating a group of pages that use frames. Section 6.2.3.4 shows you how to add more pages to a frameset, but first you need to save your new frames.

6.2.2. Saving the New Frameset

Once you're done creating your new framed pages, you save them by first saving the frameset and then saving any new pages that you added. With the frameset open in Design view, save it as you would any other Web page (Section 1.4).

When you save the frameset, FrontPage first prompts you to save each new page you've created, one by one, and provides a diagram on the right side of the Save As dialog box, as shown in Figure 6-3, to help you keep track of what you're saving.

Figure 6-3. When you save new frames pages, FrontPage shows you which page you're saving, by highlighting it within the diagram on the right side of the dialog box. The frameset page is last but not least.

Pick a name for each new page and enter it into the File Name box. Since you may be looking at more than one dialog box (one for each new page, plus one for the frameset), make sure you know which file you're naming. Most people find that naming the frameset Index1.htm or default.htm works well, since it's usually the first page of their site. (See Section 10.5.1 for details on naming a site's home page.)

6.2.3. Modifying Frames

Frames are just like any other design element on your site; if you don't like the way they look, FrontPage gives you lots of ways to change their appearance. For example, if the proportions of your frames look a little off, you can change the way they're laid out by using the Frame Properties dialog box (which is what you'll use to make most frame-related modifications). To get started making changes, first select a frame, then right-click it and select Frame Properties (or select Frames Frame Properties).

6.2.3.1 Adjusting frame dimensions

The quickest way to modify the size of an individual frame is to drag and reposition its border. However, the Frame Properties dialog box gives you some better options. The Frame size boxes let you set precise dimensions by typing them in. Frames can use both percent and pixel values, like tables (Section 5.2.2).

You can also use relative sizing, which lets you control the size of a group of elements, by assigning dimensions that are proportional to each individual element.

For example, a banner at the top of a page might have a relative height of 1, while a vertical menu below it has a relative height of 4. This means that the banner takes up one-fifth of the vertical window space while the menu takes up four-fifths.

The best bet? Stick with percentage or relative dimensions. This way you know your page will look more or less the way you intendedno matter what a viewer's browser size or screen resolution.

6.2.3.2 Frame scroll bars: To show or not to show

On some pages, like the one shown in Figure 6-1, scroll bars can mar and clutter up an otherwise lovely composition. To get rid of these unsightly controls, adjust the Show Scrollbars setting. You can choose to show them Always, If Needed, or Never. Before you make this change in Frame Properties, take a good look at the frame in question. If a viewer will definitely need to scroll, hiding the scroll bar is cruel and counterproductive, so weigh your priorities. You also might want to edit the dimensions of your frame (explained in the previous section) so that scroll bars aren't necessary.

He that taketh can also giveth. Bestow the power of frame resizing on your readers, enabling them to solve the problem themselves by moving frame borders around within their browser. To do so, in Frame Properties, turn on the "Resizable in Browser" checkbox.

6.2.3.3 Hiding frame borders

Even without scroll bars, frame borders look clunky and obvious. If you want to elevate your game and do like the professionals do, hide your frame borders (see Figure 6-4).

Figure 6-4. Compare this page to its border-showing twin in Figure 6-1. Hiding borders makes a page look sleek, unified, and more professional.

With the frameset open, select Frames Frame Properties and click Frames Page on the lower right. Turn off the Show Borders checkbox in the Frames tab.

You can set the width of your borders on the Frames tab, too. The Frame Spacing field controls border thickness in pixels. This setting applies to visible and invisible borders. If you've hidden your borders, frames are still separated by the number of pixels you enter here.

6.2.3.4 Splitting frames

If you need to add a frame to a frameset, you have to split an existing frame in two to make room for it. To do so, first click in the frame. Then select Frames Split Frame. Specify whether you want to split the frame into rows or columns, and click OK. A new blank frame appears.

6.2.4. Creating a No Frames Page

Not all browsers are on good speaking terms with sites that use frames. The typical response from browsers that can't handle frames is to show a big blank page. Fortunately, FrontPage is capable of helping you reach across this browser divide. Take a look at the Views buttons on the lower-left corner of the document window. Just when you were getting bored with your choices, a new option appears there called No Frames. You can see it in Figure 6-2. Click the No Frames button, and a terse message appears: "This page uses frames, but your browser doesn't support them." This message, which is just an alternate view of your frameset, will appear in browsers that don't display frames. If you'd like to let these browser owners down a bit easier, reword the message. If you don't want to lose them, create an alternate site that doesn't use frames, enter a message about that alternate site here, and include a link to it.