Lesson #2: Background and Text Colors/Internal and External Links
(click here for a printable version of this page)


Vocabulary Terms:

  • Link (hyperlink): a text or image that connects to a different web page (or to a different part of the same web page) when clicked.
  • Internal Link: a text or image that connects to a different web page (or to a different part of the same web page) within your site when clicked.
  • External Link: a text or image that connects to a different web page located outside of your site when clicked.

Process Flow:

  • Create your individual web pages.
  • Copy the exact addresses of pages outside of your site.
  • Connect the pages with text or image links.

Background:

  • Web addresses are sometimes referred to as "URLs" ("Uniform Resource Locators")
  • All web addresses begin with the prefix "http://"
  • Not all web addresses are preceded by "www"
  • If you've created and saved a web page in FrontPage '98, but cannot find it, try the following:
    • Verify that you have saved the page in the appropriate folder or directory.
    • Close FrontPage '98, then immediately reopen it.

Step One: Choosing a Background Color

      In FrontPage Editor, create a new page. Go to the File main menu item, click New, then select Normal Page. A quicker way to create a new page would be to click the New Page icon, which is located near the top left corner of the screen:

      To change the background color of your page, go to the Format main menu item, then select Background:

      In the dialogue window that appears, note that you can change the color values for text, links, and the page background. For now, ignore the Background Image option; clicking the drop down arrows next to each page element will display a list of standard color options:

      Select colors by clicking with your mouse. You can define a custom color by clicking the Custom option at the bottom of the drop down list. This will display a more detailed color option window:

      Custom colors can be selected by clicking in the color screen located on the right side of this window, and then by clicking the Add to Custom Colors button.

      Confirm all color selections by clicking OK.

       

Step Two: Linking Two Internal Pages

      Create and save two separate pages. For the purposes of demonstration, make sure that you select a different light color background for each page.

      On the first page, enter the following text: This is page one. Go to page two.

      On the second page, enter the following text: This is page two. Go to page one.

      On page two, highlight the line Go to page one with your mouse. Go to the Insert main menu item, then select the Hyperlink option:

      In the dialogue window that appears, note the URL textbox. Use this box to connect your current page to another page within your website. Select the page to which you want to connect by clicking on the appropriate file name located in the box above. Confirm your selection by clicking OK:

      In the example above, the current page is going to be linked to the page named one.htm.

       

      Note that links are normally indicated by blue underlined text. You can change this property later.

      Open page one and link it to page two by following the same process:

       

Step Three: Testing Your Internal Links

      In FrontPage Editor, click the Preview tab, which is located near the bottom left corner of your screen. This option will let you to see how your page will function when viewed through a typical web browser:

      Test your internal links by clicking with your mouse. To edit your pages, make sure that you switch back to the Normal view.

       

Step Four: Creating External Links

      On the first page that you created in this lesson, enter the following text: Worcester State College:

      Highlight the line Worcester State College with your mouse:

      Go to the Inset main menu item, then select Hyperlink. In the URL textbox, enter the complete address of Worcester State College's Writing Center. Click OK to return to FrontPage Editor's main screen:

      You now have a link that connects your site to another web author's site.

      back