Index | Definitions| Previous | Next |

Behind the Scenes!

You are about to embark on a journey that will transform you from a mere Internet Surfer of the Web to an Internet Author of Multimedia!

Objectives
After this lesson you will be able to:

Now that you know what HTML is, let's start using it. We'll do some hidden stuff first.

Quick Quiz: What do those letters stand for?

HTML Tags:
When a web bowser displays a page such as the one you are reading now, it reads from a plain text file, and looks for special codes or "tags" that are marked by the < and > signs. The general format for a HTML tag is:

<tag_name> string of text </tag_name>

Notice that you had opening and closing tags for html and for the body of the page. The end tag has a slash: </tag_name>

If you forget the slash, a web browser will continue the tag for the rest of the text in your document, producing undesirable results (as an experiment you may want to try this later).

NOTE: A web browser does not care if you use upper or lower case. For example, <html>...</html> is no different from <HTML>...</HMTL>

Unlike computer programming, if you make a typographical error in HTML you will not get a "bomb" or "crash" the system; your web page will simply look, well... wrong. It is quick and easy to go inside the HTML and make the changes.

Your browser has a small but open vocabulary! An interesting aspect of HTML is that if the browser does not know what to do with a given tag, it will ignore it! For example, if you put in <wave> hi </wave>, it will just print hi and ignore the <wave> and </wave>.

An HTML document contains two distinct parts, the head and the body. The head contains information about the document that is not displayed on the screen. The body then contains everything else that is displayed as part of the web page.

1. Type in the additional lines so yours looks like the one below:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<html>
<head>
<title> web practice for PTRA workshop </title>

<!---Created by my name, today's date--->
<!-- header info used to contain extra information about this document, not displayed on the page -->
</head>

<body>
HELLO!
<!-- all the HTML for display on web page-->
</body>
</html>

The very first line:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"> is not technically required, but is a code that tells the browser what version of HTML the current page is written for. For more information, see the W3C Reference Specification.

All the HTML content is enclosed within <html> ...</html> tags.
Inside is first, the <head>...</head> and then, the <body>...</body> sections.

Also note the comment tags enclosed by <!-- blah blah blah -->. The text between the tags is NOT displayed in the web page but is for information that might be of use to you or anyone else who might look at the HTML code behind the web page. When your web pages get complicated (like you will see when we get into tables, frames, and other fun stuff later!), the comments will be very helpful when you need to update a page you may have created long ago.

The <title> tag is used to uniquely identify each document and is also displayed in the title bar of the browser window. You will NOT see it on the web page itself.

2. Save your page as before. Look at it in the web window.
EACH TIME YOU SAVE CHANGES, CLICK "REFRESH" OR "RELOAD" on the menu bar. It should look the same as before.

3. Now look at "Page Source" or "Source" under View, when looking at a web page. Notice that all the tags <-->and comments <!---> are shown here. This is like an actor's script; it tells the actor what to do, but the audience doesn't see it.
Did you know that this is how you can see how any web page is made??!

NOTE: For Windows 3.1 users, you must save all of your HTML files with names that end in .htm, so in this case your file should be practice.htm. Do not worry! Your web browser is smart enough to know that a file that has a name that ends in .htm is an HTML file.

You can create files with names like "practice.html", if you use Windows95 or a later Windows operating system. By using this file name extension, a web browser will know to read these text files as HTML and properly display the web page.

4. Check Your Work

Review Topics:
1. What are HTML tags?

2. Where is the text of the title tag displayed?

3. What steps are involved in creating a simple HTML document?

4. How do you create a comment tag?

5. How can you display your HTML document in a web browser?

NEXT

List of many tags at http://www.willcam.com/cmat/html/crossref.html.

Project Contact: Andria Erzberger
Last Update: January 6, 2003