Getting Started With FrontPage

Definitions

• Directory  A file that contains information about other files including name, location, size, and date last modified.  Another name for a directory is a folder.  A directory always contains these special files:
  
  . representing the current directory
  .. representing the parent directory
  / representing the root directory
  ~ representing the home directory
  
   
• Extension  A dot and one or more letters added to the end of a file name that describes the purpose of the file.  For example, the extensions .htm or .html indicate that the file is meant to be displayed as an HTML file.
   
• File  A collection of data stored on the computers disk drive.
   
• Folder  See Directory.
   
• IDE (Interactive Development Environment)  An interactive Windows environment for creating computer source code for a markup language like HTML or for writing source code for a programming language like Java or C++.
   
• HTML (Hypertext Markup Language)  A text markup language invented in 1989 by Tim Berners-Lee at CERN for displaying World Wide Web pages.
   
• Hyperlink  Text or other locations on a Web page that load other Web pages when clicked.
   
• Site  See Web.
   
• Tool Tip  A functional description that appears when the mouse cursor hovers over an item on the FrontPage IDE (or other Windows application).
   
• URL (Universal Resource Locator)  The address of a website or other information to be located.  For example, the URL for the our HCI201 home page is http://www.depaul.edu/~gandrus/201/index.html .
   
• Web (in the FrontPage sense)  A collection of related pages to be displayed on a website.  A Web is different than an ordinary directory because it contains additional information to allow FrontPage to publish the site in certain cases.  We (in HCI201) cannot publish Webs directly with FrontPage because we are publishing to a Unix machine, so we are required to upload our HTML files outside of FrontPage.  A Web is also known as a Site.
   

Items on FrontPage IDE

You should be familiar with some of these items from other Microsoft products like MSWord.

• Title Bar  The blue bar at the top of the IDE that contains “Microsoft FrontPage” and the name the document being edited.  To move the IDE window, left click on the title bar and drag the window to a new location.
   
• Control Box  The icon in the extreme upper left of the IDE or the three squares in the extreme upper right of the IDE that allow the user to minimize, maximize, restore, or close the IDE window.
   
• Resizing Border  By dragging the border (excluding the title bar) of the IDE window, it can be resized.
   
• Main Menu  The Main Menu is used to perform common tasks in FrontPage.  Here are the Main Menu items:
  • File  Create, Open, Close, or Print files in the Web.  In some cases, a Web can be published by selecting File and Publish Web...
    but we do not have the capability to publish to a Unix website.
  • Edit  Cut, Copy, Paste, Find, Replace, Undo, Add Task.
  • View  Show one of the views listed in View Options below, Views Bar, Reveal Tags, Toolbars, Refresh.
  • Insert  Horizontal Line, Date and Time, Symbol, Web Component, Picture Hyperlink, Comment.
  • Format  Font, Paragraph, Bullets and Numbering, Theme, Style (Cascading Style Sheet).
  • Tools  Spelling Check, Options, Page Options.
  • Table  Features for inserting and formatting tables.
  • Frames  Features for inserting and formatting frames.
  • Window  Display existing windows.
  • Help  Show help for FrontPage
     
• Standard Toolbar  The Standard Toolbar provides much of the same functionality of the Main Menu items with fewer mouse clicks.  Here are the Standard Toolbar items:  Create, Open, Save, Search, Publish Web, Toggle Pane, Print, Preview in Browser, Spelling, Cut, Copy, Paste, Format Painter, Undo, Redo, Web Component, Insert Table, Insert Picture From File, Drawing, Insert Hyperlink, Refresh, Stop, Show All (Paragraphs), Help.
   
• Formatting Toolbar  The Formatting Toolbar is used to modify the appearance of selected items on a page.  Here are the Formatting Toolbar items:  Style, Font, Font Size, Bold, Italic, Underlined, Align Left, Center, Align Right, Justify, Increase Font Size, Decrease Font Size, Numbering, Bullets, Decrease Indent, Increase Indent, Outside Borders, Highlight (Yellow), Font Color.
   
• Views  Provides various ways of viewing the files in a Web.  Here are the possible views:
  • Page  Allows editing of a Web page.  See the various ways in which a file can be viewed in View Tabs below.
  • Folders  Displays the contents of a Web organized into files and folders.
  • Reports  Generate reports about the Web pages, such as missing files, broken links, and slow-loading files.
  • Navigation  Allows the design of the Web's structure including navigation and link bars.
  • Hyperlinks  Provides a graphical display of all the hyperlinks in the web and their connections between Web pages.
  • Tasks  Allows the Web designer to specify tasks to be completed.
     
• View Tabs  Provides various ways of viewing a file:
  • Normal  Provides a WYSIWIG view of the file with the possibility of visible tags (Main Menu View and Reveal Tags) or visible paragraphs (Standard Toolbar Show All).
  • HTML  Shows the HTML source code in the file.
  • Preview  Provides a WYSIWIG file of the file without the possibility of visible tags or paragraphs.
     
• Status Bar  Shows the estimated download time of the page at various connection speeds.  In HTML View, the current line and column are shown.
   

Creating a Single HTML Page

Note: to create a FrontPage Web, look at the next section.

1. If you have not already done so, make this change in the MS File Explorer:
   Select Main Menu Tools and Folder Options.  Select the View Tab and uncheck the box in front of “Hide extensions for known file types.”
    
2. Use the MS File Explorer to create the folder c:\hci201.
    
3. Invoke FrontPage by selecting Start, All Programs, and Microsoft FrontPage.
    
4. Select Main Menu File, New, Page or Web.  Select Blank Page under New.
    
5. Select Main Menu File, Save As.  Select My Computer in the combo box and Local Drive c:, folder hci201.  Set the file name as MyPage.htm and click Save.
    
6. Select the Normal View if not already selected.
    
7. Type in the document, switching to HTML view when you prefer to type in source code directly.
    
8. Select Main Menu File and Save to Save the page.
    
9. Exit FrontPage by using the Control Box.
    

Creating a FrontPage Web

1. Select File, New, Page or Web.
    
2. Select Empty Web to bring up the Web Site Templates Page.
    
3. In the drop down box under Specify the location of the new web, select the address
   C:\Documents and Settings\user\My Documents\My Webs
    
4. Change the name of MyWebs to a name of your choice, for example
   C:\Documents and Settings\user\My Documents\PersonalSite
    

Adding a New Page to an Open Web

1. Make you have an open FrontPage Web.
    
2. Go to the Folders View.
    
3. Right click in the contents area, then select New, Page.
    
4. Change the name of the new page to index.htm or whatever other name you wish.
    
5. Double click on the name of index.htm to open the page.  This also changes you to the Page View.
    
6. Type in the contents of the new page.  You can also cut and paste content from an existing page or from a MS-Word file.
    
7. Save the page by selecting File, Save or use the Save button in the toolbox.
    

Miscellaneous Notes

• Press Enter to start a new paragraph (blank line in between paragraphs).
   
• Press Shift-Enter to enter a line break (no blank line after line break).
   
• Within a list, press Enter to start a new item within the list.
   
• Within a list, press Shift-Enter to enter a line break.