Learning HTML: 5 of 6

HTML Structure


All HTML documents contain a header and body:
  1. Within the header of the document:
    <html> <head> <title>This is where you put the title of the document</title>
    Now include your META Tags (see below)
    Style is driven by CSS, a link to a CSS stylesheet guide can be included in the header (see source for this page)
    Also other references to javascript etc
    </head>

  2. Within the body of the document:
    <body> (you can include your background tag here, review last session's tips)
    The remaining text and html code for the document.
    </body> </html> should be at the end of the document.

META Tags


Use META Tags to market your presence with the search engines.
META tags are very useful to help identify your documents in the various search engines. One thing is for sure, they cannot hurt. Use the following two META tags in your documents (before the </head> code, i.e. they must be in the header.)

<META Name="description" content="This is the resume of John Doe. I am graduating in May 1997 with a Degree in Business Administration (Marketing) and am seeking a marketing position">

<META Name="keywords" content="resume, marketing, job, search, resume">

The description tag will be used by (some) search engines to describe your site (page), instead of just taking the first few words of your document as the descriptive statement, which will happen without the tag.
The keyword tag allows you to increase the number of keywords in your document. Notice that both these tags do not appear in the document the browser views (but you can see them in the source code). To include additional information in the document source, but not in the actual document you can do the following:
<!Information behind the exclamation point will not appear in the document. It can be used to identify the author, or add more keywords etc.>

Use of Headers


<h*> and </h*> should be used for your document headers. Replace the * with a number, 1 through 6, depending on the size of the header you require. 1 is the greatest size, 6 is the smallest (and is smaller than the regular font size). Do not use the header command to manipulate the size of the font. (H3 is commonly used as a header size.)

Changing the Font


You can change the font size and color of your type. Font sizes come in a range from 1 through 7. The default is 3. You have the option of specifying a font size using <font size=4>the text will change to the appropriate size, we have specified 4 here, until the following</font>. You can also specify a change in the font size, <font size=-1>we have now specified a change, by -1, thus requesting size 2 until the following</font>
You can specify a change in the font color by using the following:
<font color="hex color code">I have specifed the code for orange 993300, and the type will stay orange until </font> The following resource is a Hex Color table Guide. You can also use these codes in your background tag to specify the background color of your document. Use the tag:
<body bgcolor="hex color code">

Lists


You can create lists that are either ordered (numbered) or unordered (using bullet points). The ordered list code is:
<ol>
<li>First statement in list
<li>Second statement in list
</ol>
For an unordered list replace the <ol> and </ol> with <ul> and </ul>

Now go to Learn HTML: Part 6