|Table of Contents | | Previous |
FrontPage is an HTML editor that allows you to create web pages and entire web sites. FrontPage 2000 has six different views to help with a wide variety of web site tasks.
Page (Default view used for creating a web page)
Folders (Manage and display the files and folders in the web site)
Reports (Gives an overview of the entire web site)
Navigation (Manage and display the web site's overall structure)
Hyperlinks (Display the links to and from the current web page)
Tasks (Create a to-do list for the web site)
FrontPage's navigation view allows you to quickly create a web site and restructure the web site if you change your mind. FrontPage preserves the links between pages even as you restructure your site.
To create a web site go to File/New/Web to open up the New Web Site dialog box. If you want to create a web site from a template choose a template. If you want to create your own web site structure, select One Web Page. Then in Navigation view add new pages by using a right-click to open up a shortcut menu and selecting New Page. Continue adding pages until you have created a rough structure for your web site. You can set the page titles in Navigation view but to change the actual names of the files you must use Folders view. If you want FrontPage to automatically update the hyperlinks in your web site each time you rearrange the pages in Navigation view, you must use FrontPages navigation bars. The navigation structure as set in Navigation view determines which hyperlink are put on the navigation bar, and the page titles determine the labels for the hyperlinks. Hyperlinks that are not in navigation bars are not automatically updated and must be manually readjusted. The usual procedure for adding navigation bars is to (i) add shared borders (ii) add navigation bars to the shared borders.
Click on the page or the top page of the subtree you want to move and drag to the new position. As you drag the page, FrontPage draws a gray line to possible new destinations for the page or subtree. Release the cursor to place the page or subtree in its new position. You can modify your view of the web sites structure by clicking on a pages [+] or [-] icon to expand or collapse a substructure. To view a subtree only, right-click on the top page of the subtree and select View Subtree Only from the shortcut menu. To rotate the structure, right-click anywhere in the Navigation window and select Rotate from the shortcut menu.
A shared border is a region that is common to one or more pages in a web. Inside a shared border, include items that you want to appear on each page such as navigation bars, company logos or copyright citations. You can set the borders to be shared independently for each page on the web. In Page view, on the Format menu, click Shared Borders. Click Current page or All pages. Specify the borders that you want on this page. Shared borders are added or removed depending on your settings.
A navigation bar is a set of text or button hyperlinks that a site visitor uses to get to the pages in your Web site. A typical navigation bar might have buttons to the site's home page and to each of the main top-level pages. You can add navigation bars to any page; however, to quickly set up a navigation system for your web, consider using shared borders with navigation bars. To create a navigation bar use the following steps.
To change the pages which are displayed on a navigation bar use (i) In Page view, double-click the navigation bar. (ii) Under Hyperlinks to add to page, specify the hyperlinks you want to display. To exclude a page from the navigation bars (i) In Navigation view, right-click the page you want to exclude. (ii) Click Included in Navigation Bars.
This is the view in which you do most of the work. When entering text make sure the Normal tab is active. If you want to modify the HTML code make the HTML tab active and when you want to preview the page in a browser make the Preview tab active.
FrontPage works almost like a word processor such as Word. One exception is the inserting a line break. TO insert a line break use Insert/Break or use the Shift Enter keys. The find and replace utility is accessed via Edit/Find and allows to to search and replace across the entire web site for text or HTML code. The Formatting toolbar allows you to select fonts (family, style, color), set text alignment, create bulleted and numbered lists and indent paragraphs. You can modify the bullets and numbering using Format/Bullets and Numbering (select a plain bullets style or create picture bullets). Use the style drop down menu to select headings, definitions,...
To insert an image use the Insert/Picture menu. For buttons, arrows, illustrations, animations and small photographs use GIF files. For medium and larger photographs use JPEG files. To convert image formats right-click the image and choose Picture Properties from the shortcut menu. In setting the quality of a JPEG, the higher the quality number, the more accurate and less compressed the image will be (default is 75). If you choose the GIF file format, you can make the image interlaced, which causes the picture to be downloaded in several increasingly detailed passes. This gives the viewer a quicker sense of content. To create text or a low resolution alternate for an image, right-click the image, choose Picture Properties and click the General tab. To align an image, right-click the image, select Picture Properties, click the Appearance tab and choose an alignment from the Layout section (Top, Texttop, Middle, Absmiddle, Baseline, Bottom, Absbottom, Center). The Appearance tab may also be used to add an image border, space around the image and size of the image. The preferred method for changing image size is to use image editing software. To insert a horizontal line, use the Insert/Horizontal Line menu. The Picture toolbar makes it possible to add text to an image, create thumbnails, rotate or flip images, change image contrast and brightness, crop images, make a GIF color transparent, make a image black and white, add a bevel to an image and position an image absolutely. Absolute positioning requires a newer browser and and is incompatible with Dynamic HTML.
Choose Table/Insert/Table to open the Insert Table dialog box or use the Insert Table button. Select the number of rows, columns and set the tables alignment, border size, width, cell spacing and cell padding. You can insert text or pictures into the cells of the table. To add a caption choose Table/Insert/Caption. To move a caption beneath the table right-click the caption and select Caption Properties. When working with the cells in a table you can select adjacent cells by dragging and nonadjacent cells by using the Alt-Shift key. To select the entire table use the Table/Select command. You can use the Table menu to add cells, rows, columns, delete parts of the table, split and merge cells. To make the rows the same height, select a column containing cells from each uneven row and choose the Table/Distribute Rows Evenly command. To make columns the same width select a row containing cells from each uneven column and choose the Table/Distribute Columns Evenly command. To format tables right-click the table and choose the Table Properties from the shortcut menu. The Float drop down menu lets you have the table "float" on the left or right side of text that would normally appear under the table. To format cells, select the cell or cells, right-click and choose Cell Properties. To make cells into headers, select the cells, right-click and choose Cell Properties and check Header cell in the Layout section. Color cells using the paint bucket.
Each frame you create can display a separate web page. A frames page can contain as many frames as you like. The usual strategy is to have a navigation and a contents frame. Create a frames page. Choose File/New/Page to open the New Page dialog box. Click on the Frames Pages tab to preview and select a frames page template. A blank frames page will appear with each frame containing two choices: Set Initial Page and New Page. To link the frame to an existing page, click Set Initial Page. To create a new page for the frame, click New Page. Press Ctrl S to save any new frame and the frames page itself. Show a frame in a new window. Right-click in the frame and select Open page in New Window. To return to the frames page use Folders view. Setting target frames. By default FrontPage uses the large main frame as the target for links in the other frames. To change the default target frame, right-click the page and choose Page Properties from the shortcut menu. Click the General tab and click the Change Target Frame button to open the Target Frame dialog box. Click a frame in the Current frames page thumbnail or click a listing in the Common targets window. (Page Default: display content in the main frame of current frame page, Same Frame: display content in the same frame as the link, Whole Page: replace entire frames page with a single page showing linked content, New Window: clicking a link in the frame opens up a new browser window to display the linked content, Parent Frame: used to create discussion groups). Set framed page as the home page. Rename the index.htm and rename framed page as index.htm. Formatting frames. Click on a frame to select it. To select the whole frames page, click on the pages outer border. To delete a frame, select the frame and use the Frame/Delete Frames command. Resize frames by pulling in the borders with the mouse. To split frames, click inside the frame and choose the Frames/Split Frames command to split horizontally or vertically. To make changes to to a frame, right-click inside the frame and choose Frame Properties from the shortcut menu. You can then change the Name, Initial Page, Frame size, Margins, Resizable in browser, Show scrollbars, Frames page or Style (if you have created style sheets). To create a message for non-frame browsers click the No Frames tab and edit the default message.
Forms allow you to collect information from your users via questions, interactive radio buttons, check boxes and multiple choice menus. First create a form with the desired fields. Then you can set up validation rules for checking the data. Finally decide whether you want the form results saved as a file, email, database entry or as part of a custom script. Create a form from a template. Choose New/Page and select Feedback Form. To create a form from scratch. Choose Insert/Form/Form. Add a single-line text field. Choose Insert/Form/One-Line Text Box. When the Text Box appears right-click it and choose Form Field Properties from the shortcut menu. Set the Initial value, Width and whether or not it is a password field. Add a scrolling text box. Choose Insert/Form/Scrolling Text Box. When the field appears, use the square black handles to resize it. Right-click and choose Form Field Properties from the shortcut menu to set the properties for the scrolling text box. Text Box Validation options. You can set rules for the kinds of data users can enter. Right-click the text box and choose Form Field validation. Then set restrictions for Data type, Text format, Numeric format, Data length and Data value. Adding check boxes and radio buttons. Choose Insert/Form/Check Box. When the check box appears, right-click and choose Form Field Properties. For radio buttons, choose Insert/Form/Radio Button. When the radio button appears, right-click and choose Form Field Properties. Adding a drop down menu. Choose Insert/Form/Drop Down menu. When the drop-down menu appears, right-click and choose Form Field Properties. Your options at this point include Choice list, Add, Modify, Remove, Move Up/Move Down, Height, Tab order, Allow multiple selections and Validate. Adding push buttons. Choose Insert/Form/Push Button. When the button appears, right-click and select Form Field Properties. Name and label the button, select the button type (reset, submit) and set the tab order. Create a confirmation page. Allows users to recheck their data before submitting. Choose File/New/Page and select Confirmation Form. Save the confirmation form using Ctrl S. To change the field name in an existing confirmation field, right-click it and choose Confirmation Field Properties from the shortcut menu. To add a new confirmation field, choose Insert/Component/Confirmation Field. When the dialog box opens, type in the name of the form field you want to use in the text box. Save form results to a file. Right-click the form and select Form Properties. Choose Send to in the Where to store results section. Select a file name and pathname for the results. By default FrontPage selects a file in the web sites Private folder. Click the Options button to open the Options for Saving the Results of a Form dialog box. Use the File format drop-down menu to select a file format. Save form results to as email. Right-click the form and select Form Properties. Choose Send to in the Where to store results section. Type in an email address for where you want the results to be sent. If you don not want the results saved to a file, delete the filename from the textbox. Click the Options button to open the Options for Saving the Results of a Form dialog box. Use the E-mail format drop-down menu to select an email format. If your form includes a field that collects the user's email address, check Form field name and enter the emails' field name in the Reply-to line text box. Save form results to a database. Right-click the form and select Form Properties. Choose Send to database in the Where to store results section. Click Options and when the Options for Saving Results to a Database appears, click the Database results tab. Click Add Connection to link to your web sites database. Save form results using a custom script. In folders view, find the folder containing your custom script. Right-click the folder and choose Properties. When the dialog box appears, check Allow scripts or programs to be run. Switch back to page view, right-click the form and choose Form properties. Choose Send to other and select ISAPI, NSAPI, CGI or ASP script. Click Options and type in the URL for the script. Learn how to construct CGI scripts.
FrontPage supports three basic types of multimedia.
Videos or animations
Java based banner ads, ticker-tape marquees and visitor-driven hit counters
Moving type and layers.
Insert a video. Choose the Insert/Picture/Video to open the Video dialog box. Select a video file. Save the page and the video/animation (Ctrl S). Click Rename if you want to change the name and Change Folder if you want to change the folder. To set loops for a video/animation right-click the video and choose Picture Properties. To include a play button and a slider, click on Show Controls in Browser. Use the Repeat section to set how many times the video will play. To add a page background sound, right-click on the page and choose Page Properties. Click the General tab of the Page Properties dialog box. Use the Browse button within the Background sound section to locate a sound file. Add a banner ad. Choose Insert/Component/Banner Ad to open Banner Ad Manager Properties dialog box. Set dimensions for the banner images, select a transition effect, choose the time between rotations, select a URL for the banner ad (in case users click on the add) and locate the images you want displayed in the banner ad. Save the page (Ctrl S) to insert the banner ad into the web page. To change a banner ad, right-click the banner to open the Banner Ad Manager Properties dialog box. Add a page hit counter. Choose Insert/Component/Hit Counter to open the Hit Counter Properties dialog box. Choose a Counter Style or pick Custom Picture to navigate to your own image. Check the reset counter to have the counter start with a particular number. Check Fixed number of digits if you want the counter to roll over after a certain number of hits. To change a hit counter, right-click the counter to open the Hit Counter Properties dialog box. Add a marquee. Choose Insert/Component/Marquee to open the Marquee Properties dialog box. Enter the text, set the direction and speed, behavior, alignment, size, how often it should repeat and background color. Click OK and save the page (Ctrl S). To change a Marquee, right-click the marquee to open the Marquee Properties dialog box.
Style sheets come in three forms: external style sheets which
control styles across multiple pages or the entire web site, embedded style
sheets which control the style for individual pages and inline styles which
control individual page elements. Taken together they are referred to as
cascading style sheets. If a single web page has all three types of style
sheets, the order of precedence is (i) inline (ii) embedded and (iii)
external. Activate CSC style sheets and DHTML. Choose
Tools/Page Options and use the Browser versions drop-down menu to select 4.0
browsers and later. In the technologies section make sure that CSS 1.0 and
CSS 2.0 and make sure Dynamic HTML is checked. Create an embedded style
sheet. Choose Format/Style to open the Style dialog box. Click
New. Choose one of the Format drop-down menu items - Font, Paragraph,
Border, Numbering or Position and use the dialog box to choose properties for
your new style. Once you finish making choices for Font, move on to
Paragraph, Border,... . To edit embedded style sheets, choose Format/Style
and find the user defined style you have created. Select Modify and make
your changes. Create external style sheets. Choose
File/New/Page and click the style sheets tab. To create a style sheet from
scratch use the Normal Style Sheet, otherwise choose one of the given
templates. Save the page with a .css extension. To open the
style sheet, double-click its icon in folders view. Choose
Format/Style. Select an HTML tag you wish to change and click
Modify. When the Modify Style dialog box appears click Format.
Choose Font, Paragraph, Border, Numbering r Position and use the dialog box to
modify the HTML tag. If you want to modify aspects of the HTML tag, use
the Format drop-down menu to make additional choices. Repeat the process
for the other HTML tags you wish to modify. Edit external style sheets.
to open the style sheet, double-click its icon in folder view. When the
Style dialog box appears click Modify. Multiple fonts. Enter
these directly into the style sheet ie)
h1, h2 { color: #000000; font-weight: bold; font-family: Book Antiqua, Arial, helvetica, sans-serif; }.
Linking to external style sheets. Open the page you want to link to
the external style sheet. Choose Format/Style Sheet Links to open the Link
Style Sheet dialog box and choose the pages you want linked to the external
style sheet. When the Select Hyperlink dialog box appears, navigate to the
style sheet you want to use. To remove a link to an external style sheet,
open up the page and choose Format/Style Sheet Links. Use the remove
button. Deleting style sheets. This process returns HTML tags
to their standard definitions. In page view choose Format/Style.
Select the style you want to remove and click Delete.
DHTML can be used to move text around your pages and make graphics spiral and trigger events as visitors mouse around your web site. Make the DHTML effects toolbar visible by choosing Format/Dynamic HTML Effects. Select the page element to which you want to apply DHTML. Use the toolbar's On drop-down menu to select when the effect will be applied. Use the toolbar's Apply drop down menu to select which effect will be applied. Depending on the effect selected, use the Choose Settings drop-down menu to further define the effect. To add page transitions choose Format/Page Transition. Use the Page Transitions dialog box to choose when the transition effect is to be applied, which transitions effect is to be applied and the duration of the transition of the transition effect. To remove transition effects choose Format/Page Transition and select No Effect.
Import a database such as Microsoft Excel(.xls), Microsoft Access (.mbd) or tab separated text (.txt) into the web. Create a new database connection. Choose Insert/Database/Results to open the Database Results wizard. Choose Use a new database connection and click create. When the Web Settings dialog box appears, click the Database tab and click Add to open the New Database Connection dialog box. Use the Type of connection section to choose the type of database you will be using. Browse to locate the database you want to use. Click Next and the second screen of the Database Results wizard appears. Select a Record source or create a custom query (SQL) and click Next to move to the third screen. Choose Edit list if you want to exclude some fields. When the Displayed Fields dialog box appears, compare the Available fields list and the Displayed fields list. Use the arrow buttons to control which fields are displayed. Click Next to move to the fourth screen. Decide how to display the results and click Next to move to the fifth screen. Decide whether to Display records together or to split records into groups. Click Finish and you will return to the page where the database results are displayed. Verify a database connection. Choose Tools/Web Settings to open the Web Settings dialog box. Click the Database tab and unverified connections will be marked with a question mark and verified connections will be marked with a checkmark. Remove a database connection. Choose Tools/Web Settings to open the Web Settings dialog box. Click the Database tab, choose a database connection and click Remove.
The web allows you to jump from file to file anywhere in the world. Hyperlinks come in several forms including links to other files, links to other spots within a document, links embedded in pictures and links to send email. Absolute links show a files full web address such as http://www.vuu.edu whereas relative links include only the file name and the folder such as Markets/domestic.html. You must use an absolute links any time you link to a file not on your web site. This is called an external link. You should use relative links within your own web site to reduce the amount of hyperlink maintenance required.
Create a hyperlink to a page in a web. In Page view, type the text or image you want to use as a hyperlink and then select it. Click the Hyperlink icon. Navigate to the web in which the destination page or file is located, and then select the page or file. Create a hyperlink to the WWW. In Page view, type the text or image you want to use as a hyperlink and then select it. Click Hyperlink. Click World Wide Web. In your Web browser, browse to the page that you want, and then press ALT+TAB to switch back to Microsoft FrontPage. The location of the page you visited will be displayed in the URL box. Create a hyperlink to send an e-mail message. You can create a hyperlink that opens and addresses an e-mail message to the address you specify. Note Not all Web browsers support hyperlinks to e-mail addresses. In Page view, type the text you want to use as a hyperlink and then select it. Click the Hyperlink button. Click the E-Mail button. Type the e-mail address to which you want the message sent. Modify links. To edit a link, right-click on the link and choose Hyperlink Properties from the shortcut menu. To update links choose Tools/Recalculate Hyperlinks. FrontPage will the check internal and external links. Hyperlink colors. 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 or Visited hyperlink — a hyperlink that has already been followed. (i) In Page view, right-click the page, click Page Properties on the shortcut menu, and then click the Background tab. (ii) In the Hyperlink, Visited hyperlink, and Active hyperlink boxes, select the colors you want to use.
A bookmark is a location or selected text on a page that you have marked. You can use bookmarks as a destination for a hyperlink. If a location (rather than text) is bookmarked, the bookmark is indicated by an icon. If text is bookmarked, the text is displayed with a dashed underline. 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. On the Insert menu, click Bookmark. In the Bookmark name box, type the name of the bookmark (spaces are allowed). To link to a bookmark, select the text you want to link to the bookmark, right-click and select Hyperlink from the shortcut menu.
You can create a hyperlink to a Microsoft Office document, such as a document created in Word, Excel, or PowerPoint. When the site visitor clicks the hyperlink, the Web browser opens the corresponding application or viewer, and then displays the document. Some Web browsers display the document inside the browser window; other browsers open a separate window. Note: Before you create a hyperlink to a PowerPoint animation, you must add the Microsoft PowerPoint Animation ActiveX control, which is installed with PowerPoint. In Page view, type the text you want to use as a hyperlink and then select it. Click Hyperlink. Select the Office document.
You can add hotspots to graphics such as pictures and animated GIFs. A hotspot is an invisible region on a graphic to which you have assigned a hyperlink. In Microsoft FrontPage, hotspots can be shaped as rectangles, circles, or polygons. A graphic with one or more hotspots is called an image map.
You can highlight hotspots on a graphic, for example if it's hard for you to see the hotspot outlines that are superimposed on the graphic. (i) In Page view, click the graphic. (ii) On the Pictures toolbar, click Highlight Hotspots. Click this button again to display the graphic without highlighting. You can edit the URL of a hotspot, or move, resize, or delete it. (i) In Page view, click the graphic to view the hotspots. (ii) Click a hotspot (to edit the URL for a hotspot, double-click it, to move the hotspot, click the hotspot and drag it to a new position, to resize the hotspot, click and drag the selection handles. Or, press the arrow keys, to delete a hotspot, press DELETE).
Choose Insert/Component/Hover Button. Use the Hover Button Properties dialog box to select the buttons text, font, URL link, color, hover effect and size. To add a sound or custom graphic to a hover button, click on the custom button in the Hover Button Properties dialog box.
Hyperlinks view. In hyperlinks view external links are marked by a globe, internal links are marked by a plain page and email links are marked by an envelope. Hyperlinks view presents a visual "map" of the hyperlinks to and from any page in your web. You can customize Hyperlinks view to show page titles, links to and from pictures, and so on. On the Views bar, click the Hyperlinks icon to switch to Hyperlinks view: Right-click the background and select Show Page Titles, Hyperlinks to Pictures, Repeated Hyperlinks, Hyperlinks Inside Page or Move to Center. Broken hyperlinks. To see the number of broken hyperlinks in your web, on the View menu, point to Reports, and then click Site Summary. In the Broken hyperlinks row, the Count column list the number of broken hyperlinks in your web. To see a detailed list of the broken hyperlinks in your web, on the View menu, point to Reports, and then click Broken Hyperlinks.
Use folders view to handle file management tasks such as adding, deleting and renaming files and folders.
This view makes it easier to get your web site ready to publish. You can also mark the pages you don not want to publish yet. Check and fix your site. Choose View/Reports/Site Summary. If the summary lists problems such as broken hyperlinks, double-click that line to see a list of the problem pages. To fix an individual page, double-click the page and an appropriate dialog box will appear. Publishing status. Choose View/Reports/Publish Status to see the publishing status of all of the web site's files. To change a pages publishing status, while in folders or reports view, right-click the page whose publishing status you want to change and choose Properties from the shortcut menu. Click the Workgroup tab and check Exclude this file when publishing the rest of the web.
This view is designed to help you manage web site workflow. It is possible to assign tasks to files or to create more general tasks not linked to files. Link files to a task. Right-click on the file in folders view and choose Add Task to open the New Task dialog box. Create task not linked to a file. In any view choose Edit/Task/Add Task to open New Task dialog box. Delete a task. In tasks view, right-click the task you want to remove and choose Delete from the shortcut menu.
Adding Meta Tags for search engines. Choose File/Properties to open the Page Properties dialog box. Click the Custom tab and then click Add in the User variables section. Type keywords into the user Meta Variable dialog box. To publish your web site (i) Choose File/Publish Web to open the Publish Web dialog box. (ii) Click options to open up an expanded set of options. (iii) Decide which pages you want to publish (iv) Type in the location of your web server. Note you can only use http:// if your web server contains FrontPage Server Extensions, otherwise you must use ftp:// plus the rest of the pathname for your web server. (v) Click Publish and FrontPage will use your default internet access to connect to the web server. (vi) Type in your user name and password. (v) There will be pauses as FrontPage compiles a list of pages that need to be published and then uploads the appropriate pages.
| Table of Contents | | Previous |