To format a background color, choose one of the following:

1.  In Page view, from the toolbar select Format, then Background.
2.  In the Color section of the dialog box that opens, choose the standard or custom color you prefer.
3. Click the OK button.

or

1. In Page view, right-click the page, click Page Properties on the shortcut menu.
2. In the Page Properties dialog box, click the Background tab.
3. In the Color section of the dialog box that opens, choose the standard or custom color you prefer.
4. Click the OK button.

To use a picture as a background choose one of the following:

1. In Page view, from the toolbar select Format, then Background.
2. Under Formatting, select the Background picture check box.
3. Browse to find the image on your computer.
4. Click the OK button.

or

1. In Page view, right-click the page, click Page Properties on the shortcut menu.
2. In the Page Properties dialog box, click the Background tab.
3. Under Formatting, select the Background picture check box.
4. Browse to find the image on your computer.
5. Click the OK button.

Using a watermark as the background

A watermark is a graphic that appears in the background of web pages but does not scroll as the page scrolls.

1. In Page view, from the toolbar select Format, then Background.
2. Under Formatting, select the Background picture check box and then the Watermark check box.
3. Browse to find the image on your computer.
4. Click the OK button.

or

1. In Page view, right-click the page, click Page Properties on the shortcut menu.
2. In the Page Properties dialog box, click the Background tab.
3. Under Formatting, select the Background picture check box and then the Watermark check box.
4. Browse to find the image on your computer.
5. Click the OK button.

Adding background sound

When a background sound is added, the sound plays as the page is opened. Use this feature sparingly as many visitor are bothered by constant music or sound.  The sound may be stopped by pressing the stop button in the Internet Explorer tool bar. This feature is not supported by Netscape browsers.

1. In Page view, from the toolbar select Format, then Background.

2. Click the General tab, locate the Background sound area, then Browse to locate the sound file.
3. Do one of the following:
   • To play the sound continuously, select the Forever check box.
   • To play the sound a specified number of times, clear the Forever check box, and enter the number of times you want the sound to play in the Loop box.

or

1. In Page view, right-click the page, and then click Page Properties on the shortcut menu.
2. Click the General tab, locate the Background sound area, then Browse to locate the sound file.
3. Do one of the following:
   • To play the sound continuously, select the Forever check box.
   • To play the sound a specified number of times, clear the Forever check box, and enter the number of times you want the sound to play in the Loop box.

Creating tables

1. Position the insertion point where you want to insert the table.
2. On the Table menu, point to Insert, and then click Table.
3. In the Rows box, type the number of rows you want.
4. In the Columns box, type the number of columns you want.
5. In the Alignment box, select the position for the table on the page.
6. In the Border size box, type the width you want for the table border in pixels. If you do not want a border, type 0.
7. To change the cell padding of the table (the space between a cell's border and content), enter a number in the Cell padding box.
8. To change the cell spacing of the table (the space between cells), enter a number in the Cell spacing box.
9. To change the width of the table, do one of the following:
   • Select In pixels, then type the width you want the table to be in pixels.
   • Select In percent, then type a percentage of the screen width you want the table to be.

Using tables for page layout

When you lay out text and graphics on a page, you can use a table to arrange them. Tables are supported by virtually all Web browsers and are an easy way to lay out your pages and to keep the appearance uniform in all browsers.  Failure to use tables, especially when positioning images, can cause a discrepancy between the appearance of your page in design mode and published pages.

A hyperlink is a link from one web page to another web page, to a place on the same page, or to a file. When a hyperlink is clicked, the destination is displayed in a Web browser. The destination is most often another web page, but it can also be a picture, a multimedia file, a Microsoft Office document, or an e-mail address.

A hyperlink can be text or a picture. A text hyperlink is a word or phrase that has been assigned a destination. A picture hyperlink is a image that has been assigned a destination.

Linking to an Existing File, Web Page, or Email Address

1. In Page view, select either text or a picture.  (If you do not select text or a picture, the destination is displayed as the hyperlink text.)
2. From the toolbar click Insert, then Hyperlink.
3. Under Link to, click Existing File or Web Page or Email Address depending on the type of file that you are linking to.
4. Do one of the following:
   
   If you are linking to an existing file or web page, Browse to find the web page or file.  You may also simply enter the url.
   
   If you are creating an email link, enter the email address.  You may also optionally enter a subject for the email.
    
5. Click the OK button.
    

Linking to a place on a page

First you must create a bookmark.  Bookmarks are a location or selection of text in a file that you name for reference purposes. Bookmarks identify a location within your page that you can later link to. You can use one or more bookmarks on a page. For example, add a bookmark to each main heading on a page. To create a bookmark:

1. In Page view, position the insertion point where you want to create a bookmark, or select the text to which you want to assign the bookmark.
2. On the Insert menu, click Bookmark.
3. In the Bookmark name box, type the name of the bookmark.
4. Click the OK button.

Now you can link to the bookmark as follows:

1. Select either text or a picture.
2. Click Insert Hyperlink .
3. In the dialog box, select the page that contains the bookmark, and then click Bookmark.
4. In the Select Place in Document box, click the bookmark you want to use as the destination, and then click OK.

Hyperlinks with rollovers effects

You can choose the colors that a Web browser will use for displaying hyperlinks. You can select three colors to use for a hyperlink, depending on its status:

• Hyperlink — a hyperlink that has not been selected
• Active hyperlink — a hyperlink that is currently selected
• Visited hyperlink — a hyperlink that has already been followed

Hyperlink color can be set as follows:

1. In Page view, right-click the page, and then click Page Properties on the shortcut menu.
2. Click the Background tab.
3. In the Hyperlink, Visited hyperlink, and Active hyperlink boxes, select the colors you want to use.
4. Click the OK button.

You can add also effects to hyperlinks so that when the cursor is moved over the hyperlink, its font changes in size, style, intensity, or effect.

In Page view, do the following:

1. Right-click the page, click Page Properties on the shortcut menu, and then click the Background tab.
2. Under Formatting, select the Enable hyperlink rollover effects check box.
3. Click Rollover Style.
4. Set the rollover properties for hyperlinks on the current page.
5. Click the OK button.

Setting target windows

When you click a hyperlink on a page, the page that the hyperlink points to usually opens in the same window. At times you may want the destination of the hyperlink to open in a new window. 

To set a hyperlink to open in a new window, follow the steps 1-4 above to create a hyperlink. Then:

1. Click the Target Frame button.
2. Select New Window from the Common Targets list.
3. Click OK to close the Target Frame dialog box.
4. Click OK to close the Insert Hyperlink dialog box.

1. In Page view, position the insertion point where you want to insert a graphic.
2. On the Insert menu, point to Picture, and then click From File or from Clip Art
3. Browse to the graphic you want from your local file or search the Clip Art library.
4. Select the file, and click Insert.

Note   When you save the page, Microsoft FrontPage prompts you to save the graphic to your web site folder. You may rename the image files, if you choose, at that time.

Adjusting image brightness

Note:  To display the Pictures toolbar, point to Toolbars on the View menu, and then click Pictures.

1. In Page view, click the graphic.
2. On the Pictures toolbar, click More Brightness  or Less Brightness  to increase or decrease the brightness of the graphic.

Adding transparency to images

Adding transparency to an image allows the background to show through a specified color.  This tool is used most often to remove the white box that appears around some images when they are displayed on a colored background.

Note:  To display the Pictures toolbar, point to Toolbars on the View menu, and then click Pictures.

1. In Page view, click the graphic.
2. On the Pictures toolbar, click Set Transparent Color .
3. Click the color in the graphic that you want to make transparent. FrontPage may convert some graphic file formats to GIF before the transparent color can be set.

Adding text to images

Note:  To display the Pictures toolbar, point to Toolbars on the View menu, and then click Pictures.

1. In Page view, click the graphic.
2. On the Pictures toolbar, click Text . Microsoft FrontPage may prompt you to save it in GIF format, because text is not supported on JPEG graphics.
3. Type the text into the box that is displayed on the graphic.
4. Format the text — for example, you can change the font or color, as you would with other text.
5. You can also do one or more of the following:
   • Resize the text box by clicking and dragging the resize handles.
   • Move the text box by clicking inside the box and dragging it.

Rotating and flipping images

Note:  To display the Pictures toolbar, point to Toolbars on the View menu, and then click Pictures.

In Page view, do one or both of the following:

Rotate a graphic

1. Click the graphic.
2. On the Pictures toolbar, click Rotate Left  to rotate the graphic 90 degrees counterclockwise. Click Rotate Right   to rotate the graphic 90 degrees clockwise.

Flip a graphic

1. Click the graphic.
2. On the Pictures toolbar, click Flip Vertical  to turn the graphic upside down. Click Flip Horizontal  to create a mirror image.

Cropping pictures

Note:  To display the Pictures toolbar, point to Toolbars on the View menu, and then click Pictures.

1. In Page view, click the graphic.
2. On the Pictures toolbar, click Crop .
3. A cropping box appears on the graphic. By clicking and dragging the handles on the box, resize it to include the part of the graphic that you want to keep.
4. Click Crop again to remove the area outside of the cropping box.

Labeling images with alternate text tags

Alternate text tags can be used to provide information or merely a label for an image. Most  Web browsers also display alternative text while the graphic is downloading and when the mouse pointer is moved over the graphic.

1. In Page view, right-click the graphic, click Picture Properties on the shortcut menu, and then click the General tab.
2. In the Text box, under Alternative representations, type the alternative text for the graphic.
3. Click the OK button.

Using images as bullets

1. In the Format menu, select Bullets and Numbering.
2. Select the Picture Bullet tab.
3. Select the Specify Picture checkbox and browse for the image file on your hard drive.
4. Click the OK button.

Creating image maps

A graphic with one or more hot spots is called an image map. A hot spot is an invisible region on a graphic to which you have assigned a hyperlink. The image map usually gives cues about where you should click.

Note:  To display the Pictures toolbar, point to Toolbars on the View menu, and then click Pictures.

In Page view, do one of the following to add a hot spot to a graphic.

1. Click the graphic.
2. On the Pictures toolbar, click the Hotspot button corresponding to the shape you want. You may choose from either a Rectangular, Circular, or Polygon Hotspot.  Note:  To draw a polygon, click where you want the first corner of the polygon to be, click to place each corner of the polygon, and then double-click to finish it.
3. On the graphic, draw a rectangle, circle, or polygon, depending on the shape you chose while holding down the mouse button. When you release the mouse button, the Insert Hyperlink dialog box opens.
4. Under Link to, click Existing File or Web Page.
5. Select the page or file where you want the hot spot to link.
6. Click OK to insert the hyperlink.
7. Repeat for each hotspot that you want to create.

Embedded, automatic slide show of images

The Banner Ad Manager web component can be configured to create an embedded, automatic slide show of images. All pictures in the slide show must be the same size.

In Page view, in the Normal pane, position the insertion point where you want to create the slide show.

1. On the Insert menu, click Web Component.
2. In the left pane, click Dynamic Effects.
3. In the right pane, double-click Banner Ad Manager.
4. Click the Finish button.
5. For each picture you want to display in the slide show, click Add, and then select the picture.
   The list in the Pictures to display box shows the pictures you added and the sequence in which the pictures will be displayed.
6. To change the sequence, select the picture in the list, and then click Move Up or Move Down.
7. In the Transition effect box, select the effect you want to use between pictures.
8. You may optional create a hyperlink from the slide show.  In the Link to box, type a URL. Or, click Browse to locate the destination page or file for the hyperlink. If you don't want to create a hyperlink, leave the Link to box blank.
9. Click the OK button.

 DHTML Effects

Page transitions

1. In Page view, open the page for which you want to display the transition effect. 
2. On the Format menu, click Page Transition.
3. In the Event box, click the the event that will trigger the transition effect. For example, click Page enter to display the transition effect when a site visitor browses to the page for the first time.
4. In the Transition effect box, click the type of transition effect to use when the page is displayed or exited.
5. In the Duration box, type the amount of time that you want the transition effect to last.
6. Click the OK button.

Marquees

1. In Page view, click where you want to create the marquee, or select the text that you want to display in the marquee.
2. On the Insert menu, click Web Component.
3. In the left pane, click Dynamic Effects.
4. In the right pane, double-click Marquee.
5. In the Text box, type the line of text you want the marquee to display. If you selected text on the page in step 1, the Text box contains the selected text.
6. Select the Direction, Speed, Behavior, Size, Repetitions, and Background Color.
7. Click the OK button.

Hover buttons

1. In Page view, in the Normal pane, position the insertion point where you want to create a hover button.
2. On the Insert menu, click Web Component.
3. In the left pane, click Dynamic Effects.
4. In the right pane, double-click Hover Button.
5. In the Button text box, type the text label for the hover button. If you want to use a custom picture that already contains a text label, clear the default value.
6. In the Link to box, type the URL of the page or file you want to display when the hover button is clicked. Or, click Browse to locate the page or file.
7. Set the text label   Type the label you want to use in the Button text box. If you type a long label, adjust the Width of the hover button.
8. Set the default hyperlink   In the Link to box, type the URL to the page or file you want to display when the hover button is clicked. Or, click Browse to locate the page or file.
9. Set the color of the button when it is initially displayed on the page   Select the color you want to use.
10. Set the background color of the button   Select a background color for the hover button.
11. Set the hover effect   Select the visual effect that will be displayed when a site visitor points to the button.
12. Set the color of the hover effect   Select the color for the hover effect.
13. Set the size of the hover button   Modify the settings in the Width and Height boxes, in pixels.

Text animation

1. Select the text you want to animate, and then on the Format menu, click Dynamic HTML Effects. This will display the DHTML Effects toolbar.
2. In the On box, click the down arrow, and then select the event that will trigger the animation. The events listed in the On box are as follow:
           

   Click:   Starts the animation when the text is clicked with the left mouse button once. Double click:   Starts the animation when the text is double-clicked with the left mouse button. Mouse over:   Starts the animation when the pointer rests on or moves over the text.  Page load:   Starts the animation when the page is loaded in a browser.

3. In the Apply box, click the down arrow, and then select the type of animation effect you want to occur.

   The effects listed in the Apply box depend on the type of page element you selected and on the type of event you selected.

   Effects include:

   Fly out, Fly in, Drop in by word, Elastic, Hop, Spiral, Wave, Wipe, Zoom  are effects that move the text in some way. Formatting effects changes the appearance of the text, such as changing a font color or applying a border effect.

4. In the Choose Settings box, click the down arrow, and then choose the settings for the effect.  The settings listed depend on the type of page element you selected and the type of effect you selected in the Apply box.

Mouse-over images

Note:  Two images of the same size are need for this effect.

1. Select the image to which you want add the mouse-over effect, and then on the Format menu, click Dynamic HTML Effects. This displays the DHTML Effects toolbar.
2.  In the On box, click the down arrow, and then select the mouse over event.
3. In the Apply box, click the down arrow, and select Swap picture.
4. In the Choose setting box select Choose picture then browse to find the picture to swap.

Adding information to META tags helps search engines find and index your page.  A META tag supplies information about the page, such as the author, a publishing date, or a set of keywords that identify the page, but does not affect its appearance.

Keywords are the most important meta tags to add. You can add keywords to any pages in your site to make them more accessible to search engines.

1. On the File menu, click Properties, and then click the Custom tab.
2. Under User Variables, click Add.
3. In the Name box, type keywords.
4. In the Value box, type the index keywords for your site, using commas to separate words.
5. Click OK twice.

Using pre-formatted page templates

Microsoft FrontPage provides many page templates that provide easy layout options.  Before you spend time creating unique table layouts, check the page template library to see if there is a layout that would be of use to you.

In Page view, do one the following:

1. On the File menu, point to New, and then click Page or Web.
2. In the New Page or Web task pane, under New from Template, click Page Templates. 
3. Click the icon for the template you want to use, and then click the template. A thumbnail of that template and a brief description is displayed under Preview. (Note:  Some page templates can only be used on servers with Microsoft FrontPage extensions.)
4. Click OK and Microsoft FrontPage will open a new page based on the template.

Creating an FAQ page

FAQ stand for "Frequently Asked Questions."  Microsoft FrontPage provides a page template for an FAQ page. It contains preformatted bookmarks, hyperlink, and dividers that make it very easy to set up a FAQ for your website.

1. On the File menu, point to New, and then click Page or Web.
2. In the New Page or Web task pane, under New from Template, click Page Templates. 
3. Click the FAQ icon.
4. Click OK and Microsoft FrontPage will open a new FAQ page template.