HTML Structure

HTML uses tags that are encased in brackets like the following:

< >

HTML documents consist of elements which are constructed with tags. For instance, a paragraph is considered to be an html element constructed with the tags and . The tag begins the paragraph element and the tag ends the element. The following is a paragraph element.

This is a sample paragraph element. Any text in a paragraph goes here.

Not all tags have a tag for ending the element such as the line break, tag. The HTML document is begun with the <html> tag and ended with the </html> tag. Elements of an HTML document include the HEAD, BODY, paragraphs, lists, tables, and more. Elements may be embedded within each other. Also some elements have attributes embedded in the tag that define characteristics of the element such as the placing of text, size of text, source of an image, and other characteristics depending on the element. These attributes are listed in this document when the element is discussed in detail.

An HTML document is structured with two main elements:

HEAD
BODY

An Example HTML File

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

   <meta name="GENERATOR" content="Arachnophilia 3.9">

   <meta name="description" content="Comprehensive Documentation and information about HTML.">

   <meta name="keywords" content="HTML, tags, commands">

   <title>The CTDP HTML Guide</title>

<link href="style.css" rel="stylesheet" type="text/css">

<!-- Background white, links blue (unvisited), navy (visited), red (active) -->

</head>

<body>

<center><h1>HTML Document Structure</h1></center>

<p>

This is a sample HTML file.

</p>

</body>

</html>

Comments begin with <! and end with the > bracket. The tags "HTML", "BODY", and all others may be in capital or small letters, however the new XHTML standard requires small letters so small letters are recommended.

In the above file, there is a header and a body. Normally you can copy this file and use it as a template to build your new file while being sure to make some modifications. You can edit HTML using a standard editor, but it is easier to use an HTML editor like Arachnophilia since it displays the tags with different colors than the text is displayed in. Also note the LINK element above which specifies a style sheet to be used. This is a file with a name "style.css". This is a text file that may be created with a text editor but must be saved in plain text format. See the section called "Setting Document Style" for more information about style sheets.

The center tag used above is depreciated. It is best to use style sheets to center headers and other items. This is covered in more detail later.