How to Create a Navigation Bar

Creating a simple text navigation bar on your Web site is useful. Even a simple navigation bar consisting of text is the difference between a Web site and an unconnected mass of Web pages. Creating a navigation bar forces you to start thinking hard about how your site is going to be organized.

Here’s an example of a simple text navigation bar for a “personal professional” site:

Home | Résumé | Memberships | Publications | Personal | Contact me

When you click the word Résumé on the text menu to go to the Resume page, however, the text navigation bar should change to reflect where you are:

Home | Résumé | Memberships | Publications | Personal | Contact me

Follow these instructions to create a text navigation bar:

1

Open a new, empty page in the Visual Editor tab in CoffeeCup.

Adding a navigation bar adds some consistency to your pages.

2

Type in a line of text representing the elements of your site, with a word or two for each page or area.

Use the vertical bar to separate the tabs. Examples for a personal/professional site look like this:

Home | Résumé | Memberships | Publications | Personal | Contact me

If the vertical bar character is not accessible from your keyboard, it should be available from the Symbol or similar menu. In Microsoft Word, choose Insert→Symbol to bring up the Symbol dialog box and select the vertical bar character.

3

Select the text links and click the Center button.

The text menu will be centered.

4

Select the word Home and choose Insert→Link.

The Insert Link dialog box appears.

5

Type in the URL and click OK..

The URL is simply the filename of the home page, index.htm. After you enter it, you’re returned to the Visual Editor.

6

For the remaining phrases, repeat this process: Select the tab name link it to a Web page by name; click OK.

By doing it this way, you can put your navigation feature in place; the pages don’t even have to exist yet. (When you do create them, however, you must match the names in the text menu exactly.)

7

Save the page repeatedly using each of the filenames you’ve defined.

As you proceed, delete the link from the tab representing the page you’re about to save, removing the underline and link color from it.

When you’re done, you should have a fully linked text menu — every tab linked to a page, even if the page content doesn’t exist yet.

blog comments powered by Disqus
Advertisement

Inside Dummies.com

Dummies.com Sweepstakes

Win $500. Easy.