Appendix B

HTML Quick Reference Guide

by John Jung

CONTENTS

Elements in the HEAD
Elements in the BODY

HTML is made up of a lot of different elements. Each element behaves differently from all the other HTML tags. Some of them are so straightforward that you only need to invoke them and they'll be used. Others require beginning and ending markers for the element's behavior to be applied to the enclosed text.

For those tags that do have attributes, most of them are optional. To use a specific attribute, you must include the attribute name, the equal sign (=), and the value to set it to. Invalid values are automatically ignored by most Web browsers. The assignment of attributes is done inside the starting marker of the particular HTML element that you want to use.

Every HTML document must be enclosed within the <HTML> starting marker and the </HTML> ending marker. Between these two markers is the actual Web page. The content of a particular HTML document is made up of head and body portions. The information for the head portion is enclosed within the <HEAD> and </HEAD> markers. The information for the body portion is enclosed within the <BODY> and </BODY> markers.

The following list is not intended to be a complete list of every HTML tag and its attributes (see Appendix A, "HTML Tags"). This is meant as a list of commonly used elements and their commonly used attributes.

Elements in the HEAD

<BASE>-This is used to indicate the default location of relative URL links. Common attributes:
HREF-Baseline URL for relative links.
TARGET-Indicates in which window to display the destination hypertext link.
<ISINDEX>-This is used to indicate that the entire home page can be searched by keywords.
<LINK>-This is used to specify relationships to other HTML documents. Commonly used attributes:
HREF-Destination URL to establish a relationship with.
REL-Indicates relationship with destination document.
REV-Used to verify a reversed relationship with destination document.
TITLE-The title for the destination URL.
<TITLE></TITLE>-You can specify the document's title with this element.

Elements in the BODY

The majority of tags are specified in within the BODY elements. Typically, anything contained inside the start and end markers will be displayed. The following sets of related elements are all available:

Text Elements

This group of tags is used to apply general attributes to a group of text. Typically, these elements are word wrapped by the browser.

<BLOCKQUOTE>[Text]</BLOCKQUOTE>-This will cause [Text] to be displayed as quoted text.
<P>[Text]</P>-The [Text] is treated as if it were an entire paragraph by itself. The [Text] will be word wrapped.
<PRE>[Text]</PRE>-The [Text] will be displayed as it is, but not in a proportional font. Use this if you've already had some text lined up in ASCII, such as in tables and grids. Commonly used attribute:
WIDTH-Maximum number of characters per line.

Hypertext Links

Hyperlinks are the underlying component of the Web.

<A>[Text]</A>-This defines that [Text] is a hypertext link. If the <IMG> element is used in place of [Text], the image will be hyperlinked. Common attributes:
HREF-URL to link to.
NAME-Defines the current line as a destination point. Destination points are accessed by specifying the pound sign (#) followed by the desired NAME.
TARGET-This indicates the name of the window to display the destination URL.
TITLE-The title of the destination URL.

Headers

Header elements are used to provide a consistent look for your document. There are no commonly used attributes for these elements.

<H1>[Text]</H1>-[Text] is displayed in the most prominent header.
<H2>[Text]</H2>-[Text] is displayed in the second most prominent header.
<H3>[Text]</H3>-[Text] is displayed in the third most prominent header.
<H4>[Text]</H4>-[Text] is displayed in the third least prominent header.
<H5>[Text]</H5>-[Text] is displayed in the second least prominent header.
<H6>[Text]</H6>-[Text] is displayed in the least prominent header.

Logical Text

Logical style elements define attributes for a group of text. The text is automatically word wrapped by the browser.

<CITE>[Text]</CITE>-This tag is used to indicate that the [Text] is a citation.
<CODE>[Text]</CODE>-The [Text] is displayed as being computer source code.
<DFN>[Text]</DFN>-[Text] will be displayed as if it were a definition. There are no commonly used attributes.
<EM>[Text]</EM>-The [Text] is emphasized in some way. There are no commonly used attributes.
<KBD>[Text]</KBD>-This tag is used to display [Text] as something to be typed on the keyboard. There are no commonly used attributes.
<SAMP>[Text]</SAMP>-To display [Text] as a sampling of something, such as from an article, use this element. There are no commonly used attributes.
<STRONG>[Text]</STRONG>-This element displays the [Text] as more emphasized than <EM>. There are no commonly used attributes.
<VAR>[Text]</VAR>-This displays [Text] as some sort of variable, such as for formulas. There are no commonly used attributes.

Physical Styles

This group of HTML elements is used to affect the visual display of text. There are no commonly used attributes for these elements.

<B>[Text]</B>-[Text] will be made boldface.
<I>[Text]</I>-[Text] will be set in italics.
<TT>[Text]</TT>-[Text] will be made to look as though it came from a teletype.
<U>[Text]</U>-[Text] will be underlined.

Definition List

This list type allows you to present a dictionary-type presentation of a definition. The left-hand side has the word, <DD>, and the right-hand side has the definition, <DT>.

<DL>[Definitions]</DL>-This is the main container for a definition list. It has the following commonly used attribute:
ALIGN-Specifies that the text for the definitions is to be aligned centered, justified, left, or right.
<DD>[Text]</DD>-This element is used to specify that [Text] is the definition portion of the definition list. It will be displayed on the right-hand side of the screen. There are no commonly used attributes.
<DT>[Text]</DT>-This element is used to specify that [Text] is the term portion of the definition list. It will be on the left-hand side of the screen. There are no commonly used attributes.

Unordered (Bulleted) List

You can create a list with a bullet in front of each item.

<UL>[List of items]</UL>-This presents [List of items] as an unordered (bulleted) list.
<LI>[Text]</LI>-[Text] will be an item in the list. There are no commonly used attributes.

Ordered (Numbered) List

You can create a list with a number in front of each item. The number is automatically added.

<OL>[List of items]</OL>-This presents [List of items] as an ordered (numbered) list.
<LI>[Text]</LI>-[Text] will be an item in the list. There are no commonly used attributes.

Directory List

You can create a list so that items appear to be a list of files from a directory.

<DIR>[List of items]</DIR>-This presents [List of items] that appears to be a list of files from a directory.
<LI>[Text]</LI>-[Text] will be an item in the list. There are no commonly used attributes.

Graphics

Graphics can be inserted into your home page very easily.

<FIG></FIG>-This element is intended to replace the <IMG> tag. Commonly used attributes:
ALIGN-This attribute indicates how the picture will be aligned. It has a number of acceptable values: bleedleft, bleedright, center, justify, left, or right.
HEIGHT-This value indicates the height of the image.
SRC-This points to an URL that contains the graphic to use.
WIDTH-This value indicates the width of the image.
<IMG></IMG>-This element is used to put a GIF or JPEG graphic into your home page. It has the following commonly used attributes:
ALIGN-This attribute indicates how the picture will be aligned.
It has a number of acceptable values: bleedleft, bleedright, center, justify, left, or right.
ALT-This string will be shown if the user doesn't have a graphical browser.
HEIGHT-This value indicates the height of the image.
ISMAP-This tells the Web browser that this graphic is an imagemap.
SRC-This points to an URL that contains the graphic to use.
WIDTH-This value indicates the width of the image.

Miscellaneous Tags

There are several unclassifiable, commonly used HTML tags.

<![Text]>-This element is completely ignored by the Web browser. The [Text] is treated as comments from the HTML author.
<ADDRESS>[Text]</ADDRESS>-This tag shows [Text] as an address of some sort. There are no commonly used attributes.