Basic HTML Tags
Article ID: KB101442
HTML
Your HTML document should always start with "<html>" and end with "</html>."
HEAD
Inside your HTML tags, you should have the HEAD element: <head> .... </head>.
The HEAD element contains information about the document. For example, the HEAD
element may contain the TITLE element, as well as other types of tags that
provide more description about the site that may be used by search engines.
TITLE
The TITLE element is nested inside of the HEAD tags. It looks something like
this:
<title>This is the title of a page.</title>
Titles should be descriptive! In fact, many search engines place a high
ranking on how "relevant" your title is compared to the rest of the content on
your page. So instead of:
<title>Introduction</title>
A better title would be:
<title>Introduction to Australian Shepherds</title>
BODY
The
BODY element usually comes after the HEAD element, and contains
everything that will show up in the browser window. We'll be talking more in the
next tutorials about things that can go in the BODY, but for now let's discuss
some of the attributes.
* Attributes that are marked with "*" mean that the attribute is
"deprecated." This means that while it will still work, you're encouraged not to
use it.
| BODY - Attributes |
onload
="[script]" |
This is typically used for
running a script, such as a JavaScript function, when the window first
loads. |
onunload
="[script]" |
This is typically used for
running a script, such as a JavaScript function, when the user leaves
the page. |
background*
="[image path]" |
This allows you to tile a
background image. This attribute is deprecated. You are recommended to
get the same effect using style sheets. |
bgcolor*
="[colorcode]" |
This allows you to set the
background color of a page. This attribute is deprecated. You are
recommended to get the same effect using style sheets. |
text*
="[colorcode]" |
This allows you to set the
normal text color for the page. This attribute is deprecated. You are
recommended to get the same effect using style sheets. |
link*
="[colorcode]" |
This allows you to set the
hyperlink color for links on the page. This attribute is deprecated. You
are recommended to get the same effect using style sheets. |
vlink*
="[colorcode]" |
This allows you to set the
color for hyperlinks that have been visited by the user. This attribute
is deprecated. You are recommended to get the same effect using style
sheets. |
alink*
="[colorcode]" |
This allows you to set the
color for hyperlinks that are "active," or being clicked, by the user.
This attribute is deprecated. You are recommended to get the same effect
using style sheets. |
Putting it all together...
In the intro articles, we showed you how to create a basic HTML page. We'll
take the same page but add a background color and different text color. Open a
new text document (in NotePad or SimpleText) and type in the following:
<html>
<head>
<title>A page with black background and yellow text</title>
</head>
<body bgcolor="#000000" text="#ffff00">
This page has a black background and yellow text, simply by setting some
attributes in the BODY tag. Please note that you can do the same thing using
style sheets, which is actually a much more efficient way of setting colors.
Style sheets are recommended - this method is not!
</body>
</html>
Save the document as "blackpage.htm," then open it in your web browser to
view it. You'll see something like this:
See live example!
In the next tutorial, we'll look at how to start adding text to your page!
Was this helpful?
Please rate this article:
Email address: (not required)
(Please provide your email address if you would like PixelMill support to follow-up with you about your comment. You're email address is NOT REQUIRED to submit a comment.)
Comments: (How can we improve this article?)
Clicking "Submit" will not clear this page.
link to this page:
http://www.pixelmill.com/support/al1065/kb101442.htm
permalink to this article:
http://www.pixelmill.com/support/kb101442.htm
Back to top