Transferring Course Materials to the Web

1
Transferring Course Materials to the Web
2
Creating a Web Site With a Template
Creating a Web Site With a Template

• To create a Web site with a template
• Start FrontPage.
• On the File menu, click New, and then click Page
  or Web. The Page or Web task pane appears.
• Under the New from template section of the task
  pane, click Web Site Templates.
• Click Course Web.
• Type the address of your Web server in the
  Specify the location of the new web box
  (http//Webserver/myclass for example), and then
  click OK. In this workshop, type in C\my Webs or
  a folder that youve chosen on your hard drive to
  store the results of your Web development
  efforts. After the site is created, you are in
  Page view.
• On the Views menu, click Navigation.

3
Creating a New Page
Creating a New Page

• To create a new page
• Make sure you can see Course Handouts in the
  Navigation pane.
• Right-click on the Course Handouts page in
  Navigation view, point to New, and then click
  Page.
• Right-click on the new page, click Rename, and
  then type Schedule in the page title box. Press
  Enter to save your changes.
• Double-click on the Schedule page in the
  Navigation pane to change to Page view.
• Type a brief synopsis at the top of the page that
  describes the calendar and the information that
  it entails.

4
Applying a Theme
Applying a Theme

• To apply a theme
• On the Format menu, click Theme. In Apply Theme
  to, click either the Selected page(s) or All
  pages option button, based on your preference.
• Scroll through the list of themes in the Sample
  of Theme list to select the individual themes you
  want to display. After you have selected one,
  click OK to accept the changes and close the
  list.
• Click OK to save your changes to the theme.

5
Using Tables
Using Tables

• To use Tables
• In Page view, click the Center alignment tool on
  the toolbar, and then type Class Schedule.
• Press Enter. On the Table menu, point to Insert,
  and then click Table.
• In the Size area, change Rows to 6 and Columns to
  7, and then click OK.
• If the Table toolbar is not visible, on the View
  menu, point to Toolbars, and then click Tables.
• Click the Eraser tool on the toolbar. Well use
  this to erase some lines in the table.
• Click in the upper-left cell, hold the cursor
  down and drag to the upper right cell. You should
  see the lines in red that you are going to erase.
• Release the mouse button and the lines should
  disappear, leaving you with one large cell at the
  top.
• Click the Center alignment tool, and then type
  Week 1.

• To use Tables cont.
• Type in abbreviations for Monday through Sunday
  in the cells in the second row. You realize that
  you need additional lines in your table because
  you really wanted 6 classes or periods to be
  represented.
• Click Draw Table tool on the toolbar, and then
  click in the lower-left cell.
• While holding down the left mouse button, drag
  the cursor to the bottom right cell and release.
  A dashed line appears in the middle of the cells,
  and the row will split in two.
• Repeat step 11 again to create an additional row.
  Now you should have 6 rows.
• Youll also need another column, so drag from the
  left edge of the cell with Mon in it to the last
  row, and then release the mouse button.
• Click the Draw Table tool to return to selection
  mode, and then type Period1 through Period5 in
  the far left column. Youll need to click in each
  cell to type the text in the appropriate place.
  Finish the table by typing in the details for
  each cell.

6
Changing Table Properties

• To change table properties
• Right-click in the cell at the top of the table
  that containsWeek 1.
• Click Cell Properties from the menu to open the
  Cell Properties dialog box.
• In Borders, click the Color drop-down menu to
  select a specific color.
• In Background, click the Color drop-down menu to
  select a specific color. Click OK to close the
  dialog box.

Changing Table Properties
7
Applying Dynamic HTML Effects

• To apply dynamic HTML effects
• On the Schedule page that you created earlier,
  click below the table, and then press Enter.
• Type a sentence to remind the students of an
  upcoming event, and then select the sentence.
• On the Format menu, click Dynamic HTML Effects.
  The appropriate toolbar appears.
• Select the event that you want. You have four
  events to choose from, including Click, Double
  click, Mouse over, and Page load.
• After choosing the event, select the effect that
  you want. Based on the effect you choose, you may
  have to specify the direction. The direction is
  specified in the 3rd box from the left and is
  only enabled if the effect youve chosen demands
  it.
• After the effect is applied, the object is
  highlighted in light blue. To preview the effect,
  click the Preview tab.

Applying Dynamic HTML Effects
8
Embedding Graphics and Multimedia
Embedding Graphics and Multimedia

• To embed graphics and multimedia
• Click in the bottom of the table so that your
  cursor is blinking just below it, but above the
  text on which the dynamic HTML effect has been
  applied.
• On the Insert menu, point to Picture, and then
  click Clip Art.
• In the task pane, type snowflake in the Search
  text box, and then click Search.
• After the search brings up the clip, click it to
  paste it on to the Web page. You can insert as
  many images as you want in this way.

9
Using Hyperlinks and Bookmarks

• To use hyperlinks and bookmarks
• On the Schedule page, click to the right of the
  last line of text on the page, and then press
  Enter 10 times. Type Back to top.
• Scroll back up to the top and in the cell for
  Period1 on Tuesday type Assignment, and then
  double-click on the word to select it.
• Right-click Assignment, and then click
  Hyperlink-or-Click Insert, and then click
  Hyperlink.
• In the Insert Hyperlink dialog box, scroll down
  and then click homework.htm. This will place the
  page in the Address box.
• Click OK to close the dialog box and return to
  the Page view. Assignments will be underlined
  which indicates a hyperlink.
• Test the link by holding down the CTRL key while
  clicking on Assignments. Notice that you are now
  looking at the Assignments page.
• Click Window, and then click schedule.htm to
  return to the Schedule page.

• To use hyperlinks and bookmarks cont.
• Double-click Class Schedule at the top of the
  Schedule page to select the text, and on the
  Insert menu, click Bookmark.
• Click OK. A dashed line appears under the text in
  question, which indicates a bookmark has been
  placed at that location.
• Scroll down to see the text that was typed at the
  bottom of the page, and then select Back to top.
• Right-click on the selected text, and then click
  Hyperlink from the menu.
• Click the Bookmark button, point to Class
  Schedule, and then click OK. Click OK a second
  time to close the Insert Hyperlink dialog box.

Using Hyperlinks and Bookmarks
10
Creating Hotspots on Images
Creating Hotspots on Images

• To create hotspots on images
• Select the snowflake that was pasted from the
  clip art gallery earlier.
• Click the Rectangular Hotspot tool from the
  Pictures toolbar, and then draw a box around the
  portion of the graphic that points north.
• Locate the Discussions page in the window and
  select it. This will place the page in the
  Address box. Click OK.
• Repeat step 3 but go through the steps for the
  box pointing south this time.
• Find the News page, and select it. The northern
  portion of the graphic is now linked to the
  Discussions page, and the southern portion to the
  News page.

11
Using Scheduled Include Pages
Using Scheduled Include Pages

• To use scheduled include pages
• Click below the animated text to position the
  cursor at the bottom of the Schedule page.
• On the Insert menu, point to Web Component, and
  then click Included Content. Click Page Based On
  Schedule, and then click Finish. This displays
  the Scheduled Include Page Properties dialog box.
• Click the Browse button, click the hw1.htm page,
  and then click OK.
• Adjust the Starting and Ending times for your
  content. Times can be scheduled down to the
  second. A page can be scheduled to appear before
  and after the scheduled page as well. Click OK.
• The page appears in the window if the beginning
  date is before today. Double-click the scheduled
  page to view the Scheduled Include Page
  Properties screen. Change the ending date to be
  before today's date, and then click OK to view
  your changes.

12
Creating a Search Page
Creating a Search Page

• To create a search page
• On the File menu, point to New, and then click
  Page or Web. This displays the New Page or Web
  task pane.
• Click Page Templates under New from template to
  open the Page Templates dialog box.
• Click Search Page, and then click OK. You will
  see the new page in Page view.
• On the File menu, click Save As, and type search
  in the File name box to name your search page
  file. Click Save.
• Switch to Navigation view and drag search.htm to
  the organizational structure directly to the left
  of the Announcements page.
• Right-click the page, click Rename, and then
  change the page name to Search. Press Enter.

13
(No Transcript)