Using FrontPage Navigation Components

Now that you have created a new web from scratch or by importing files from an existing web site, you are ready to begin refining your design and adding content to your pages. As a bare minimum, you will probably want to add shared borders, Navigation Bars and Page Banners. You may also want to select a theme in order to give your site a coordinated and more professional look.

Organizing your Web for Easy Navigation

FrontPage makes creating and maintaining navigational links for your web site easy. However, it's equally easy to get confused and end up with a mess. Plan the navigation of your site before you begin to create the pages. If you look around The Smith Family Cyber-Home, you will see that the site is laid out in sections that are roughly analogous to the rooms in a house. We have the family room, the guest room, my office and so on. Each one of these sections has its own set of pages and each of the pages within a particular section are related to each other in some way. For example, all of the pages in my office are related to web design and various aspects of homesteading at Y!GeoCities.

Make a list of the pages you want to include in your site and group them by topic or type of page. For example, all pages that are about your family under family or all pages that have links to other places under links. Staying organized is easier if you create a separate folder in your web for each group of related files. For example, all of the files linked to the main page of my Kitchen section are located in a folder called "kitchen."

Once you have decided on the categories, you can create the corresponding folders in your FrontPage Web. To create folders, switch to the Folder View by clicking on View, then Folders. Then, make sure that none of the existing folders in the right hand side of the window are selected by clicking once in the blank area of the window. Now click the right mouse button and select, "New Folder." A brand new folder will appear and its name will be selected. Type a new name for it and press the <Enter> key. You will see a message saying that FrontPage is renaming New_Folder to whatever name you picked. Once you have created all of the folders you will be needing, you can start creating files and saving them to these folders.

Using the FrontPage Navigation Bar

As you create your files, you can begin to place the FrontPage Navigation Bars and Page Banner components. As far as I'm concerned, the best place for your main Navigation Bar is in one or more of the shared borders of your page. You won't have to remember to add it to every page that way. Insert the Navigation Bar into the shared border by clicking in the border you are going to use. (You can tell where the shared borders start because of the dotted line between the border and the rest of the page.) I prefer to place my main Navigation Bar in the bottom shared border of my pages. Click the Insert menu and select Navigation Bar.

In the dialogue box that appears, you can select the look of your Navigation Bar (horizontal or vertical, button or text) and which pages will be included. By the way, button and text look the same unless you are using a theme. The best pages to include in this shared bar are the "Child pages under Home." Also click on the check box next to "Home page" under "Additional Pages to include," so that your home page will be listed in this area as well.

If your web site has sections, like our kitchen, you may also want to include a second Navigation Bar on the main section of the page (not in the shared borders) that lists the pages in the same section with the current page. When you actually implement the layout of your web site in the Navigation View (in a later tutorial) you will be creating each section with a main page and one or more pages beneath it. The main page should have a Navigation Bar that lists its children. Each of the child pages should have a Navigation bar that lists its sibling pages and its parent (which will be listed as "[Up]" in the Navigation Bar. Insert these bars immediately above the separation between the page and its shared border (above the dotted line.) For the main page of the section, select "Child level" and for the subordinate pages, select "Same level." Another option you can use, if you have a series of pages that conceptually follow one another (like the pages of this tutorial) is "Back and next."

Using the Page Banner

The Page Banner component helps you maintain consistency between the title at the top of the page and the one that appears in the Navigation Bar. You may not want to use it on every page in your site, so I would not recommend placing it in a shared border. The source for the title is the same text that appears in FrontPage's Navigation View and also the text that will be used to refer to the page in a Navigation Bar. You will want to keep this text as short as is reasonably possible in order to keep the Navigation Bar from getting too cluttered. The Page Banner is probably most useful if you are using a theme for your web site because it can automatically combine your title with the appropriate banner graphic. There is no other way to place text on a theme banner short of creating separate graphics for each page yourself using a program like PaintShop Pro.

You may be saying to yourself, "Why hasn't Irene talked about themes?" Two reasons. First, not everybody is going to want to use a theme, so I wanted to isolate it in its own tutorial. Second, I'm not completely happy with FrontPage themes right now. I've discovered that version of Netscape prior to the 6.0 beta don't manage themes too well. I think because of incompatibilities between the way Netscape and Internet Explorer interpret stylesheets. With that warning out of the way, you can continue to the next tutorial, "Using FrontPage Themes," as soon as it appears next week.