logo.gif

Creating A Basic HTML Web Page

There are 4 HTML Tags you need to learn to create a basic page:

<HTML> and </HTML>
<HEAD> and </HEAD>
<TITLE> and </TITLE>
<BODY> and </BODY>

These are the 4 tags that MUST appear on a page in order for it be viewed correctly.

The <HTML> Tag

This set of Opening and Closing Tags tell your browser that the document it is loading is an HTML document. The Opening <HTML> Tag MUST appear at the very top of your document since the rest of your document has to reside inside this Tag.

The Closing </HTML> Tag MUST appear at the very bottom of your document. This Tag tells the browser that there is no more HTML document to display.

The <HEAD> Tag

The HEAD portion of your page will display absolutely nothing in your browser. It's function is to contain hidden internal information your browser requires to display your page properly. Between the Opening <HEAD> Tag and the Closing </HEAD> Tag you will often find the Meta Tag elements and possibly Javascript Tags.

The <TITLE> Tag

The TITLE Tag set is entered INSIDE your HEAD Tag set, like this:

<HEAD>
<TITLE> Type the title for your page right here </TITLE>
</HEAD>

The TITLE Tag is probably the most confusing tag of all, to novice HTML coders. All this tag does is display whatever text you enter as the TITLE in your browser's TITLE BAR. This TITLE does NOT appear anywhere on your page!

NOTE: Most Search Engines use your title when it displays search results to a viewer. Keep your title short (no more than 10 words) and try to describe the main theme of your site.

The <BODY> Tag

All of the text and images you put on your page must appear BETWEEN the Opening and Closing <BODY> tags. There are several basic Attributes that you can use in the Opening <BODY> Tag.

BACKGROUND=
Use this Attribute to specify a background graphic (GIF or JPG) like this:

BACKGROUND="picture.gif"

or if it is in a different folder than the page you are writing:

BACKGROUND="otherfoldernamehere/picture.gif"

BGCOLOR=
If you do not wish to use a background graphic, use this Attribute instead to define a color for your web page background:

BGCOLOR="#FFFFFF" or "White"

TEXT=
Use this Attribute to define what color ALL of the text on your page will appear in:

TEXT="#000000" or "Black"

LINK=
This Attribute will let you define the color that ALL of your Links are displayed as:

LINK="#008080"

VLINK=
The VLINK [Visited Link] defines the color that ALL the Visited Links appear in. If you click on a Link and go to a page, and then come back to the original page, the Link you just clicked on is now another color. You can define that color using VLINK:

VLINK="#FFFF00"

ALINK=
The ALINK [Active Link] sets the color the Links will turn as you click on them:

ALINK="#FF0000"

Creating A Page With These Tags

Here is the complete tag setup for a Basic Home Page that incorporates ALL of the Tag sets we have discussed in this section:

<HTML>
<HEAD>
<TITLE>Type a title for your page here</TITLE>
</HEAD>

<BODY BACKGROUND="picture.gif" BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#0000FF" VLINK="#800080" ALINK="#FF0000">

This is where all the wonderful stuff you want to show on your page goes.

</BODY>
</HTML>


Once you have the basic page elements in place you can start adding your content. Let's start with adding your basic text:

~~~~~ On to "Creating and Formatting Text" ~~~~~