So, you want to make a Web Page!
INDEX
& Quick Reference

Basic Document Structure        Basic Text Formatting
Structural Formatting        Images        Links        Miscellaneous

 
Basic Document Structure
Go
<HTML>
<HEAD>
<TITLE>My big ole bad page!</TITLE>
</HEAD>
<BODY>
Hello Joe!
</BODY>
</HTML>

 

Basic Text Formatting
Go Make text bold: <B>Sample</B>
Go Make text italics: <I>Sample</I>
Go Make text underlined: <U>Sample</U>
Go Monospaced text: <TT>Sample</TT>
Go Change font size (sizes:1-7) <FONT SIZE=5>Sample</FONT>
Go Change the font name (face) <FONT FACE="fontname1,fontname2,etc">Sample</FONT>
Go Change the font color <FONT COLOR="#0000FF">Sample</FONT>
Go Section headings (1-6): <H1>Sample</H1>
Align the section heading: <H1 ALIGN="center">Sample</H1>
Go Change text, link, etc color for whole page
<BODY BGCOLOR="#123456" TEXT="#23456A" LINK="#3456AB" VLINK="#456ABC" ALINK="#56ABCD">
Go The Handy Dandy Font Viewer (intro page), Open viewer directly
Go The rollercoaster!

 

Structural Formatting
Go Line breaks <BR>
Go Multiple line breaks:
<BR>
<BR>
<BR>
Go New paragraph <P>
Go New paragraph + ALIGN <P ALIGN="left|center|right">
Go Old style centering: <CENTER>Sample</CENTER>
Go Horizontal Rule (plain default): <HR>
With a few parameters: <HR ALIGN="left" WIDTH=90% SIZE=1 NOSHADE>
Go Pull in your margins with Blockquote: <BLOCKQUOTE>Sample</BLOCKQUOTE>
Go Ordered(<OL>) and Unordered(<UL>) lists:
<OL>
<LI>List item
</OL>
Go Definition list (bold tags optional):
<DL>
<DT><B>Definition title</B>
<DD>Definition item
</DL>
Go Preformat tag:
<PRE>
Sample
   Sample
      Sample
</PRE>

 

Images
Go Inserting an image (gif or jpg):
<IMG SRC="myimage.gif" WIDTH=123 HEIGHT=456 ALT="My Image">
Go Specify background image (gif or jpg): <BODY BACKGROUND="mybackground.gif">
Go Save an image off of a page
Go Image sources (SRC) explained in detail.
Go About image sizes
Go Using thumbnails
Go Make lines out of a 1x1 dot
Go The incredible GIF Optimizer!

 

Links
Go Add a relative link <A HREF="page.html">My page</A>
Add an absolute link: <A HREF="http://www.yahoo.com/page.html">Yahoo's page</A>
Go Link to a particular section of a page:
<A HREF="page.html#cheesewiz">About Cheese Wiz</A>
Go Add an email link:
<A HREF="mailto:scottie@enterprise.com">Email Scottie</A>
Go Making an image a link:
<A HREF="page.html"><IMG SRC="mypic.gif" WIDTH=123 HEIGHT=456></A>
Go Get rid of the blue border around an image link
<IMG SRC="myimage.gif" WIDTH=123 HEIGHT=456 ALT="My Image" BORDER=0>
Go Absolute vs Relative URLs

 

Miscellaneous
Go Specify background color: <BODY BGCOLOR="#123456">
Go Specify background image (gif or jpg): <BODY BACKGROUND="mybackground.gif">
Go Color Picker
Go Tags in combination - Overlapping vs Nested tags
Go More about Overlapping vs Nested tags
Go About Netscape's 216 colors
Go Netscape's 216 color chart (image)
Go Netscape's 216 color chart (page)
Go Chart of 1536 colors (page)
Go Space code (special character for a space) &nbsp;
Go Six main special characters:
&nbsp;     non-breaking space
&lt;       < less-than symbol
&gt;       > greater-than symbol
&amp;      & ampersand
&quot;     " quotation mark
&shy;      ­ soft hyphen
Go A whole bucketful of special characters
Go About screen resolution
Go About screen resolution
Go Comment tag <!-- This is a comment -->
Go Save document as an HTML file
Go About files & file extensions

 

General Table
of Contents
Lessons
Intro - 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9 - 10
Index and
Quick Reference
Barebones
HTML Guide
PROFESSIONAL WEB DESIGN