Previous Contents Next
2. HTML Documents

It is important to remember that HTML tags are used primarily to describe the structure of a page rather than its appearance. Tags, for example, describe the arrangement of headings, paragraphs, lists, tables, and other structural elements of a page; they indirectly describe the type faces, fonts, point sizes, and other stylistic characteristics of the text. For the most part, these stylistic conventions are determined by the browser's interpretations of the layout tags. So, different browsers may display headings or paragraph text in different fonts and styles depending on its default settings. Although certain fonts and styles may be set through HTML, these determinations are best left to the browser, with the HTML author concentrating on the structure of the page.

The Structure of HTML Documents

All HTML documents have a simple, common structure composed of a head section and a body section, optionally surrounded by a language type (HTML in this case) reference. The head section contains the title of the document; the body section contains the page description elements. Most HTML coding appears in the body section of the document. The following code shows the overall layout of an HTML document:

<HTML>

<HEAD>
<TITLE>This is where the title goes</TITLE>
</HEAD>

<BODY>
...this is where the page description goes...
</BODY>

</HTML>

(In this and other examples, the HTML tags are typed in upper-case letters to distinguish them from the text of the document. You can chose to use upper-case, lower-case, or mixed style since HTML is not case sensitive.)

In the following sections we'll take a look at the tags that make up this overall structure of an HTML document.

The <HTML> Tag

<HTML>

<HEAD>
<TITLE>This is where the title goes</TITLE>
</HEAD>

<BODY>
...this is where the page description goes...
</BODY>

</HTML>

The <HTML> tag indicates to the browser that the text enclosed between this tag and the final </HTML> tag represent HTML instructions. Although most browsers can handle a page without the <HTML> tag, it is recommended that all your HTML documents use it.

The <HTML> tag is an example of a container tag that encloses and defines a block of text (or the entire document). A container tag opens with the tag name enclosed in brackets and closes with the tag name preceded by a slash and enclosed in brackets. Most HTML tags are container tags using these <...> and </...> characters.

The <HEAD> and <TITLE> Tags

<HTML>

<HEAD>
<TITLE>This is where the title goes</TITLE>
</HEAD>

<BODY>
...this is where the page description goes...
</BODY>

</HTML>

The <HEAD> tag defines the head section in a document. The head supplies the document title and optionally establishes relationships between HTML documents and file directories. The document head can signal the WWW browser to use its search capabilities to index the current document. The head section is identified by an open tag <HEAD> and a close tag </HEAD>.

The <TITLE> tag gives a title to the document. It defines the text string that appears in the browser window's title bar. The title can be and often is different from the file name since there is no limit to its length and it can be more descriptive of the document than a file name. Note that the <TITLE> tag is a container tag requiring a closing </TITLE> element.

The <BODY> Tag

<HTML>

<HEAD>
<TITLE>This is where the title goes</TITLE>
</HEAD>

<BODY>
...this is where the page description goes...
</BODY>

</HTML>

The bulk of the coding for an HTML document appears within the body section, enclosed between the <BODY> and </BODY> tags. In its simplest form the body section contains plain text that will be displayed in default style in the browser window. More elaborate displays are provided by the HTML tags discussed in the following sections.

HTML Coding Format

It should be noted that HTML is written in free-format style. That is, blank spaces, tabs, indents, line feeds, and most other document formatting supplied by the text editor or word processor used to write the instructions are ignored. Thus, the above tags showing the general structure of an HTML document could be written:

<HTML><HEAD><TITLE> This is where
the title goes </TITLE></HEAD>
<BODY>This is where the page
description goes</BODY></HTML>

All that matters to the HTML interpreter (the browser) are the tags and text, not their layout or style. Still, it makes sense to format the document for human readability. Therefore, when using, say, a text editor to type the HTML code, include blank spaces, tabs, indents, line feeds, and so on to make the text and accompanying tags more readable to you within the editor.

Once the document is composed, it must be saved with a special file extension to indicate to the browser that this is an HTML document. All HTML files, therefore, must have the .html or .htm extension; e.g., "mypage.html." We'll have more to say about naming conventions and file locations later.

By the way, you know enough HTML now to author your own Web document and make it accessible to the world. It won't be very fancy, but it will be functional. So, go to the next page and let's begin making your presence felt on the World Wide Web.

Previous Contents Next