Modules >>
Webpage Construction

Prerequisites

• Electronic Communication and Computer Security module
• Internet I module
• Word I module
• Server space to display your webpage (UVic Internal students have access to 10 MB of server space; Outreach Students will have access to UVic server space but will be charged four cents per megabyte per day)

Introduction

After completing the Internet I module, you now have some experience surfing the web and evaluating websites.  In this module, you will create a website of your own and post it on the Internet. This module will take on less of a "recipe" approach in its design since there are many other factors that come into play for each person, such as the HTML editor program, the server space, the content you want to include, etc. Students will be expected to take advantage of the resources provided at the bottom of the webpage and play an active role in discovering how to create a webpage using the resources available to them. 

The websites you view on the Internet are stored on web servers. These are simply computers that have a folder set up for you to store webpages that can be viewed by anyone on the Internet.  Posting a website on the Internet simply involves transferring your website (HTML) files and images to this space on that server and setting the permissions for that folder so that the public can view its contents.  You may use programs like Fetch or FTP to transfer these files. If you have access to the Internet through some provider other than UVic, you should have available to you some resources as to where you can post your webpage.   This module is geared towards using the UVic server space and will provide resources on how to post a small website on the UVIC server space.  Students posting their websites to other servers (i.e., shaw, telus, etc.) will have to contact their Internet provider for support. Please note that online web-building sites, such as www.geocities.com are not acceptable for completion of this module.

Objectives

In this module, you will create a website that includes:

• three or more webpages with organized layout of content
• the content must be either a resume or a topic suitable for use in a classroom
• easy navigation between webpages
• the text must be of different sizes, colours, and styles
• a background - either a colour or an image
• a "mailto" link to your email address
• both relative and absolute hyperlinks
• a table
• an image

Lesson

Review the following sections by clicking on the links. Please follow the instructions within each section.

Getting oriented Organization of content Navigation Text Background colour or image Email links Hyperlinks Tables Images Uploading your site Troubleshooting

Click on these links to review each section

Assignment

1. Share your website with the other students enrolled in the Comp-in-Ed program. To do this, please post a message with your URL to the "Webpage Construction" conference on the WebBoard. You may solicit feedback on the site and ask students on different types of computers to let you know how your webpage appears to them. 
2. Compose an email message addressed to compined@uvic.ca
3. Include your personal email address in the "Cc" field to send a copy of the message to yourself
4. The subject line of your email should be the initials of *your* name followed by a short abbreviation of the module name. For example, Valerie Margit Irvine would use the subject line: VMIwebpg1
5. In the body of the email, please provide the following:
   - computer platform and how you created your webpage (i.e., which HTML editor and version or if you used raw HTML code). 
   - provide the URL where your website can be viewed. This website must demonstrate all of the requirements listed in the lessons.  To refresh your memory, review the objectives at the top of this page.
   - confirm that you posted your URL in the WebBoard
   - please let me know whether your website can be used as a sample for future offerings. If so, your site will be mounted on the the Comp-in-Ed server and password-protected so only Comp-in-Ed students can view it.
6. Send the email

Congratulations on completing the seventh module of level one!

Resources

Most of the software programs below are available for a free evaluation period, while others are only available for purchase.  Before purchasing any software, be aware that you can download Netscape Communicator for free and use the Composer program embedded within it.  Furthermore, if you do plan on purchasing an HTML editor, be sure to get "academic pricing" for it.  Most campus computer/bookstores will sell software at discounted rate to students who will use the software for educational purposes.

HTML EDITORS & AVAILABLE TUTORIALS:

Microsoft FrontPage

FrontPage 2000 Tutorial by the University of Alberta (Windows)
http://www.quasar.ualberta.ca/edit202/tutorial/frontpage-win/frontpage-win.htm

FrontPage Editor Tutorial by the University of Alberta (Macintosh)
http://www.quasar.ualberta.ca/edit202/tutorial/frontpage/frontpage.htm

FrontPage Editor Tutorial for HSD 150 Lab setting at UVIC (Windows)
http://www.educ.uvic.ca/compined/Level1/html/Tutorial/HSDA150.htm

Microsoft FrontPage Website
http://www.microsoft.com/frontpage/

In and Out of the Classroom with FrontPage 2000
http://www.microsoft.com/education/?ID=FrontPageTutorial

FrontPage 2000 Online Tutorial (for K-12 teachers)
http://www.actden.com/fp2000/java/index.htm

FrontPage 98 Online Tutorial
http://www.actden.com/fp/

Netscape Composer (part of Netscape Communicator)

Building Webpages with Composer
http://home.netscape.com/browsers/using/newusers/composer/

Download Netscape Communicator (Free Program)
http://www.netscape.com

Dreamweaver

Macromedia's Dreamweaver HTML Editor (30-day Free Evaluation Copy Available)
http://www.macromedia.com/software/dreamweaver/

Dreamweaver 4 Tutorial by Stanford University
http://acomp.stanford.edu/acpubs/Docs/dreamweaver/

Adobe GoLive

Adobe website for GoLive HTML Editor (Temporary Free Evaluation Copy Available)
http://www.adobe.com/products/golive/

Claris Homepage

Claris Homepage 3.0 Tutorial by the University of Alberta
http://www.quasar.ualberta.ca/edit202/tutorial/ClarisHomePage/claristutorial.htm

Download Claris Homepage (Temporary Free Evaluation Copy Available)
- enter "Claris" in search field
http://download.cnet.com/

Microsoft Word

"Using Microsoft Word to Create Webpages" Tutorial by the University of Alberta
http://www.quasar.ualberta.ca/edit202/tutorial/mswordhtml/mswordhtmltut.htm

OTHER TUTORIALS & RESOURCES:

HTML Code Tutorials

HTML Basics 101 by the University of South Dakota
http://www.usd.edu/trio/tut/html/

Writing HTML: a tutorial for creating WWW pages
http://www.mcli.dist.maricopa.edu/tut/lessons.html

Webmonkey - HTML Tutorial
http://hotwired.lycos.com/webmonkey/teachingtool/

Writing HTML by the University of Victoria Computer Help Desk
http://helpdesk.uvic.ca/how-to/support/www/html.html

HTML Goodies
http://htmlgoodies.earthweb.com/

Builder.com's HTML for Beginners
http://www.builder.com/Authoring/Basics

Creating a Webpage in HTML by Stanford University
http://acomp.stanford.edu/acpubs/Docs/create_webpage/

Webpage Construction Tutorials and Resources

Creating your own WWW page by the University of Victoria Computer Help Desk
http://helpdesk.uvic.ca/hownote/1997/ht97006.html

Yale C/AIM WWW Style Manual
http://info.med.yale.edu/caim/manual/index.html

Tips for Writers and Designers
http://www.dsiegel.com/tips/index.html

File Transfer Programs (for uploading your website to your server space)

Download Fetch (for Macintosh users)
**check to see if you have it installed first
http://fetchsoftworks.com/

Fetch Tutorial by the UVic Computer Help Desk
http://helpdesk.uvic.ca/how-to/support/mac/fetch.html

Fetch Tutorial by the University of South Dakota
http://www.usd.edu/trio/mac/fetch.html

Download WS-FTP LE (for Windows users)
**check to see if you have it installed first
http://www.Ipswitch.com/

WS_FTP LE Tutorial by Valerie Irvine (for UVic server space)
http://www.educ.uvic.ca/compined/Links/wsftptut.htm

FTP Tutorials by the UVic Help Desk
FTP for Win 3.x: http://helpdesk.uvic.ca/how-to/support/windows/wsftp.html 
FTP for Win 9x/NT: http://helpdesk.uvic.ca/how-to/support/win32/wsftp.html

FTP Tutorials for Shaw server space using WS_FTP or Fetch as well as those using the Publish feature in Composer or FrontPage
- this is relevant only to those students with Shaw Internet Service
http://support.shaw.ca/webspace/upload.htm

FTP Tutorials for Telus server space using WS_FTP LE or the Publish feature in Composer or FrontPage
Telus also provides a web-based upload tool called the Telus File Manager.
- this is relevant only to those students with Telus Internet Service
- the URLs are too long to provide here, so please click on the tutorial link above

Other Resources

ZDNet
http://www.zdnet.com/
This site provides an extensive amount of material to support computer users - including free software, product reviews, hardware shopping tips, and latest technology releases.

Tucows
Main page: http://www.tucows.com
Vancouver-based mirror site: http://tucows.direct.ca/index.html
This website is very useful for those of you who may want to download free/shareware HTML editor programs.

BrowserSizer
http://download.cnet.com/downloads/0-10092-108-37298.html

Free Clipart, Web Graphics, and Icons
http://www.free-clip-art.com/

Absolute Background Textures Archive
http://www.grsites.com/textures/

Absolute Web Graphics Archive
http://www.grsites.com/webgraphics/

Frequently UNAsked Questions About Web Etiquette (on using images)
http://www.xmission.com/~emailbox/netiquette.htm

To add another resource, please email your suggestion to compined@uvic.ca.

Copyright © 2001-2002 Valerie Irvine. All rights reserved.
Revised: February 01, 2003.