Writing Webpages with Wesley: A Workshop for Educators
All materials © 1997-2000 by Wesley A. Fryer

INTERMEDIATE COURSE

http://www.wtvi.com/html/intermediate

Quick Reference

FIRST: Basic Webpage Skill Review

  1. Targets/Anchors/Bookmarks: Linking within a webpage
  2. Tables: Displaying data in rows and columns
  3. Images: Colors, imagemaps, and animations
  4. Multimedia: Inserting sound clips, movies, and more
  5. Frames: Displaying several webpages at once
  6. Guestbook: An introduction to forms
  7. Uploading webpages

Extras:

  1. PDFs: Creating and inserting Adobe's cross-platform, portable document files
  2. Javascript Rollover Images: Images that change when the mouse cursor passes over or clicks them
  3. HyperStudio: Publishing stacks directly on the web

Basic Webpage Skill Review

When you save any file, remember to specify the:

  1. Filename (all lower case, no special characters, use .htm or .html as an extention for webpages)
  2. Location (for this class, the html folder on your desktop)

Creating a blank page

Claris Homepage
Netscape Composer
MS Frontpage 2000
  1. Create a new folder on your computer's desktop and name it html.
  2. From the FILE menu choose NEW PAGE.
  1. Create a new folder on your computer's desktop and name it html.
  2. From the FILE menu choose NEW and then BLANK PAGE, or click the new page icon:
  1. Create a new folder on your computer's desktop and name it html.
  2. From the file menu, choose NEW WEB:
  3. From the list of choices, choose EMPTY WEB:
  4. Choose to create the EMPTY WEB in the folder on your desktop. The path for your Windows computer is: C:\Windows\Desktop\html
  5. You just need to do this one time for your website. If you don't, none of your relative links will work.
  6. For successive pages, from the FILE menu choose NEW and then PAGE, or click the new page icon:

Make an Absolute Link

Claris Homepage
Netscape Composer
MS Frontpage 2000
  1. Highlight the text you want to make into a link by clicking and dragging over the text with your mouse.
  2. Click on the Link Editor, which looks like a blue squiggly line: (.)
  3. Then type "http://www.cnn.com" in the blank box beside "URL." It will look like this:

  1. Highlight the text you want to make into a link by clicking and dragging over the text with your mouse.
  2. Click on the Hyperlink button, which looks like a globe with a chain in front of it:
  3. Then type "http://www.cnn.com" in the blank box beside "URL." It will look like this:

Make an Relative Link

Claris Homepage
Netscape Composer
MS Frontpage 2000
  1. Highlight the text you want to make into a link by clicking and dragging over the text with your mouse.
  2. Click on the Link Editor, which looks like a blue squiggly line: (.)
  3. Click once on "Browse Files...":
  4. From the dialog window, select the file you want the text to link to.
  5. Click OPEN to select the file.
  6. Close the Link Editor.

  1. Highlight the text you want to make into a link by clicking and dragging over the text with your mouse.
  2. Click on the Hyperlink button, which looks like a globe with a chain in front of it:
  3. Click on a file if it is shown in the center of the window, or click on the "down arrow" at the top of the window to select a different file location:
  4. Click OK to select the file and close the Hyperlink window.

Insert a Saved Image

Claris Homepage
Netscape Composer
MS Frontpage 2000
  1. Click on the INSERT IMAGE button (It has a red circle, green triangle, and blue square on it:.)
  2. Find the name of the image you want to put on your webpage and click OPEN.
  3. It will be displayed in Claris Homepage like it will be displayed in a web browser, unless it is an "animated GIF" image. Homepage will just display the first "frame" of an animated image. Preview in your browser to see the animation.

  1. Click on the INSERT IMAGE button:
  2. Find the name of the image you want to put on your webpage and click OPEN.
  3. It will be displayed in Claris Homepage like it will be displayed in a web browser, unless it is an "animated GIF" image. Homepage will just display the first "frame" of an animated image. Preview in your browser to see the animation.