Chapter 7

Getting From Here to There

• Creating a Web for This Chapter
• Bookmarks: Navigating Within Pages
• Creating Bookmarks
• Hyperlinking to Bookmarks
• Visiting Bookmarks
• Removing Bookmarks
• Hyperlinks: Reaching Outward
• Creating a Navigation Page with Text Hyperlinks
• Creating Text Hyperlinks from the FrontPage Editor
• Hyperlinking to a New Page
• Creating Text Hyperlinks from the FrontPage Explorer
• Creating an Image Navigation Bar with Alternative Text Representations
• Inserting the Images
• Adding Alternative Text Representations and Links to the Current Web
• Setting Clickable Image Style
• Creating a Home Page with a Clickable Image
• Creating Clickable Images
• Highlighting Hotspots
• Selecting, Moving, Resizing, and Deleting Hotspots
• Where You Can Hyperlink
• Hyperlinking to Open Pages
• Hyperlinking to the World Wide Web
• Changing and Fixing Hyperlinks
• Following Hyperlinks
• Changing, Unlinking, and Deleting Hyperlinks
• Recalculating Hyperlinks
• Adding Extended Attributes to Hyperlinks
• Workshop Wrap-Up
  • Next Steps
  • Q&A

The first time I went on the Internet, what I thought would be only a one-hour browsing session lasted four hours. I began by looking for information on graphic development. I did a Web search for related pages. The search returned thousands of pages, so I picked one that sounded promising. Once I got to the site, I went deeper into areas that were more relevant to the topics in which I was interested. Each site led me to another. It was like having a huge library in my living room.

Hyperlinks and bookmarks are what give Web pages this level of interactivity. Without them, you cannot easily enable people to see what is on your site or to find other sites with similar information. With hyperlinks and bookmarks, a user can simply click a mouse on text or a graphic to navigate to all types of pages, download files, find newsgroups, and send e-mail.

Creating a Web for This Chapter

For the tasks in this chapter, create a new empty web from the FrontPage Explorer. Name the web Chap07. To create the web, follow these steps:

1. From the FrontPage Explorer, choose File | New | FrontPage Web (Ctrl+N), or choose the New FrontPage Web button from the toolbar. The New FrontPage Web dialog box appears.
2. Highlight Empty Web and choose OK. The Empty Web Template dialog box appears.
3. Select the server on which you want to create the web from the Web Server or File Location field.

4. In the Name of New FrontPage Web field, enter chap07.
5. Choose OK or press Enter. The Web appears in the FrontPage Explorer.
6. Choose File | Import. The Import File to FrontPage Web dialog box appears.
7. Click the Add File button. The Add File to Import List dialog box appears.
8. Locate the directory that contains the project files for Chapter 7 (Chap07) on the CD-ROM. Highlight all the files (13 in all) and click Open. You return to the Import File to FrontPage Web dialog box, and all files are highlighted.
9. Click OK. The pages appear in the home directory of your web.
10. Select all the images in the web, and move them to the images folder in your web. The images are renamed and moved.

Bookmarks: Navigating Within Pages

Hyperlinks and bookmarks are traditionally called anchors in the Web world, which is why they have an A tag. Bookmarks differ from hyperlinks in that they mark a specific spot on a page. Just as bookmarks serve as placeholders when you read a book, they perform basically the same function on a Web page.

Creating Bookmarks

A page that contains bookmarks typically has a small table of contents at the top, which hyperlinks the user to bookmarked headings on the page. At the end of the bookmark's section, another hyperlink takes the user back to a bookmark located at the top of the page or at the table of contents.

The Windsurfing Links page (windsurf.htm), located on the CD-ROM that accompanies this book, contains the page used in this task. Open the page to complete the following task.

To create a bookmark on your page, follow these steps:

1. From the FrontPage Explorer, double-click windsurf.htm, located in your Web's home directory. The page opens in the FrontPage Editor.
2. Position the cursor to the left of the page title that reads Windsurfing Links. Click to select the heading.
3. Choose Edit | Bookmark. The Edit Bookmark dialog box appears (see Figure 7.1).
   Figure 7.1 : You create a new bookmark with the Bookmark dialog box.

4. By default, the text that you select for the bookmark appears in the Bookmark Name field. Although FrontPage allows you to create bookmark names that contain spaces, some browsers do not recognize them, and the bookmarks might not work properly. It is a good idea to keep bookmarks fairly short because it saves typing when linking to them from another page in the Web. In the Bookmark Name field, enter top.
5. Choose OK. The heading on your page becomes underlined with a dotted line, indicating that it is a bookmark.
6. Position the cursor in the second section to the left of the heading that reads Other Sites About Windsurfing. Click to select the heading.
7. Choose Edit | Bookmark. The Edit Bookmark dialog box appears. Assign a bookmark name of sites and choose OK.
8. Scroll down the page to the third section, and position the cursor to the left of the heading that reads Windsurfing Newsgroups. Click to select it.
9. Choose Edit | Bookmark. The Edit Bookmark dialog box appears. Assign a bookmark name of news and choose OK.
10. Choose File | Save (Ctrl+S), or click the Save button on the Standard toolbar. The page is saved to your web.

Hyperlinking to Bookmarks

Now that you have created two bookmarks on the sample page, you want to create hyperlinks from the Contents section of the page to the bookmarks. To create the links, follow these steps:

1. Scroll to the top of the page until you see the Contents section of the page. Position your cursor to the left of the bulleted list item that reads Other Sites about Windsurfing. Click to select the item.
2. Choose Edit | Hyperlink (Ctrl+K), Insert | Hyperlink (Ctrl+K), or the Create or Edit Hyperlink button on the Standard toolbar. The Create Hyperlink dialog box appears.
3. Select the Open Pages tab.
4. From the Bookmark drop-down menu shown in Figure 7.2, select the "sites" bookmark and choose OK. A link to the bookmark is created.
   Figure 7.2 : You create a link to the bookmark using the Open Pages tab in the Create Hyperlink dialog box.

5. Position your cursor to the left of the bulleted list item that reads Windsurfing Newsgroups. Click to select the item.
6. Choose Edit | Hyperlink (Ctrl+K), Insert | Hyperlink (Ctrl+K), or the Create or Edit Hyperlink button on the Standard toolbar. The Create Hyperlink dialog box appears.
7. Select the Open Pages tab, and choose "news" from the Bookmark field. Click OK. The link appears on your page.
8. Select the text that reads Back to Top at the bottom of the second section. Choose the Create or Edit Hyperlink button on the Standard toolbar. Click the Open Pages tab, and choose top from the Bookmark field. Click OK. The link appears on your page.
9. Repeat step 8 for the Back to Top link at the bottom of the third section on the page.
10. Choose File | Save (Ctrl+S), or click the Save button on the Standard toolbar. The page is updated in your web.

Visiting Bookmarks

You can visit a bookmark on your page without creating a hyperlink to it. The steps are

1. Select any text on the page, and choose Edit | Bookmark. The Bookmark dialog box appears.
2. In the "Other Bookmarks on this Page" field, select the bookmark that you want to visit.
3. Click Goto. The FrontPage Editor scrolls to the bookmark.
4. Click OK or Cancel to close the Bookmark dialog box.

You also can visit a bookmark on another page. Suppose you have the page oriental.htm, which is named "Cooking Great Chinese Food." On it is a section called "Picking Fresh Vegetables," with the bookmark freshveggies. When you create a hyperlink to this bookmark, the URL looks like this:

oriental.htm#freshveggies

To visit a bookmark on another page, do the following:

1. Place the pointer anywhere within the text on the originating page that the user clicks to go to the bookmark on another page.
2. Choose Tools | Follow Hyperlink. The FrontPage Editor opens the other page and scrolls to the bookmark that you want to visit on the page.

Removing Bookmarks

Removing a bookmark is easy:

1. Place the mouse pointer anywhere within the text of the bookmark.
2. To delete the bookmark without deleting the associated text on the page, select Edit | Unlink. You can also choose Edit | Bookmark and then click the Clear button in the Bookmark dialog box. The bookmark is removed, but the text associated with it remains on your page.

Hyperlinks: Reaching Outward

It is convenient to jump to different locations on a page, but that is not what the Web is all about. The Web is about reaching outward. To accomplish this, you provide hyperlinks on your pages. Hyperlinks can take users to other pages in your web, to pages in other people's webs, to newsgroups, and to other types of Internet protocols. You can even put a hyperlink on your page to get e-mail delivered to your mailbox. You can create three basic types of hyperlinks:

• Text hyperlinks
• Image hyperlinks
• Clickable image hyperlinks (image maps)

Text links don't always have to appear in bulleted lists or navigation bars as the following exercises show. You can also create text links within the body of your pages. Most Web surfers know that you can click on a text link to navigate to another page. It's a good idea to avoid using statements such as "Click here." Instead, try phrases like "You can view some of my best shots on the Photography page." You can use the last two words of the previous sentence to create the hyperlink to the Photography page, as shown in Figure 7.3.

Figure 7.3 : ³Click here² statements are best avoided. Try rewording phrases where possible.

Creating a Navigation Page with Text Hyperlinks

You often see navigation bars in pages. You can easily create a text navigation bar that links to the main pages or sections in your web. Later, you can include this navigation bar on the main pages in the Web with Include bots.

Creating Text Hyperlinks from the FrontPage Editor

Now you'll work on the text navigation page that you imported into your FrontPage Web for this chapter:

1. From the FrontPage Editor, choose File | Open (Ctrl+O) or click the Open button on the Standard toolbar. The Open File dialog box appears.
2. Double-click textnav.htm. The page opens in the FrontPage Editor.
3. Select the text that reads Kandy's Home Page, as shown in Figure 7.4. This is the text on which the user clicks to navigate to the home page.
   Figure 7.4 : Select the text on which you want the user to click to navigate to the page.

4. Select Edit | Hyperlink (Ctrl+K), or click the Create or Edit Hyperlink button on the toolbar. The Create Hyperlink dialog box appears. For the link to Kandy's home page, continue with the following task, "Hyperlinking to a New Page."

Hyperlinking to a New Page

Right now, you don't have any pages in your web to link to. In FrontPage, it's easy to create new pages and link to them at the same time.

You should have the Create Hyperlink dialog box open at this time from the preceding task. From here, choose the New Page tab, shown in Figure 7.5, to create a hyperlink to a new page that will be Kandy's home page.
Figure 7.5 : Use the New Page tab to hyperlink to pages that do not yet exist in the currently open web.

1. Select the New Page tab in the Create Hyperlink dialog box.
2. The Page Title field already has an entry. This is the same text that you highlighted in the previous task to create a link. You can leave this entry as is.
3. Based on the title, a URL of kandys.htm is entered in the Page URL field. Change this to read index.htm for Kandy's home page.
4. The Target Frame field should be blank for this task.
5. At this point, you can choose one of two options:
   Edit New Page Immediately. You must choose this option if you are creating your web without the Personal Web Server. After you select this option, click OK. The New Page dialog box appears. Choose the Normal Page template to create Kandy's home page, and click OK. The new page opens in the FrontPage Editor. You can add content to it right away.
   Add New Page to To Do List. You can choose this option only if you are creating your web with the Personal Web Server. If you choose this option, the New Page dialog box appears. Choose the Normal Page template to create Kandy's home page and click OK. The Save As dialog box appears. By default, the "File path within your FrontPage web" field has an entry of index.htm. Click OK to create the page. The page is saved to your web, and a task is added to the To Do list.
6. Complete steps 1-5 for the remaining links in the navigation bar. Table 7.1 lists the page template you should select when you create each page, and the page URL you should use when you save your pages to the web. Figure 7.6 shows the navigation bar with all links completed.
   Figure 7.6 : The navigation bar now contains links to all the main pages in the web.

7. Save the text navigation bar to your web using the File | Save command (Ctrl+S) or by clicking the Save button on the Standard toolbar. Close the page using the File | Close command.
8. Save the pages you have opened in the FrontPage Editor, using the URLs shown in Table 7.1. If you added the new pages to the To Do list when you created them, this step is not necessary.
9. Return to the FrontPage Explorer. Move the textnav.htm page from your Web's home directory into the _private directory. FrontPage renames the page _private/textnav.htm.

Creating Text Hyperlinks from the FrontPage Explorer

This navigation bar displays each link to a page in the web on a different line and is suitable to use in the contents section of a frameset. It is created by dragging pages from the FrontPage Explorer into an open page in the FrontPage Editor. You'll find it easier to create links in this manner if you have both pages open and visible on screen at the same time, as shown in Figure 7.7.

Figure 7.7 : Drag pages from the FrontPage Explorer into an open page in the FrontPage Editor to create text links easily.

To create text links from the FrontPage Explorer, perform the following steps:

1. Position the FrontPage Explorer and the FrontPage Editor so that you can access both screens easily.
2. From the FrontPage Editor, use the New button on the Standard toolbar to create a new normal page. A blank page appears in the FrontPage Editor.
3. From the Folder View, click and drag the index.htm page from the FrontPage Explorer into your open page in the FrontPage Editor. Release the mouse button on the first line. A link to the page appears after you release the mouse.
4. Drag the remaining pages into the FrontPage Editor one at a time, placing each new link on the line below the previous one. Create the links in this order: toc.htm, guestbk.htm, garden.htm, hotlinks.htm, photos.htm, poetry.htm, travels.htm, weaving.htm, and surfing.htm. When you're done, your page should look as shown in Figure 7.8.
   Figure 7.8 : Links to the main pages were created by dragging pages from the FrontPage Explorer into the FrontPage Editor.

5. Select all the text links on the page, using Edit | Select All (Ctrl+A), and choose Bulleted List from the Change Style drop-down menu in the Format toolbar. The links appear in a bulleted list.
6. Add any text formatting to the links that you like. In my example, I changed the font to Arial and reduced the size by clicking the Decrease Font Size button one time.
7. Choose File | Save. In the Page Title field, enter Main Table of Contents. In the File Path Within Your FrontPage Web field, enter maintoc.htm.
8. Choose OK to save the page. Close the page using File | Close.
9. From the Folder View in the FrontPage Explorer, move the maintoc.htm page from your web's home directory to the _private directory. FrontPage renames and moves the page.

Creating an Image Navigation Bar with Alternative Text Representations

Image hyperlinks are commonly used as navigational buttons and navigation bars, but images can be used for hyperlinks in all sorts of ways. For example, you can provide a thumbnail of a picture, which users can click to download or display in a larger view.

Sometimes, the people who visit your Web site are not using browsers that can display images. These browsers are becoming increasingly rare, but other browsers provide the option to turn off image display. Many people choose not to download images because of the time involved. This is not a problem when images are placed on a page just to be seen. When they serve a function, however, you must provide an alternative for people who do not want to download all that artwork. You can provide a text version elsewhere on the page, or you can specify an alternative text representation. You'll use the latter approach in the following task.

Inserting the Images

This navigation bar consists of two rows with five buttons each. Each navigation graphic is 100 pixels wide, making each row a total of 500 pixels wide. The images should already be present in your current web because you imported them at the beginning of this chapter.

The steps follow:

1. From the FrontPage Editor, use the New button on the Standard toolbar to create a normal page. A blank page opens in the FrontPage Editor.
2. With the insertion point on the first line, use the Insert | Image command or the Insert Image button on the Standard toolbar five times in succession. Each time, the Image dialog box appears. From the Current FrontPage Web tab, double-click the images folder. Insert the images in the first row in the following order: home.jpg, contents.jpg, guestbk.jpg, garden.jpg, and hotlinks.jpg.
3. At the end of the first row, press Shift+Enter or choose Insert | Break and select Normal Line Break from the Break Properties dialog box. The insertion point moves to the next line.
4. Using the same procedure outlined in step 3, insert the following images into the second row: photos.jpg, poetry.jpg, travels.jpg, weaving.jpg, and windsurf.jpg. When you're done, your page should look as shown in Figure 7.9.
   Figure 7.9 : Insert 10 images from your current web into the new page, placing five images on each line.

Adding Alternative Text Representations and Links to the Current Web

Creating image hyperlinks is just as simple as creating text hyperlinks. To create an image hyperlink, you need only click an image and then choose Edit | Hyperlink (Ctrl+K) or use the Create or Edit Hyperlink button on the Standard toolbar. The following task shows another way to create an image hyperlink while you add an alternative representation at the same time:

1. Right-click the Home graphic and choose Image Properties from the pop-up menu. The Image Properties dialog box, shown in Figure 7.10, appears.
   Figure 7.10 : You can create links and add alternative text representations from the Image Properties dialog box.

2. In the Alternative Representations Text field, enter Home.
3. In the Default Hyperlink Location field, click the Browse button. The Create Hyperlink dialog box appears.
4. Select the Current FrontPage Web tab, shown in Figure 7.11, and click the Browse button. The Current Web dialog box appears.
   Figure 7.11 : Create links to pages in your current web from the Current FrontPage Web tab in the Create Hyperlink dialog box.

5. Click the Browse button again. From the list of files in your current web, highlight index.htm and click OK. Click OK again to exit the Create Hyperlink dialog box, and click OK again to exit the Image Properties dialog box.
6. Repeat steps 1 through 5 for each additional image on the page, creating links to the appropriate page for each navigation button. Add alternative text representations as shown in Table 7.2.

7. Choose File | Save (Ctrl+S) or click the Save button on the Standard toolbar to save the page to the Web. The Save As dialog box appears.
8. In the Page Title field, enter Graphic Navigation Buttons.
9. In the "File path within your FrontPage web" field, enter buttons.htm.
10. Return to the FrontPage Explorer, and move buttons.htm from the home directory in your web to the _private directory. The page is renamed and moved.

Setting Clickable Image Style

Before you get into creating clickable images, you should know what type of clickable image style you need to create. By default, FrontPage creates image map data that is compatible with the FrontPage Server Extensions. If your service provider does not have the FrontPage Server Extensions, you need to configure your web to use a different type of clickable image format. This is very easy to do:

1. From the FrontPage Explorer, choose Tools | Web Settings. The FrontPage Web Settings dialog box appears.
2. Choose the Advanced tab, shown in Figure 7.12.
   Figure 7.12 : Use the Advanced tab in the FrontPage Web Settings dialog box to change the clickable image style.

3. In the Image Maps section, choose the image map type you want to create from the Style selection box. Available choices are
   FrontPage (default) generates image map data for FrontPage-enabled servers.
   NCSA generates image map data for NCSA servers.
   CERN generates image map data for CERN servers.
   Netscape generates image map data for Netscape servers.
   <None>. FrontPage does not generate HTML to support image maps.
4. If you choose an image map type other than FrontPage or <None>, enter the URL of the server-side image map handler in the Prefix field. By default, /cgi-bin/imagemap is entered for NCSA. /cgi-bin/htimage is entered for CERN. There is no default entry for Netscape.
5. Check the "Generate client-side image maps" checkbox to generate client-side HTML for image maps. If you uncheck this option, FrontPage does not generate HTML that supports client-side image maps.
6. Choose OK to exit the FrontPage Web Settings dialog box. FrontPage asks if you want to refresh the web so the changes take effect. Answer Yes to refresh the web.

Creating a Home Page with a Clickable Image

Clickable images, also known as image maps, are graphics that contain hotspots. The hotspots provide hyperlinks to different pages within the same image. They are useful and enable you to add creativity to the hyperlinks on your pages.

To create the home page, follow these steps:

1. Open Kandy's home page from your current web using one of the following methods:
   • If you created the page without adding it to the To Do list, choose File | Open (Ctrl+O) or click the Open button in the Standard toolbar.
   • If you added the home page to your To Do list, choose Tools | Show To Do List. The FrontPage To Do List dialog box opens. Highlight the task that reads Finish Kandy's Home Page, and click the Do Task button. The page opens in the FrontPage Editor.
2. Choose Insert | Image or click the Insert Image button on the Standard toolbar. The Image dialog box appears.
3. From the images folder in the Current FrontPage Web tab, select imagemap.jpg and choose OK. The image appears on your page.
4. Center the image using the Center button on the Format toolbar.

Creating Clickable Images

You can turn any graphic on your page into a clickable image. Simply select the image, create a hotspot or hotspots on it, and assign a hyperlink to the hotspot. The three types of hotspots are rectangular, circular, and polygonal.

Figure 7.13 shows hotspots added to the image on Kandy's home page. Here is how they were created:

Figure 7.13 : Hotspots are created using the buttons on the Image toolbar.

1. Click the image to select it. The Image toolbar is enabled.
2. To add a rectangular hotspot, click the Rectangle button on the Image toolbar. Position the mouse at the upper-left corner of the Guest Book rectangle on the image, and click and drag to the lower-right corner. Then, release the mouse button. The Create Hyperlink dialog box appears.
3. Using the Current Web tab, enter guestbk.htm in the Page field and click OK. The hotspot appears on your page.
4. Repeat steps 2 and 3 for the Contents rectangle in the image, creating a link to toc.htm in your current web.
5. To create a circular hotspot for the Hot Links portion of the graphic, select the Circle button on the Image toolbar. Click to begin the circle in the center of the Hot Links circle, and drag outward until the entire circle is enclosed. Release the mouse button to open the Create Hyperlink dialog box.
6. From the Current FrontPage Web tab, enter hotlinks.htm in the Page field and click OK. The circular hotspot appears on your page. If you didn't get the hotspot centered correctly, click and drag from the center of the hotspot to move it.
7. To create a polygonal hotspot for the Gardening section of the graphic, click the Polygon button on the Image toolbar. Start the polygon by clicking at any starting point around the border of the hotspot area. As you move the mouse, the outline follows your cursor. Click to set a second point, and move the mouse again. Continue to set points until an outline is drawn around the area. End the hotspot by clicking at your starting point. The Create Hyperlink dialog box appears.
8. From the Current FrontPage Web tab, enter garden.htm in the Page field and click OK. The polygonal hotspot appears on your page.
9. Repeat steps 7 and 8 for the remaining polygonal hotspots in the image. Create links to surfing.htm (for Windsurfing), poetry.htm (for Poetry), travels.htm (for Travels), weaving.htm (for Weaving), and photos.htm (for Photography).
10. Choose File | Save (Ctrl+S) or click the Save button on the Standard toolbar to save the page to your web. If you opened the page from the To Do list, FrontPage asks if you want to mark the task as completed. Choose Yes.

Highlighting Hotspots

When you edit the shapes of your hotspots so that they do not overlap too much, it is sometimes hard to see their outlines on dark backgrounds. Use the Highlight Hotspots command to find hotspots easier:

1. Click the image to activate the Image toolbar.
2. Click the Highlight Hotspots button, which is the next to the last button on the Image toolbar. The image disappears, and you can see the hotspot areas, as in Figure 7.14. To return to normal view, click outside the image.
   Figure 7.14 : Use the Highlight Hotspots button to view hotspots easily.

Selecting, Moving, Resizing, and Deleting Hotspots

You need to select a hotspot to move, resize, or delete it. To select a hotspot, do the following:

1. Click the image where the hotspot appears.
2. Select the hotspot by clicking it. It becomes surrounded by a bounding box with sizing handles at each of the corners.

To move a hotspot, perform the following steps:

1. Select the hotspot.
2. Left-click and drag the hotspot to a new location; use the Escape key to return the hotspot to its original position. Alternatively, use the Up, Down, Left, and Right arrow keys to move the hotspot to a new location.

To resize a hotspot, follow these steps:

1. Select the hotspot.
2. Click and drag any of the resizing handles or resizing points in the hotspot. They are designated by small squares.

To delete a hotspot, follow these steps:

1. Select the hotspot.
2. Use the Edit | Clear command, or press the Delete key.

Where You Can Hyperlink

In the previous tasks, you learned how to create links to new pages and to pages in your current web. You can also create links to open pages and to the World Wide Web. Both of these procedures are shown in the following tasks.

Hyperlinking to Open Pages

Choose the Open Pages tab, shown in Figure 7.15, to create a hyperlink to another page that is open in the FrontPage Editor. The steps follow:

Figure 7.15 : Use the Open Pages tab to hyperlink to other pages that are open in the FrontPage Editor.

1. Select the text, image, or hotspot on which you want the user to click to navigate to the page.
2. Select Edit | Hyperlink (Ctrl+K), or click the Create or Edit Hyperlink button on the toolbar. The Create Hyperlink dialog box appears.
3. Select the Open Pages tab.
4. From the Open Pages list, select the page to which you want to hyperlink.
5. If you are hyperlinking to a bookmark on the destination page, select the name of the bookmark from the drop-down list. No bookmarks are listed if the destination page has none.
6. Click OK to close the Edit Hyperlink dialog box.

Hyperlinking to the World Wide Web

You can create hyperlinks to pages on the World Wide Web, including pages that exist in other webs on your own Personal Web Server. You also can create hyperlinks to other Web protocols. Table 7.3 describes the protocols to which you can hyperlink.

Use the World Wide Web tab, shown in Figure 7.16, to create a hyperlink to a page, a file, or a protocol on the World Wide Web.

Figure 7.16 : Use the World Wide Web tab to hyperlink to pages on the World Wide Web.

The steps follow:

1. Select the text, image, or hotspot on which you want the user to click to navigate to the page.
2. Select Edit | Hyperlink (Ctrl+K) or click the Create or Edit Hyperlink button on the toolbar. The Create Hyperlink dialog box appears.
3. Select the World Wide Web tab.
4. From the Hyperlink Type drop-down menu, choose the protocol that applies to the link you are creating.
5. In the URL field, enter the absolute URL of the page or protocol to which you want to hyperlink. You can enter a relative URL only if you use the (other) protocol.
6. If you are hyperlinking to a bookmark on the destination page, append the bookmark name to the URL, preceded by a pound sign. For example, enter
   http://www.server.com/page.htm#bookmark
7. Click OK to close the Edit Hyperlink dialog box.

Changing and Fixing Hyperlinks

You can use the FrontPage Editor to navigate to and from links on your pages. In addition, links can be changed, unlinked, and deleted very easily through the Edit Hyperlink dialog box. You'll also learn how to recalculate links when you make changes to them and how to add extended attributes to links.

Following Hyperlinks

The FrontPage Editor has built-in browsing capabilities that enable you to follow the hyperlinks in your webs and the World Wide Web. Although not a high-powered browser, it enables you to test your hyperlinks as you design them.

To follow a bookmark, a text hyperlink, or an image hyperlink forward, follow these steps:

1. From the FrontPage Editor, place the mouse pointer anywhere within the text or image hotspot that contains the hyperlink, or select any part of the hyperlink.
2. Select Tools | Follow Hyperlink. If you follow a hyperlink to a bookmark, the FrontPage Editor scrolls to the bookmark. If you follow a hyperlink to another page, it opens in a new window in the FrontPage Editor.
3. After you follow a bookmark hyperlink, a text hyperlink, or an image hyperlink forward, use the Back button in the FrontPage Editor Standard toolbar to return to the page from which you navigated. The originating page reopens at the location of the hyperlink that you followed.

Sometimes the server to which you are following a hyperlink is unresponsive. You can stop the process by clicking the Stop button on the FrontPage Editor Standard toolbar.

Changing, Unlinking, and Deleting Hyperlinks

It is a fact of life on the Web that sites have a tendency to evolve and change. Ten pages quickly become dozens. They are renamed, relocated, deleted, or divided into other pages.

To change the URL of a text hyperlink or an image hyperlink, do the following:

1. Select the hyperlink that you want to change. For a text hyperlink, place the mouse pointer anywhere within the text that contains the hyperlink, or select any part of it. For an image hyperlink, select the image or the hotspot within the image that contains the hyperlink.
2. Use the Edit | Hyperlink command, or click the Create or Edit Hyperlink button in the FrontPage Editor toolbar. The Edit Hyperlink dialog box appears.
3. Select the appropriate tab and edit the URL as necessary. Save the page to your web after you correct the link.

To unlink a hyperlink, follow these steps:

1. Select the characters that you want to delete within the text hyperlink.
2. Choose Edit | Unlink. The hyperlink is deleted from the text-or the part of the text-that you selected. The text associated with the hyperlink remains.

To delete a text hyperlink or an image hyperlink, perform the following steps:

1. Select the hyperlink that you want to delete. For a text hyperlink, place the mouse pointer within the text associated with the hyperlink. For an image hyperlink, select the image or hotspot in the image that contains the hyperlink.
2. Select Edit | Hyperlink, or click the Create or Edit Hyperlink button on the toolbar. Then, click Clear. Alternatively, you can press the Delete key.

Recalculating Hyperlinks

When multiple authors work on the same web at the same time, you can easily lose track of who has done what. Likewise, when you create webs with wizards or import pages into your web, you sometimes see a red triangle beside the page when you are in the FrontPage Explorer's Outline view. This usually occurs when a page that contains a hyperlink is imported to a web before the destination page is imported. Use the Recalculate Hyperlinks command to update the web display in the FrontPage Explorer. In many cases, this command gets rid of those red triangles.

To update the web display or to create the text index for the Search bot, use the Tools | Recalculate Hyperlinks command. The FrontPage Explorer refreshes the display of the web.

Adding Extended Attributes to Hyperlinks

FrontPage supports the most common attributes associated with hyperlinks, but the capability to add additional attributes that are not supported is available in the Edit Hyperlink dialog box. You add extended attributes to hyperlinks through the Create Hyperlink dialog box or through the Edit Hyperlink dialog box, shown in Figure 7.17.

Figure 7.17 : You can add extended attributes to a link from the Create Hyperlink dialog box or from the Edit Hyperlink dialog box.

To add extended attributes to a hyperlink, follow these steps:

1. Select the hyperlink to which you want to add an extended attribute.
2. Choose Edit | Properties (the last choice in the Edit menu, which varies according to the type of link you select), or press Alt+Enter. The Edit Hyperlink dialog box appears.
3. Click the Extended button. The Extended Attributes dialog box appears.
4. Click the Add button. The Name/Value Pair dialog box appears.
5. Enter the name of the attribute in the Name field.
6. Enter the value of the attribute (if applicable) in the Value field.
7. Click OK to close the Name/Value Pair, Extended Attributes, and Edit Hyperlink dialog boxes.

Workshop Wrap-Up

You learned quite a lot about creating and using hyperlinks with FrontPage. You are now set to tackle building your Web site from the ground up. Choose a theme, plan the areas that you want to include on your site, and the rest will happen over time. Rome was not built in a day; neither will your custom pages. Sites constantly evolve and change as new standards are developed for the Internet. The more you become familiar with what is out there and what you can do, the more you can incorporate into your site.

In this chapter, you learned how to navigate through your pages and out to other areas of the Internet by using bookmarks and hyperlinks. You learned how to hyperlink pages together with text, images, and image maps.

Next Steps

In the next chapter, you learn about the basic elements that make up a page-paragraphs, headings, and text styles. You learn when to use them and how to arrange content for the best appearance.

For additional information that relates to the topics discussed in this chapter, check out the following chapters:

• Chapter 10, "Sprucing Up Your Pages," shows you how to import images into your web and onto your pages.
• Learn how to configure target frames with Chapter 13, "Frames-Pages with Split Personalities."
• Refer to Chapter 28, "Testing and Publishing Your Web," to learn how to verify hyperlinks and repair broken hyperlinks.

Q&A