Writing <HTML>,
Code Tags and Their Uses!
Copyrighted © ´99 K. C. Crane ("The Web Pirate")
This is a brief quick
reference tutorial on HTML. It is not meant to suggest that this is all of
the of tags used in HTML. It should be used a quick guide to understanding
the most commonly used tags.
This is the way a page is
usually laid out when writing HTML code, with the HEAD and BODY sections, hopefully it will be
easy to follow. Please note if a close (</closetag>) is used to
avoid errors on your page. Also remember to close all tags NESTED within
tags in the reverse order so tags 1, 2, and 3 should close in order 3, 2,
and 1. Any text in RED on
this page is to attract your attention; if it is in PURPLE
it is to be replaced with your information
when you use it on your page.
<HTML>
Type of source code. Tag opens and closes all
documents. Try to make all tags capitalized. Needs close
</HTML> at end of page.
-
<HEAD>
Encloses document headers and nest around <TITLE>
& <BASE> & <ISINDEX> & <LINK> &
<SCRIPT> & <STYLE> and <META>
tags. This information is for the use of search engines and your home
computers. Needs close </HEAD> right
before body tag starts.
-
<TITLE>Name</TITLE>
Name as it appears at top of browser window.
This is read by both people and will be noticed by some search engines.
-
<BASE HREF="www.mysite.com/">
Eliminates need to type all but the last file
name on all links within your site. These links can now be shorten to FILENAME.FILETYPE
when putting them in the BODY of the page.
No close is
used.
-
<ISINDEX>
Informs computer, this is a searchable
document an index. No close is
used.
-
<LINK NAME="Name" HREF="url">
Indicates a relationship between this
document and some other object on the Web. No close is
used.
-
<SCRIPT>Script</SCRIPT>
Contains either JAVA Script or VB Script for that
page.
-
<STYLE>Style</STYLE>
Contains information used by cascading style
sheets on that page.
-
<META>
Tags used for client software and search
engine information. To find out more about
META Tags go to this site; The
Art of Business Web Site Promotion and
read the section on Search Engines. No close
is used.
</HEAD>
This
closes the BODY section of the document.
-
<BODY>
This is loads the default colors on your page for others
to see with their computers. The defaults colors are a white background with black
text, all your unvisited
links will be blue, visited links purple, and links you just clicked on
will appear as red until you leave the page (for other colors or image
background see below). Needs close
</BODY> at end of document.
-
<BODY BACKGROUND="image"
BGCOLOR="color" LINK="color" VLINK="color" ALINK="color"
BGPROPERITIES="fixed">
Same as above, but you choose the colors
and/or images used. It is what everyone sees as the background image or
background color and the link colors. BGPROPERTIES="FIXED" is used only when using a
background image. Needs
close </BODY> at end of document.
-
<H#>Heading</H#>
Headers # 1
to 6 are headings. One is largest and six is
smallest. They consist of two to five words usually.
-
<B>Text</B>
Bold text.
-
<I>Text</I>
Italic text.
-
<PRE>Text</PRE>
Contains preformatted text. Visual browsers
should render preformatted text in a fixed-pitch font, should not collapse
whitespace, and should not wrap long lines.
-
<CODE>Text</CODE>
Use to show a computer code sample.
It usually displays in Courier font. Preferable to font style elements
such as <TT> when marking up computer
code. Since spacing is often important when presenting computer code, the
<PRE> element can be useful as a container.
-
<TT>Text</TT>
Displays true type like a typewriter. Use for
single line or less where text can’t be separated.
-
<P>Text</P>
Starts a new text paragraph with a blank line
between paragraphs. Text can be alpha, numeric, punctuation and the tags<A
HREF>, <B>,
<I>, or <BR> can be used.
-
<BR>
Break at end of line. No close is
used.
-
<IMG SRC="FileName.FileType"
WIDTH="#" HEIGHT="#" ISAMAP
or USEMAP>
Graphic images like .jpg, .gif, and so on. ISAMAP
or USEMAP can added for images that are click able maps with hidden url's.
No close is
used.
-
<A HREF="url or Link name">Text
and/or nested image</A>
The way to link to another site "url"
on the Internet, or an anchor spot "name"
on the same page (see below). These links can be shorten to FileName.FileType
if they are on your site.
-
<A NAME="Link_name">Text</A>
An Anchor spot on the same page. Name should match "name"
in the Link.
-
<A NAME="Link_name" A HREF="url">Text</A>
This Link is done this way to go to anchor
spot "name" on page and then new to a new "url".
-
<PRE>Formatted Text</PRE>
Formatted list in rows and columns. Appears
as typed and spaced in plain text.
-
<HR>
Horizontal line. No close is
used.
-
<ADDRESS>Info</ADRESS>
List of address for contact information like email,
address, or phone number at end of document.
-
<BLOCKQUOTE>Quote</BLOCKQUOTE>
Quotes from other documents. Long quotes
should be in <P> paragraph form and use <BR> break to end lines as needed.
-
<OL> <LI>Item</LI>
</OL>
Order list. <LI>
is the items. With no limit to # of items<LI>
on the list. <LI> doesn't have a close. They appear with no heading (unless nested <OL><LI><OL><LI></OL></OL>).
They do have an alpha or numeric designator beside each item as assigned by
the computer.
-
<UL> <LI>Item</LI>
</UL>
Unordered list are the same rules as the
ordered list, but with bullets for designator.
-
<DL> <DT>Text</DT>
<DD>Text</DD> </DL>
Definition list. <DT>
(no limit to # of <DT> & <DD>)
items are what are to be defined; the <DD>
is the definition of each <DT>. They will appear in an outline form
(see <DFN> below).
-
<DFN>Text</DFN>
Single definition (word and definition all in
one).
-
<CITE>Text</CITE>
Citation of another source i.e. author or publication.
</BODY>
This closes the BODY section of the document.
</HTML>
This closes the HTML document.
For a more detailed tutorial on HTML go to the
Web Design Group site.
They have a downloadable tutorial on HTML
4.0 with over 100 pages. This is a reference study tutorial for
leaning and writing of HTML. It installs like a web site on your computer
working 95% offline with some pages only available online. It
includes a tutorial and samples of all the subject matter laid out in web
site format.
|
