Creating a Course Web Page

(Dreamweaver version)

 


Starting Dreamweaver

To create content for a web page, you may use a web page editing program called Dreamweaver. Dreamweaver is a WYSIWYG (What You See Is What You Get) web page editor. It allows you to lay out a web page in much the same way you would lay out a text document using Microsoft Word. One major difference between Dreamweaver and Word is that Dreamweaver generates HTML files that can be edited directly. (HTML is a topic for the future.)

From the Windows Start menu, click on "All Programs", then click on the folder labeled "Macromedia," then click on Dreamweaver. When you start up Dreamweaver, it will probably present you with a page whose middle column is titled "Create New" -- choose "HTML." (If you do not see a page with that choice, create a new file from Dreamweaver's file menu, in which case you will want to choose "Basic page" from the Category column and "HTML" from the Basic page column.)

You should now be confronted with a large empty window. Creating your web page is as easy as typing content into this window. Type some simple text into the page. Click on the "Code" button just above the top ruler. What happened? Then click on the "Split" and "Design" buttons next to it. What does each button do? When you are comfortable with all three views, choose the Split view. Type some text such as "Lab 1" in the Title text box next to the Code/Split/Design buttons, and look for the resulting change in the head section of your HTML file.

As you add content to your page, you can change the formatting of your text and add links using HTML tags in the Code window or using the toolbars at the top and bottom of the screen (the "Properties" toolbar at the bottom of the screen is particularly useful). If you are unsure what a particular button does, try hovering the mouse over it; a brief description should appear.

Save Early and Often

Save your page to a file on the M: drive right away, and then save periodically as you work. When you choose File -> Save As... the M: drive should be located under "Computer" and it should look something like "k09lt01 (\\kfiles\students)(M:)".

TIP: Web Page Filenames

If you haven't already, create a folder in which you will save the web pages you create for this class.

By default, web browsers look for files called index.html, so that is a good name to use for the "home" page of any project; in this case, the "home" page for your work in this class. If you create other files in this directory (as you probably will), you will want to give them other names, such as project1.html. It is best to avoid spaces and special characters in your filename (e.g., COMP Lab #1 is not a good filename for a web page).

TIP: USB Alternative

An alternative to storing your work on the M:\ drive is storing it on a USB thumb drive. This might be convenient if, for example, you intend to move frequently between Lab computers and a computer off campus. If you do use a USB drive, make sure to backup your work frequently. USB drives are easy to lose.