Beginning Web Publishing

by

M. Scott Gartner

This page is intended to go along with the talk on beginning web publishing and HTML codes that I gave on July 15th, 1998 at the Boise Internet User's Group Meeting. You are welcome to use this page and the accompanying PowerPoint presentation to give your own talk, but I do ask that you give me some credit. It would also be nice if you would send me some e-mail telling me what use you put this page and/or the presentation to, so that I can tell if should do this with future presentations.

Color codes

Color Codes from http://www.infi.net/wwwimages/colorindex.html

White rgb=#FFFFFF
Red rgb=#FF0000
Green rgb=#00FF00
Blue rgb=#0000FF
Magenta rgb=#FF00FF
Cyan rgb=#00FFFF
Yellow rgb=#FFFF00
Black rgb=#000000
Aquamarine rgb=#70DB93
Baker's Chocolate rgb=#5C3317
Blue Violet rgb=#9F5F9F
Brass rgb=#B5A642
Bright Gold rgb=#D9D919
Brown rgb=#A62A2A
Bronze rgb=#8C7853
Bronze II rgb=#A67D3D
Cadet Blue rgb=#5F9F9F
Cool Copper rgb=#D98719
Copper rgb=#B87333
Coral rgb=#FF7F00
Corn Flower Blue rgb=#42426F
Dark Brown rgb=#5C4033
Dark Green rgb=#2F4F2F
Dark Green Copper rgb=#4A766E
Dark Olive Green rgb=#4F4F2F
Dark Orchid rgb=#9932CD
Dark Purple rgb=#871F78
Dark Slate Blue rgb=#6B238E
Dark Slate Grey rgb=#2F4F4F
Dark Tan rgb=#97694F
Dark Turquoise rgb=#7093DB
Dark Wood rgb=#855E42
Dim Grey rgb=#545454
Dusty Rose rgb=#856363
Feldspar rgb=#D19275
Firebrick rgb=#8E2323
Forest Green rgb=#238E23
Gold rgb=#CD7F32
Goldenrod rgb=#DBDB70
Grey rgb=#C0C0C0
Green Copper rgb=#527F76
Green Yellow rgb=#93DB70
Hunter Green rgb=#215E21
Indian Red rgb=#4E2F2F
Khaki rgb=#9F9F5F
Light Blue rgb=#C0D9D9
Light Grey rgb=#A8A8A8
Light Steel Blue rgb=#8F8FBD
Light Wood rgb=#E9C2A6
Lime Green rgb=#32CD32
Mandarian Orange rgb=#E47833
Maroon rgb=#8E236B
Medium Aquamarine rgb=#32CD99
Medium Blue rgb=#3232CD
Medium Forest Green rgb=#6B8E23
Medium Goldenrod rgb=#EAEAAE
Medium Orchid rgb=#9370DB
Medium Sea Green rgb=#426F42
Medium Slate Blue rgb=#7F00FF
Medium Spring Green rgb=#7FFF00
Medium Turquoise rgb=#70DBDB
Medium Violet Red rgb=#DB7093
Medium Wood rgb=#A68064
Midnight Blue rgb=#2F2F4F
Navy Blue rgb=#23238E
Neon Blue rgb=#4D4DFF
Neon Pink rgb=#FF6EC7
New Midnight Blue rgb=#00009C
New Tan rgb=#EBC79E
Old Gold rgb=#CFB53B
Orange rgb=#FF7F00
Orange Red rgb=#FF2400
Orchid rgb=#DB70DB
Pale Green rgb=#8FBC8F
Pink rgb=#BC8F8F
Plum rgb=#EAADEA
Quartz rgb=#D9D9F3
Rich Blue rgb=#5959AB
Salmon rgb=#6F4242
Scarlet rgb=#8C1717
Sea Green rgb=#238E68
Semi-Sweet Chocolate rgb=#6B4226
Sienna rgb=#8E6B23
Silver rgb=#E6E8FA
Sky Blue rgb=#3299CC
Slate Blue rgb=#007FFF
Spicy Pink rgb=#FF1CAE
Spring Green rgb=#00FF7F
Steel Blue rgb=#236B8E
Summer Sky rgb=#38B0DE
Tan rgb=#DB9370
Thistle rgb=#D8BFD8
Turquoise rgb=#ADEAEA
Very Dark Brown rgb=#5C4033
Very Light Grey rgb=#CDCDCD
Violet rgb=#4F2F4F
Violet Red rgb=#CC3299
Wheat rgb=#D8D8BF
Yellow Green rgb=#99CC32


Character formatting codes

Logical Styles
Name Syntax Example
Strong <strong>text</strong> text
Emphasis <em>text</em> text
Cite <cite>text</cite> text
Keyboard <kbd>text</kbd> text
Fixed Width <samp>text</samp> text
Code <code>text</code> text
Physical Styles
Name Syntax Example
Bold <b>text</b> text
Italic <i>text</i> text
Typewriter <tt>text</tt> text
Superscript text<sup>text</sup> texttext
Subscript text<sub>text</sub> texttext


Font formatting codes

<font size= N >...text... </font>
"N" is the font size.
Valid font sizes are 1 to 7 (default size is 3) Seven, Six, Five, Four, Three, Two, One
<font color=" color ">...text... </font> You can use the color names shown, or the #RRGGBB values shown above. Black, Maroon, Green, Olive, Navy, PSilver, Red, Lime, Yellow, Blue, Fuchsia, Aqua, White.


Special Characters

For more characters see: http://www.uni-passau.de/~ramsch/iso8859-1.html

Commonly Used Special Characters [iso8859-1 table]
Name Syntax Example   Name Syntax Example
Ampersand &amp; &   Superscript 2 &#178; ²
Less Than &lt; <   Superscript 3 &#179; ³
Greater Than &gt; >   plus/minus &#177; ±
Double Quote &quot; "   one quarter &#188; ¼
Copyright &copy; ©   one half &#189; ½
Registered &#174; ®   three quarters &#190; ¾
Superscript 0 &#176; °   divide &#247; ÷
Superscript 1 &#185; ¹


Division Tag

Used to control the alignment of a section (or the entirety) of a document.

<div align=left|center|right|justify clear=left|right|all>

<div align=center>
<h2>Section Heading</h2>
<p>The text for this section is centered.</p>
</div>

Section Heading

The text for this section is centered.

<div align=right>
<h2>Section Heading</h2>
<p>The text for this section is right aligned.</p>
</div>

Section Heading

The text for this section is right aligned.




Paragraph Tag

<p align=left|center|right|justify> . . . </p>

<p>
The default paragraph is the same as if you had put align=left in there. </p>

The default paragraph is the same as if you had put align=left in there.


<p align=justify>
The time has come when anyone who wants to inflict, uh, I mean, allow others to read their prose can do so without having to pay large amounts of money to the commercial publishing houses. </p>


The time has come when anyone who wants to inflict, uh, I mean, allow others to read their prose can do so without having to pay large amounts of money to the commercial publishing houses.


<p align=center>
The result of this state of affairs<br>is that there is a lot of great information<br>available for free on the Internet.</p>


The result of this state of affairs
is that there is a lot of great information
available for free on the Internet.


<p align=right>
It also means that you often have to open<br> a large number of smelly, slimy, and useless<br> oysters before you find that one beautiful pearl. </p>


It also means that you often have to open
a large number of smelly, slimy, and useless
oysters before you find that one beautiful pearl.



Break Tag

The break tag <br> causes the web browser to begin a new line.

<p align=center>
It also means<br> that you often<br> have to open<br> a large number of smelly,<br> slimy, and useless<br> oysters before you find<br> that one beautiful pearl. </p>

It also means
that you often
have to open
a large number of smelly,
slimy, and useless
oysters before you find
that one beautiful pearl.



No Break Tag

Keeps the browser from breaking the text (adding a carriage return).

Today's date is <nobr>Wednesday the 15th July 1998.</nobr> Today's date is Wednesday the 15th July 1998.


Heading Tags

The heading tags <H1> through <H6> cause the web browser to show the text in descending levels of both font and strength. Many word processors will translate these to chapter, section, etc. codes when the web page is imported.

<H1>A Terrific Heading</H1>

A Terrific Heading

<H2>A Terrific Heading</H2>

A Terrific Heading

<H3>A Terrific Heading</H3>

A Terrific Heading

<H4>A Terrific Heading</H4>

A Terrific Heading

<H5>A Terrific Heading</H5>
A Terrific Heading
<H6>A Terrific Heading</H6>
A Terrific Heading


Comment Tag

The comment tag will keep the browser from processing a section of an HTML file.

<!-- This is an HTML comment and anything within it will be ignored -->

<!-- You can even put other <b> tags within it and they will be ignored. -->

<!-- <H1>This header is hidden</H1> -->

Since comments are not hidden you will have to use "View Source" to see the samples.



Horizontal Rule Tag

The horizontal rule tag can be used as a seperator between sections or as a highlight somewhere in a page.

<hr>
<hr align=left width=100>
<hr align=center size=10 width=100>
<hr size=10 width=50%>

Last updated Saturday, August 30, 2003.
Send mail to me at sgartner@pingbot.com
Copyright © 1997-2003 M. Scott Gartner