CSci 220 - Lecture 4

Web Page Design

© Morris Firebaugh

 


I. Introduction

A. Chapter 4: A Beginner's Guide to the Server

B. Basic UNIX Commands

C. How to Upload your own Web Page to a Server

D. Basic HTML Tags

 




II. Chapter 4: A Beginner's Guide to the Server

Web Pages are stored on the Servers of Internet Service Providers (ISPs)

Two Internet Service Providers (ISP) most familiar to your instructor are:


University of Wisconsin-Parkside

Steven Premeau, System Administrator


Wisconsin Internet

Mike Falaschi, President and CEO




The basic concept of HTML Links involves Source and Destination

 
 
 

 

 


Links are the very heart of hypertext!

<A  HREF="destination">source</A>

 

Note:


The following HTML code:
 

<P>In case anybody want to offer me a job, I've also included my <A 
HREF="http://www.uwp.edu/academic/ computer.science/Faculty/firebaugh.www/
ResumeMWF.html">Brief Resume.</A>

produces
 

 

Observations:



URL Path Links and UNIX Path Syntax

 

 


Absolute Addressing

 

 


Relative Addressing

 

 

Observations:

 

Advantages to Relative Addressing:




III. Basic UNIX Commands

General format for UNIX Commands is

command  option(s)  filename(s)


Guidelines for UNIX Syntax:


List of Essential UNIX Commands



UNIX File Name Conventions



MIME Types




IV. How to Upload your own Web Page to a Server

Recall - Each University student has their own E-mail Account. Here is an algorithm for uploading your Web Page to your E-mail Account.

1.0 Create your home page folder, MyPage.www, containing your home page document, MyPage.html, and all associated graphics and html files.

2.0 Use Fetch, , to upload your folder to the Public-html folder of your E-mail account.

3.0 Use Fetch to set the Read/Write Permissions to give everyone reading permission but only the owner writing permission

4.0 Verify that you (and your curious public) can, indeed, read you Web page by opening the URL

http://uwp.edu/~firebaug/MyPage.www/MyPage.html


Second Algorithm for posting Web Page to the Net (Fetch + TelNet)




V. Basic HTML Tags

<ADDRESS>      An address for further information
			
<BLOCKQUOTE>   Used for quotations, indentations, or substitute for TAB
			
<CENTER>       Used to center an element
			
<DIV>          A logical division with a particular format
			
<FORM>         An element for collecting and transmitting user input
			
<Hn>           An nth level heading, running from H1 (largest) to H6 (smallest)
			
<HR>           A horizontal rule for logical organization of a page.  Width and height adjustable.
			
<P>            New paragraph container
			
<PRE>          Pre-formatted text container for structuring white space such as this table
			
<SPAN>         A tag for specifying a sub-string for applying a particular style
			
<TABLE>        What can I say?
			
<UL>, <OL>     Lists such as unordered (bulleted) and ordered lists (numbered)
			
	

Consider the <Address> Element (Tag) in more detail


 

Your Name Here
Assignment 3A
Web Page Design 220
February 2, 20XX

which is done with the code:

     <address><P align="right">
     Your Name Here<BR>
     Assignment 3A<BR>
     Web Page Design 220<BR>
     February 2, 20XX<BR>
     </P></address>

 


Character Formatting Elements - Logical Markup

 



VI. Homework Assignment #2






Updated January 21, 2001