Home Page

HTML tags you will be tested on from mini-chapters 1-9 of the Davesite

HTML: An Interactive Tutorial for Beginners

General Questions to be able to answer:

What is the first tag for your HTML pages? What is the last tag?

What do you put in the “head” section of the code for your html page?

What do you put in the “body” section for your html page?

What are the two features that come automatically with the heading tags such as <h1>---that do not come with a “font size” tag?

What is an “attribute” to a tag?

Some of the tags from each lesson you should know for the test:

Lesson 1

<html> ....... </html>
<head> ...... </head>
<title> ...... </title>
<body> ...... </body>
<b> ...... </b>
<i> ...... </i>

Lesson 2

<h1> ...... </h1> Sizes ranging from 1 to 7 with 1 being the largest.
<hr> Often the horizontal rule (hr) will have other attributes with it:

width="6" or width ="60%" how far across the page the rule will extend
size="10" for thickness of line
noshade to make the line solid in color

Example of the horizontal rule with attributes: <hr width="50%" size="10" noshade>

Lesson 3

<p> ...... </p>
<u> ...... </u>
<font size="+2"> ...... </font> Often the font instruction will have other attributes with it.
example
<font face="times new roman" size="5" color="#850000">
```
<br>
```

<pre> ...... </pre>  To have text line up exactly the way you type it in.
example:
<pre>
For information contact: Jane
                         Department of Housing
</pre>

Lesson 4

<a href="web location"> ...... </a> Link to a web site
Example: <a href="http://www.chs.riverview.wednet.edu">Go to CHS Home Page</a>
<a href="mailto:common email address"> ...... </a> Email Link
Example: <a href="mailto:webmaster@davesite.com">Dave</a>
<img src="location of image"> To insert an image--this often has other attributes included:

Basic example: <img src="ghost.jpg"> To insert an image located in the same folder as the page you are putting it on.

More advanced example:
<img src="http://www.davesite.com/davesmll.gif" width="200" height="50" align="right" alt="Dave's Site">

This includes a width and height for the image, a description of what the image is suppose to be in case it does not come up (alt), and an instruction to align the image to the right.

Lesson 5

Alignments
<center> ...... </center>
<align="center"> . . . </align>
<div align="center"> ...... </div> Recommended way to center
The attribute to set center alignment within a tag is align="center"
Example= <h1 align="center">
More attributes to put in the BODY tag:
background=" location of image" inserting an image for your background
bgcolor="#hexadecimal"
link="#hexadecimal"
vlink="#hexadecimal"
alink="#hexadecimal"
text="#hexadecimal"

Example: <body bgcolor="#FFFFFF" link="#FF0000" vlink="#00FF00" alink="#0C0C0C" text="#085000">

Lesson 6

Clean code means that your HTML coding follows all specifications. Here are a few ways to keep your code clean:

Use quotes around values in attributes... For example, if you want a horizontal rule that is half of the screen width, type <hr width="50%"> rather than <hr width=50%>, or if you want one that is size 5 type <hr size="5"> rather than <hr size=5>.
Don't overlap tags... Overlapping occurs when Tag A starts, Tag B starts, Tag A closes, then Tag B closes. This will cause errors in sensitive browsers. For Example, it will not render correctly in Navigator 4.0 Beta1, Netscape purposefully built into the browser so developers could catch errors. Examples:
- Wrong Way (Overlaps):
  <font size="+1"><b>This is Bold and One Font Size Bigger</font></b>
  Right Way (Doesn't Overlap):
  <font size="+1"><b>This is Bold and One Font Size Bigger</b></font>
- Wrong Way (Overlaps):
  <a href="here.html"><i>This link is italicized</a></i>
  Right Way (Doesn't Overlap):
  <a href="here.html"><i>This link is italicized</i></a>

The Comment Tag--If you are writing an HTML document, sometimes you may want to put little reminders to yourself with your code so that you will be able to interpret your coding better. A comment will not appear in a web browser when the page is displayed... it is only visible when the source code is viewed.

You start commented text with 
Example of a comment tag:

Lesson 7--Lists

Unordered lists--The <ul> tag is the opening Unordered List Tag. Between these two tags you place LIST ITEMS, each one having an individual <li> opening tag. (If you want, you can use an optional </li> closing tag, but it is not needed.) There is no limit to the number of List Items you may have in a single list.

The code below: <ul> <li>pencils <li>pens <li>erasers <li>paper <li>glue </ul> will produce:
- pencils
- pens
- erasers
- paper
- glue

Ordered list

The code below <ol> <li>pencils <li>pens <li>erasers <li>paper <li>glue </ol> will produce:
1. pencils
2. pens
3. erasers
4. paper
5. glue

Lessons 8 and 9

<a href = “http://www.yahoo.com">Yahoo</a>

<a href= “#part2”> Part 2—College</a>

<a name= “part2”> Part 2—College</a>