IVCC's FSI 2000--Session 2: FrontPage 2000 Tricks and Tips

FrontPage 2000: Tricks and Tips

In this workshop, we will highlight a few of the things you can do in FrontPage 2000 to enhance your web pages.

We will cover the following:

Inserting a timestamp ("Page last updated . . .")
Inserting a hit counter
Inserting a horizontal line
Using bullets and numbering
Decreasing and increasing indentation
Inserting a bookmark and internal links
Making an image a hyperlink and creating image "hot spots"
Using a template to create multiple pages of the same design
Using tables to format web pages

Inserting a timestamp
A timestamp is a FrontPage WebBot that automatically presents viewers with the date when you last updated a web page.

To insert a timestamp, put the cursor where you would like the timestamp to appear on your page. Then pull down the "Insert" menu and choose "Date and Time."

You can then choose how you want the timestamp to appear on your page.

(The timestamp records the last time you opened the web page in FrontPage.)

Inserting a hit counter
A hit counter automatically records and presents the number of times that a web page has been accessed.

To insert a hit counter, put the cursor where you would like the hit counter to appear on your page.

Then pull down the "Insert" menu and click on the down arrows for more options. Click on "Hit Counter."

You can then choose how you would like the hit counter to appear.

(The hit counter measures how many times your page has been opened in a web browser. It does not measure the number of unique visitors.)

Inserting a horizontal line
Horizontal lines are often used in web pages to help break up text or to divide a web page into sections.

To insert a horizontal line, put the cursor where you would like the line to appear on your page.

Then pull down the "Insert" menu, and click on "Horizontal Line."

Right mouse-clicking on the line will give you the "Horizontal Line Properties" option, which allows you to customize the line.

Using bullets and numbering
People read from computer screens more slowly than they read printed pages and do not seem to comprehend text on the screen as readily as they comprehend printed text. Therefore, when possible, you should avoid presenting large blocks of uninterrupted text. To increase readability, you should break up your text, in part with numbering and bullets.

To insert bullets or numbering, put the cursor where you would like the first bullet or number to appear on your page.

Then click on the bullet or numbering icon in the upper right of the screen.

To change the formatting of the bullets or numbering, just pull down the "Format" menu and choose "Bullets and Numbering."

(The University of Washington provides an excellent example of how the Hippocratic Oath might be presented on a web page to increase readability.)

Decreasing and increasing indentation
Tabs do not work the same in FrontPage as they do in word processors, but FrontPage includes a feature that allows you to easily decrease or increase indentation.

Just put your cursor where you would like to increase or decrease the indentation, and click on the "Increase Indent" or "Decrease Indent" icons.

Inserting a bookmark and internal links
With bookmarks and internal links, you can have a link within a web page take viewers to another part of the same page.

First, put the cursor where you would like the bookmark to appear on your page, where you would like viewers to go in your page after they click on the internal link.

Inserting Bookmark 1

Second, pull down the "Insert" menu, click the down arrows for more options, and choose "Bookmark."

Inserting Bookmark 2

Third, you need to name the bookmark. You should give it a name that will allow you to remember its location in the page. For example, you might place a bookmark at the top of your page and name it "Top."

To insert an internal link to the bookmark, just highlight the text in your page that you want to serve as a hyperlink (such as the word "Top.")

Then click on the Hyperlink icon in the upper right on the screen.

Hyperlink

When the hyperlink box opens, instead of typing a URL for a web page, click on the "Bookmark" option and choose the bookmark that you want to link. Click "OK," and you have created an internal link to another location in your page.

Making an image a hyperlink and creating image "hotspots"
Both images and parts of an image can be hyperlinks. "Hotspots" are parts of an image that serve as hyperlinks to other web pages or to other parts of the page.

Turning an image into a hyperlink is easy. Just left mouse-click on the image and then click on the hyperlink icon in the upper right screen. When the hyperlink box appears, type or copy the URL into the "URL" box and click "OK."

To create a hotspot on an image, left mouse-click on the image and then click on one of the hotspot icons at the bottom of the screen.

On the image, left mouse-click where you would like the hotspot to begin and hold down the left mouse button as you move the cursor over the image area. Once you release the mouse button, the hyperlink box will appear.

When the hyperlink box appears, type or copy the URL into the "URL" box and click "OK." When viewers click on the image hotspot, they will go to the hyperlinked page.

Using a template to create multiple pages of the same design
If you have a series of web pages, you might want to use the same design for all pages in the series. There is an easy way to do this.

If you have designed a page and want to use that same design for all pages in a series, simply give the page a name and save it. Then, use the "Save As" option in the "File" menu to give the page a new name.

Your original page should remain unchanged, and you can then make changes to the newly named page to create a new page with the same design as the original.

Using tables to format web pages
Tables are vital to the proper formatting of web pages, and, in some cases, the only way you can format images and text on your pages the way you want to is through the use of tables. (This page alone uses 30 tables!)

If you right mouse-click in a table, you will see a menu with several options, including "Table Properties" and "Cell Properties."

Choosing "Table Properties" will give you the box below.

Alignment indicates where the table will appear on the page.

Float allows text to appear to the left or right of the table. Choosing "default" does not allow any text to appear on either side of the table.

Cell Padding is the space between the table borders and any text or images within the table.

Cell Spacing is the space between the inner and outer borders.

Border Size refers to the width of the table borders. Important! Choose "0" for "Size" if you do not want the borders to appear to viewers.

Border Color allows you to determine the color of the borders.

Background Color allows you to change the background colors of the table. "Automatic" indicates that the table background will be the same as the page background.

Use Background Picture allows you to use an image as the background for the table.

Important! You should Specify Width for the table by entering the number of pixels for the table (typically between 600 and 700 pixels for a screen-width table.) If you choose "percent," your table can appear with different widths on different computers.

You can leave Specify Height unchecked and blank. The height of the table will adjust automatically depending on what you put into the table.

You can put tables within other tables. Just put your cursor where you would like the new table to appear and choose "Insert Table" from the "Table" menu, being careful to make the width of the new table less than the width of the original table.

Just as you can customize tables, you can customize cells within tables by choosing Cell Properties.

Horizontal and Vertical Alignment refers to where text and images will appear within the cell.

Specify Width allows you to set the width of the cell. For cells, you can use percent, but make sure to set the correct percentages for all cells within a table.

You can leave Specify Height unchecked and blank.

You can determine the border colors and background colors (or background image) for cells just as you can for tables. Using Automatic for Background Color will cause the cell to have the same background color as the table.

Note: Tables and cells must have something in them for some of the settings (such as Background Color) to take effect. When you have no text or images in a cell, just put in a space if you find that some cells do not appear as they should when you preview the page in a web browser.