WebTeam Workshops

Module 1:
HTML Basics
•Creating a Work Folder
•Choosing a Text Editor
•HTML Tags: Definitions
•Basic Text Formatting Tags
•Creating Hyperlinks
•Creating E-mail Links
•Creating Lists
•Adding an Image
•Lesson 1: Digital Pathfinder
•Commercial HTML Editors

Module 2:
UNIX

Module 3:
Tables

Module 4:
e-Portfolio

Module 5:
Web Accessibility

Module 6:
CSS

glossary

disclaimer

Module 1: HTML Basics

Creating Lists

Creating lists is something that you will use often because it allows you create step-by-step instructions, list a series of steps or information (bulleted lists), and helps users scan a page for important information that would otherwise be embedded in a paragraph of text.

Ordered Lists

Ordered lists allows you to create sequential instructions or an outline format. The cool thing about ordered lists is that you can define the initial value for a list item. Let's see some examples:

Step-by-Step Instructions

To start your HTML document:

  1. Type the <HTML> tag.
  2. Then type the closing </HTML> tag.
  3. In between these two tags you will have your <HEAD>, <TITLE>, and <BODY> tags.

The code for this example looks like:

<P>To start your HTML document:</P>

<OL>
<LI>Type the <HTML> tag.</LI>
<LI>Then type the closing </HTML> tag.</LI>
<LI>In between these two tags you will have your <HEAD>, <TITLE>, and <BODY> tags.</LI>
</OL>

 

Outline Format

Here you define type=n where n= is a symbol. For example:

To start your HTML document:

  1. Type the <HTML> tag.
  2. Then type the c losing </HTML> tag.
  3. In between these two tags you will have your <HEAD>, <TITLE>, and <BODY> tags.

The code for this example looks like:

<P>To start your HTML document:</P>

<OL type=I>
<LI>Type the <HTML> tag.</LI>
<LI>Then type the closing </HTML> tag.</LI>
<LI>In between these two tags you will have your <HEAD>, <TITLE>, and <BODY> tags.</LI>
</OL>

 

Or you may want to use a letter of the alphabet (case sensitive!):

To start your HTML document:

  1. Type the <HTML> tag.
  2. Then type the closing </HTML> tag.
  3. In between these two tags you will have your <HEAD>, <TITLE>, and <BODY> tags.

The code for this example looks like:

<P>To start your HTML document:</P>

<OL type=a>
<LI>Type the <HTML> tag.</LI>
<LI>Then type the closing </HTML> tag.</LI>
<LI>In between these two tags you will have your <HEAD>, <TITLE>, and <BODY> tags.</LI>
</OL>

Unordered Lists

Unordered lists allows you to create a series of bulleted information.

To start your HTML document:

The code for this example looks like:

<P>To start your HTML document:</P>

<UL>
<LI> Type the <HTML> tag.</LI>
<LI>Then type the closing </HTML> tag.</LI>
<LI>In between these two tags you will have your <HEAD>, <TITLE>, and <BODY> tags.</LI>
</UL>

Unordered Lists have type="disc" (default) "circle" or "square"

Definition Lists

Definition lists may be used for glossary type lists as in the example:

HTML:

Stands for HyperText Markup Language. This is the computer language used to write source code (see definition below). The purpose of HTML is to describe to the computer how a web page should look. Every few years, a new standard for HTML is introduced. As of January, 2000, HTML 4.0 is the latest version.

HTTP:

Stands for HyperText Transport Protocol. Most Web site addresses are preceeded by HTTP. For example: http://www.amazon.com.

The code:

<DL>
<DT><STRONG>HTML:</STRONG> </DT>
<DD >Stands for HyperText Markup Language. This is the computer language used to write source code (see definition below). The purpose of HTML is to describe to the computer how a web page should look. Every few years, a new standard for HTML is introduced. As of January, 2000, HTML 4.0 is the latest version.
</DD>

<BR / >
<BR / >

<DT><STRONG>HTTP:</STRONG> </DT>
<DD>
Stands for HyperText Transport Protocol. Most Web site addresses are preceeded by HTTP. For example: http://www.amazon.com.
</DD>
</DL>

 

Next: Adding an image »

top of page