Using HTML tags to jazz up your messages

A "tag" is an HTML code enclosed in < >. Some tags stand alone, but most require an "end tag" in the form </ >. The attribute runs from the tag to the end tag. The tag itself is not shown on the rendered page. (The visible characters < and > on this page are faked.)

General hints

1. To practice HTML open a word processing file, write your code, then save the file. In Explorer change the file extension from ".doc" or ".txt" to ".htm". (Some operating systems hide these extensions. You may have to consult your Windows or MacOS help file to see how to display them.) Once the document is renamed with the .htm extension, double clicking it should open it in your web browser.
2. In many browsers you can use a menu command to open a text file showing the source code. The command in Internet Explorer, for instance, is View>Source. When you see something you like on someone's web page, view the source and see how it was done. Check the source for this page, and see if you can figure out how I faked the HTML code that you see.
3. For more information about HTML see the excellent tutorial at Professional Web Design.

HTML Tags useful in posting to message boards

Simple tags without arguments

<B></B>

The bold tag makes text <B>bold</B>.

<BLOCKQUOTE></BLOCKQUOTE>

The Blockquote tag starts a new line and sets off text.

<BLOCKQUOTE>Blockquote text is set off with wider margins. It is useful for longer quotations inside other text.</BLOCKQUOTE>

<BR>

The Break tag inserts a line break, which results in starting a new line<BR>
without an extra space between the lines. Note: this tag does not require an end tag.

<CENTER></CENTER>

The Center tag centers the text included. Example, </CENTER>This text is centered.<CENTER>

<H1></H1>

The Heading styles render the enclosed text in Heading styles. Headings include H1 through H6. Examples,

<H1>Heading 1</H1>

<H2>Heading 2</H2>

<H3>Heading 3</H3>

<H4>Heading 4</H4>

<H5>Heading 5</H5>

<H6>Heading 6</H6>

<I></I>

The Italic tag makes text <I>italic</I>.

<P>

The Paragraph tag starts a new paragraph with an extra line space before it. Some message boards will not start a new paragraph without one, even if you hit the Enter key. Truthtree will, so this tag isn't necessary here. The <P> tag can be used with an end tag to set some paragraph characteristics.

<PRE></PRE>

The Preformat tag displays text exactly as typed, including extra spaces, etc. (HTML usually doesn't allow "spacing over" and displays more than one space at a time as one space.) Example,
Extra space,

<PRE>Extra    space</PRE>

.

<S></S>

Renders text in <S>strikethrough</S>.

<SMALL></SMALL>

The Small tag renders the text <SMALL>smaller</SMALL> than the default. (See the Font tag.)

<SUB></SUB>

The Subscript tag renders the text in <SUB>_subscript</SUB>.

<SUP></SUP>

The Superscript tag renders the text in <SUP>^superscript</SUP>.

<U></U>

The Underline tag renders the text <U>underlined</U>.

Nesting

HTML tags can be nested, but it works better if you keep the nesting in order.
<B><I>text</I></B>, not <B><I>text</B></I>.

Tags with arguments

<FONT></FONT>

The Font tag formats the included text in three ways.

1. The arguments include Style, which displays the text in a particular named font provided the font is loaded on the displaying computer. There are also two generic designations that usually work. Example,
   <FONT FACE="sans-serif">text without serifs</FONT>
   <FONT FACE="serifed">text with serifs</FONT>.

2. The next argument is Color, which displays the text in a color other than the browser default. The most reliable way to designate the color is with a hexadecimal (six-character) number. The number is divided into three two-digit sections, with the first section controlling the color red, the second controlling the color green, and the third controlling the color blue. Each digit can have sixteen values from 0 to 9 and a through f. Examples,
   <FONT COLOR="#ff0000">colored text</FONT>
   <FONT COLOR="#ff9933">colored text</FONT>
   <FONT COLOR="#666666">colored text</FONT>

3. The last argument is Size, which changes the size of the text. The size is designated with numbers from 1 to 7. Examples,
   <FONT SIZE="1"> Font size n the tag and the end tag. For example, <A HREF="http://junior.apk.net/~jbarta/" TITLE="PWD">
   Professional Web Design</A>. (Bonus: this site has an excellent HTML beginner's tutorial.) The optional Title argument specifies the text that appears when the link is selected.

   To set up a link for an email address, include "mailto:" in the link. Send email to
   < A HREF="mailto:larnold@ktc.com">Larry Arnold</A>.

   <IMG></IMG>
   The Image tag displays an image, stored somewhere on the net, in the current document. (<IMG SRC="http://www.talonsite.com/images/talon32.gif" ALIGN=MIDDLE ALT="TalonSite" HEIGHT="32" WIDTH="32" HSPACE="2">) Note the Source tag does not have an end tag. Arguments are:

   1. SRC designates the URL source of the image.
   2. ALIGN designates the alignment of the image in relation to the surrounding text. Values include TOP, MIDDLE, CENTER, BOTTOM, LEFT, and RIGHT. The LEFT, and RIGHT values float the image to the side, and allow text to wrap around it.
   3. ALT designates the text that appears in many browsers when you point to the image, and that appears in the image box before the image is loaded.
   4. BORDER designates the width of the border displayed around an image used as a hyperlink.
   5. HEIGHT and WIDTH control the height and width of the image in pixels. Most of the time it works best to use the actual size of the image.
   6. HSPACE and VSPACE place a buffer of space around the image, in pixels.

   To make the image a hyperlink enclose it in an Anchor tag. <A HREF="http://www.talonsite.com/"></A>

Outline tag sets

Definition list

Bullet list

Ordered list

Tables

Conclusion

So have fun, be creative, go*get*atrocious.

Larry Arnold, 12/8/1999.