Mr. Kim's Pro-D Outline

Welcome to the exciting world of technology. Web design encompasses many things. Today we will only touch on a few of the more important things specifically related to designing online course outlines.

Agenda

The presenter reserves the right to change the agenda at any time without notifying the audience.
Hour 1	Topics	Learning Objectives
	setting up folders	create web and image folders
	site mapping	create a map of web site on paper
	saving as a .htm file	save as a .htm file in web folder
	text	change font type, style, size, and color
	tables	create rows and columns; format cells and borders
	images	insert, format images, and add alternative text
Hour 2
	text hyperlinks	link to other pages using text
	image hyperlinks	link to other pages using images
	links within the same page	link to text within the same page
	background color / background tile	add different color to background / use an image as a background
	templates	create templates
Hour 3
	create an alias account	create an alias account at Yahoo Geocities
	upload to remote server	upload pages and images to remote server
	beta test web site	test the links and correct problems

Folders

go to P: drive (public)>Pro-D>open
file>new>folder>your name
open your name folder>file>new folder>images
click www.intergate.ca/personal/jkhome/prod.htm
right click the spartan image>save image as>save in P: drive in images folder

Site Mapping

it all starts with your index page (index.htm, main.htm, home.htm) and everything flows from here

Saving as a .htm file

open Netscape browser
click Netscape Composer on the bottom right corner (open book icon)
file>save as>P: drive (public)>Pro-D>open
your folder>open>file name: index.htm>save

Text

pulldown Heading 1>Lucinda Calligraphy>24 points>write in your title (Mr. Kim's Pro-D Outline)
highlight the title>click bold (Big A)
add a horizontal line (icon says H. Line)
write down: Introduction | your courses | your courses | your courses | your courses|

Table

table>5 rows>2 columns>center>check include caption-below table>border line width=1>table width=75%>apply>OK
highlight cells on left side>alignment>left
highlight cells on right side>alignment>center
write down>name>where you were born>your favourite food>all time favourite movie>favourite place traveled to
click insertion point to Name>right click mouse>table properties>row>row background>click use colour>click on box beside>choose colour>OK

Example:

Introduction

The presenter reserves the right to lie about his age.
Name	Kenneth Kim
Age	20
Place of Birth	Ocean Island, Kiribati
Favorite Food	fresh baked bread
Favorite Movie	Die Hard
Favorite Place Traveled	Pangkor Island, Malaysia

Images / Image Hyperlinks

click insertion point to beside Introduction | your course...
insert>image>choose file>P: drive (Public drive)>Pro-D folder>your folder>open>images>open>spartans.gif>open
solid border=0>alt. text>alternate text>this is an image hyperlink
link>link to>http://www.intergate.ca/personal/jkhome

Text Hyperlinks / Text Link Colors

highlight place of birth>click link>link to>http://www.mapquest.com>OK
see above table - notice text links are always underlined
to change the link colors>right click>page properties>colors and background>check use custom colors>select your colors

Links to Text within a Page

click insertion point to beside the heading introduction
insert target>enter a name for this target>1>OK
click insertion point beside Introduction | your course...
highlight Introduction>click link>select a named target on current page>select 1>OK

Background Color / Background Tile

right click>page properties>colors and background>check use custom colors>select your background color
right click>page properties>colors and background>check background image>choose file>P: drive (public)>Pro-D>open>your folder>open>images folder>select image of choice to use as a background>open

Templates (adding additional pages)

P: drive (public)>Pro-D>open>your folder>open>right click index.htm>copy>paste>rename page (this is now your second page)

*for those of you who have your class notes in Microsoft Word, just convert your files into .htm or .html files.*

Creating an Alias Account

Netscape browser>open>address bar: www.yahoo.com
Geocities>I am a new user>sign me up
sign up for your Yahoo Id>submit form

Upload

login>username: prod>password: prod
start building now
about your home page>school / education
build page now
file manager
open file manager
subdirectories>new>images
open images subdirectory
upload>browse>P: drive>ProD folder>your folder>images folder>open>spartans.gif>open>upload files
open parent directory
browse>s: drive>P: drive>ProD folder>your folder>open>index.htm>open>upload files

*make sure to upload images into the images subdirectory and web pages to the parent directory*

Listing with Search Engines

Netscape browser>open>address bar www.addme.com
follow the instructions to list with most search engines
make sure you have a meta description and meta keywords

Hosted by www.Geocities.ws