Laying Out Pages

You should consider several factors when designing the layout of your Web site so that the information is consistent, usable, and navigable. In addition to the layout of the actual content of your information, you need to decide where to display the page title, navigation buttons, copyright information, document author, last modified date of the document, and so on. Consistency counts.

FrontPage offers several tools to help you maintain a consistent page layout. Most important among these is the use of FrontPage templates to choose the best layout for your information. To maintain a consistent layout across your Web site, you must use the same template for each page.

Using Frames

Frames enable you to define separate regions of the Web browser window, such as a banner at the top, a navigation page at the side, and a footer section at the bottom, using the middle region for the content of your information. Each frame has its own underlying Web page, which, when displayed by the browser, shows as multiple independent pages that all fit within the browser window. Each frame can also appear with its own set of scrollbars, borders, and margins. Frames can save on page download time for your users, too, because only the body content needs to be loaded as users navigate your site; the other frames remain static.

Unfortunately, with frames, all the good comes with some bad. Frames are more difficult to manage and maintain. In addition, you'll find that many of the important Internet search engines do not index frame content—thus, Internet users may not be able to find your site easily.

Before you create a frame layout, you should first understand how frames work. Every frame document begins with a specially formatted HTML page that defines the divided regions of the browser window and the separate subpages to load into each region.

Each region of a frame layout is called a frame. Each frame has its own name, and you can define hyperlinks in one frame to load pages in another. Finally, each frame specifies the first page to load when the frame displays.

Creating Frames

FrontPage provides powerful frame-editing tools. To create a frame, choose File, New, Page or Web; in the New Page or Web task pane, choose Page Templates and then click the Frames Pages tab. Browse the available templates, and use the preview to visualize the layout of the frames. Find a layout that best fits your needs. If one doesn't match exactly, choose one that you can modify—you can later use tools to reshape your frames.

When the frames page is created from the template, FrontPage displays helper buttons to remind you what to do next. For each frame, use the helper buttons to define the underlying page. Click the New Page button to create a new blank page to fill that specific frame. Click Set Initial Page to browse for a current page within your Web site to use as the frame's page. Additionally, you can click Set Initial Page to create a new page by using one of the new page templates, such as the Table of Contents template.

Editing Frames

If you want to improve the layout of your frames, you can adjust the size of each frame by dragging the frame border to your preferred location. If you want to remove a specific frame, click the mouse inside the frame and choose Frames, Delete Frame.

To split a current frame into two new frames, select the frame to split and choose Frames, Split Frame. Use the Split Frame dialog box to specify whether you want to split the frame into new columns or rows.

To further tune the layout of a frame, right-click the frame and choose Frame Properties. In the Frame Properties dialog box (see Figure 36.14), you can control the frame's attributes quite precisely.

If you want the user to be able to resize your frame, check the Resizable in Browser check box. Additionally, you can choose whether the frame displays scrollbars only if needed, always, or never.

To edit the settings of the page that defines the set of frames, click the Frames Page button. In the Page Properties dialog box, adjust the pixel spacing between all your frames, and choose whether to display frame borders.

Targeting Hyperlinks to Frames

You can target hyperlinks to display their destination page in different frames. Targeting hyperlinks enables you to load pages into other frames without affecting the frame in which the hyperlink resides. You've no doubt used this feature many times with navigational frames, typically on the left side of the page: When you click a hyperlink in the navigation frame, the destination page is loaded in a body frame, and the navigational frame remains. If you didn't have frame targets for your hyperlinks, the destination page would load inside the frame that originated the link.

To create a hyperlink that targets another frame, create the hyperlink as you would normally, but click the Target Frame button in the Create Hyperlink dialog box. The Target Frame dialog box appears, as shown in Figure 36.15.

To target your link to a specific frame, click the frame in the Current Frames Page panel.

Using Shared Borders

Frames can be a challenge to manage—and, if you are not careful, frames can impede your Web site's placement in search engines. If you want to provide a consistent layout to your pages without using frames and without many of the problems that frames impose, use Shared Borders. Shared Borders provide an easy way to add and maintain the same content at the top, left, right, or bottom of your Web pages. Use Shared Borders to provide a consistent layout for your Web pages and make it a snap to maintain when you have a change to the shared content.

When you edit a page using Shared Borders, FrontPage displays the shared regions with dashed lines in Page view. You can edit the Shared Border contents as you do any other page. When you save the page, the Shared Border is saved as well, and all other pages that reference that border are updated.

Shared Borders can be applied to individual pages or to your Web site as a whole. If you enable Shared Borders for your entire Web site, you can turn them off on a page-by-page basis. You can even create a background along the shared border that's different from the page background.

To use Shared Borders, choose Format, Shared Borders to display the Shared Borders dialog box, as shown in Figure 36.16. Click the All Pages option button to apply the Shared Borders to your entire Web site.

If you're frustrated because you cannot get the top and bottom shared borders to align with each other, see "Aligning Shared Borders" in the "Troubleshooting" section at the end of this chapter.

While editing a page, you can turn individual Shared Borders on or off in a similar fashion. Click the Current Page option button, and check or uncheck the borders that you want to affect. If you want to restore a page to use the Shared Borders used for your entire Web site, check the Reset Borders for Current Page to Web Default check box.

Using Link Bars to Make Navigation Easier

A link bar is a navigational aid that provides shortcuts to the important places in your Web. The hyperlinks that you place on your link bars generally reflect where you think the user is most likely to want to go next: Home, Search, Contact Us, Next Page, Previous Page, and the like.

FrontPage automatically maintains three different types of link bars:

• Custom Link Bar— Contains links to pages that you define, such as Home, Search, and Contact Us.

• Custom with Next and Back Links— Works just like a custom link bar, except that FrontPage also maintains Next and Back links on all "sibling" pages.

• Full Navigation View-Based Link Bars— Offers the full monty—these are link bars that can include automatically maintained links to the home page, other high-level pages, the parent of the current page, the children of the current page, the siblings of the current page, plus Next and Back buttons for the nearest siblings.

To put a link bar in one of your pages, click where you want the bar to go, choose Insert, Web Components, and pick Link Bars from the Component Type list (see Figure 36.17).