MS FrontPage

Creating Hyperlinks

Okay, so now that you know the theory behind URLs, you're ready to actually create a linking, breathing hyperlink. The first step is to select the element on your Web page that'll serve as the clickable link. You can create a hyperlink out of text or an image. (You've got a few other options for linking from images, which you'll learn about in the next tutorial.)

Next, you'll set the destination for your hyperlink. Most often, links lead to other Web pages. But you can link to pretty much any type of fileAdobe Acrobat (PDF) files; Microsoft Word, Excel, or PowerPoint presentations; even zip files or actual programs (sometimes called executables, because they carry out a series of programmed instructions). Below, you'll learn to link to any page on the Web, to a page in your site, or to an email address.

Inserting a Hyperlink

To create a hyperlink:

  1. In the document window, select the text or a picture that you want to turn into a hyperlink.

  2. Insert a hyperlink.

    To do this, select Insert » Hyperlink, or press Ctrl+K, or right-click the selection and choose Hyperlink. You can also click the Hyperlink button on the Standard toolbar. All these commands open the Insert Hyperlink dialog box (see Figure 3-2).

  3. Set the Text to Display.

    The Text to Display field, at the top of the dialog box, shows the text that appears on your Web page as the hyperlink. The field automatically displays any text you selected on the page. You can edit the text here, if you want.

Figure 3-2. The Insert Hyperlink dialog box includes many options for setting the destination of your hyperlink. Link to a file within your site, a URL out on the Web (by clicking the Browse the Web button, circled), or help a visitor email you by linking to your address.

Once you've opened the Insert Hyperlink dialog box, you can create any one of the types of hyperlink described in the following sections.

Linking to an Existing File Within your Site

After they get to your site, visitors will need to get from page to page. Follow these steps to link to any page or file within your site:

  1. On the left side of the Insert Hyperlink dialog box, click the Existing File or Web Page button.

    The "Look In" browse box in the center of the dialog box shows your Web site's folder.

  2. Locate the page or file you want to link to.

    Navigate to the page you want to link to just as you would to any other file in a dialog box: you can click the drop-down arrow on the right side of the "Look in" box or you can double-click any of the folders in the center of the dialog box.

  3. Double-click the file, or click it once and click OK.

Linking to a Page on the World Wide Web

The World Wide Web is your oyster. You can link to any page, anywhere in the world.

There are two ways to link to a page out on the Web. The fastest is simply to type the address directly on the page you're editing. For example, type followed by a space. FrontPage automatically creates the hyperlink and adds the http:// prefix. You can use the Insert Hyperlink dialog box to edit the link later, if need be.

Or you can use the Insert Hyperlink dialog box to create the link:

  1. On the left side of the Insert Hyperlink dialog box, click the Existing File or Web Page button.

    On the right side of the dialog box, just above the large browse box in the center, you see a Browse the Web button with a globe and magnifying glass (see Figure 3-2).

  2. Click the Browse the Web button to open your browser.

  3. Navigate to the page on the World Wide Web you want to link to.

  4. Copy the address from your browser's address bar.

  5. Return to the Insert Hyperlink dialog box and paste the text you just copied into the Address field at the bottom of the dialog box.

    Paste by pressing Ctrl+V. Then click OK and you're done.

If you've visited the Web page recently, FrontPage gives you an easier way to make the link. Click the Browsed Pages link on the left side of the dialog box to display a list of Web addresses stored in your browser's history menu. Select the address you want and then click OK.

Linking to a New Page

As you build a site, sometimes you'll need to link to pages that you haven't created yet. FrontPage includes a handy option for handling this. Instead of forcing you to create a new page, and then return to the page you were working on to create a hyperlink, the program lets you do both simultaneously.

  1. Within the Insert Hyperlink dialog box, click the Create New Document button on the left (Figure 3-3).

    The dialog box changes to reflect your new options.

    Figure 3-3. When you're creating a hyperlink and a new page all at once, the Hyperlink dialog box lets you edit the text that'll serve as a link, and name the new file. Under File path, FrontPage displays the location in which it plans to save the file. If you want to change it, click Change and browse to another folder. Then type a file name in the bottom of the Create New Document dialog box and click OK.

  2. In the "Name of new document" field, type in a name for your new page.

    Just type the name itself. FrontPage adds the .htm file extension for you. As always, don't include any spaces, capital letters, or special characters.

  3. Click the "Edit the new document later" radio button if you don't want the new page to open right away.

  4. Click OK.

    FrontPage simultaneously creates your page and your new hyperlink.

If you're working in Design view and want to edit a page you've linked to, just press Ctrl and click the hyperlink. FrontPage opens the destination page of the hyperlink in the document window.

Dragging Between Files to Create Hyperlinks

Sometimes you're too busy to bother with menus. If you're the point-and-click type, FrontPage gives you another option for creating hyperlinks. With the folder list active on the left side of your screen, just drag the file you want to link to onto the page that should contain the hyperlink. Poof! Your hyperlink appears, taking its text from the title of the file you dragged. The page title may not be exactly what you want, but you can edit this. Just right-click the link and select Hyperlink Properties. Then change the Text to Display field.

A Web page title is different from its file name. To view a page's title, open it in Design view and select File » Properties. The Title field shows you the page title and lets you edit it. (See Creating sites in navigation view for more details.)

Speaking of menus, FrontPage gives you a handy menu when you're dragging your new links around. Instead of dragging with your left mouse button depressed, drag while holding your right mouse button. A menu appears that gives you more choices, as illustrated in Figure 3-4.

Figure 3-4. This pop-up menu offers additional actions for dragged items and even lets you back out of your drag-and-drop operation with a Cancel option.

The right button drag offers the following choices:

  • Create Hyperlink. Inserts a hyperlink just like dragging with the left mouse button does.

  • Open File. Opens the file you're dragging so that you can edit it within the document window.

  • Insert File. Inserts the contents of the file you dragged into the page that's currently open.

  • Auto Thumbnail. If you've dragged a picture onto the page, this inserts the graphic as a thumbnail, or miniaturized image, that hyperlinks to the full-size version of the image

Linking to an Email Address

Say you want to provide site visitors with an easy way to contact you. Maybe you need to take orders, gather information, or you just haven't been getting enough email lately. Sure, you could just post your email address and invite people to write to you. But they might decide it's too much trouble to open their email program, copy and paste your address, type a subject line, and so on.

Thankfully, FrontPage provides a faster, more convenient option that makes this process almost effortless. When you create a link to an email address, what you're actually doing is giving the visitor an automated shortcut. When a visitor clicks an email hyperlink, the mailto code command in HTML launches the visitor's email program and creates a new message, already addressed to the email address you specify. All that's left for him to do is fill out the message and click Send.

Spam Alert

Think twice before you add a bunch of mailto links to your pages. The Web is crawling with automated email address harvesters, called spam bots or spiders, that scour text across the Web for anything resembling an email address. Addresses they find end up in the databases of the nefarious spammers who dispatch these parasites. If you post your address within a mailto link, it won't be long before your inbox is inundated.

Fortunately, there are a few things you can do to protect yourself. One solution is to use numeric or named entities for all the characters in your email address (see Selecting and Moving Text) However, many newer bots can easily crack the code.

There are other workarounds that you can research on the Web by searching for "mailto + spam." Also, check out a FrontPage Add-in called Spam Spoiler at, which masks and then recreates your email address in a way that seems to foil bots. Perhaps the best solution is to create a "Contact Us" form on your site instead. That way, visitors can enter the information on a Web page (which then gets automatically forwarded to you) and nobody emails you directly. (Read all about forms in Forms and Databases.)

To create an email link within the Insert Hyperlink dialog box:

  1. Click the Email Address button on the lower-left corner of the dialog box.

    A collection of email specific options appear in the dialog box.

  2. Within the Email address field, type in the destination email address.

    Enter only the address. FrontPage writes the rest of the necessary code for you.

    If you're creating lots of email links, you'll be happy to discover that FrontPage saves addresses you've used within the "Recently used email addresses" box. Just click to select an address.
  3. In the Subject field, type the subject line that should appear in all messages generated by the link.

    Use the subject line to help you sort your mail. For instance, you could give the link on your customer assistance page the subject line "Support Request," while you might give a link on another page the subject "Suggestion" or "New Order."

  4. Click OK.