> 190 URLs
WELCOME to williamson-labs.com   --SITE MAP  --INDEX --HOME
> 90 Subjects
ORDER CD-ROM-ORDER CD-ROM
Copyright 1999 2000  2001   Web Author: Glen A. Williamson webmaster@williamson-labs.com
      b e tt e r
How to Write/Make  .html Web Pages
 ^
NEW! Learn how to bring FREE, targetted TRAFFIC to your Web site with 
Get your FREE trial here!
-Read of our Experience using WebPosition Gold
---

Buy your ~ .html/Technical Books 
HTML
The Definitive Guide  3rd. Ed. 
(HTML 4.0) 
Musciano & Kennedy
O'Reilly
 
Under Construction in Perpetuity

Contents
 Useful LINKS Baby's First Page Multiple Windows
  Interactive Color Chart Image Map Coords Explained
Best Viewed 4.75 Links to Other .html Resources Tables
  ~/.gif Animations Link to Named Targets 
    More Tables
  Tools used on this Page Gadgets
First You See the Table
        BORDER="1"> 
 		 "Things" are Held 
in Place by Tables 
 		 And Then You Don't
BORDER="0">
Useful LINKS
Under Construction in Perpetuity

Contents
Baby's First Page Multiple Windows
Interactive Color Chart Image Map Coords Explained
Best Viewed  Links to Other .html Resources Tables
Link to Named Targets 
More Tables
Tools used on this Page Gadgets
 

TOP

These are the basic elements of an .html page
<HTML> 
    <HEAD> <TITLE> </TITLE> </HEAD>

    <BODY> 
    </BODY> 

</HTML>
<HTML>

<HEAD> <META NAME="editor" CONTENT="HTML example"> 

    <TITLE> Baby's First Page </TITLE> 
</HEAD>

<BODY BGCOLOR="#C0C0C0" TEXT="#000000" LINK="#0000FF" VLINK="#DF00DF" ALINK="F#10000">

<FONT COLOR="#000000"> Words & Pictures, Thoughts & Ideas, make up the BODY of the .html </FONT>

</BODY>

</HTML>

TOP
Words & Pictures, Thoughts & Ideas, make up the BODY of the .html
<HTML>

HEAD> <META NAME="editor" CONTENT="HTML example"> 

    <TITLE> Baby's First Page </TITLE> 
</HEAD>

<BODY BGCOLOR="#C0C0C0" TEXT="#000000" LINK="#0000FF" VLINK="#DF00DF" ALINK="F#10000">

<P><FONT COLOR="#000000">Words & Pictures,<BR>Thoughts & Ideas,<BR>make up the BODY of the .html </FONT></P>

</BODY>

</HTML>
Words & Pictures, 
Thoughts & Ideas 
make up the BODY of the .html
<CENTER><P><B><FONT COLOR="#FF0000">Words & Pictures,<BR>Thoughts & Ideas,</FONT></B><BR><FONT COLOR="#0000FF">make up the BODY of the .html </FONT></P></CENTER>
Words & Pictures,
Thoughts & Ideas, 
make up the BODY of the .html
<CENTER><P><B><FONT COLOR="#FF0000">Words & Pictures,<BR>Thoughts & Ideas,</FONT></B></P></CENTER>
<P><FONT COLOR="#FF00FF">make up the BODY of the .html</FONT></P>
Words & Pictures, 
Thoughts & Ideas,

make up the BODY of the .html

TOP
Inserting an Image
<img SRC="images/net3now.gif" height=119 width=93>

TOP

Four Independent Windows Check it Out
TOP
Click on image "Hot Spots"
Linking with image maps
Hold the cursor (hand) over the different colored signs and read the "Target" names.

Next, click on the colored signs.


<P><IMG SRC="signpost.gif" HEIGHT="354" WIDTH="464" ALIGN="RIGHT" usemap="#signpst"></P>

NOTE:
...the usemap="#signpost"> refers to the image map below		 Sign Post
TOP
<P><MAP name="signpst">
<AREA shape="polygon" coords="35,50,197,29,198,54,39,72,22,59" href="#yellow-left">
<AREA shape="polygon" coords="245,41,403,54,418,69,396,85,244,72" href="#dk-green-right">
<AREA shape="polygon" coords="250,107,417,96,439,109,420,124,244,135" href="#cyan-right">
<AREA shape="polygon" coords="243,186,415,167,438,179,416,197,242,219" href="#white-right">
<AREA shape="polygon" coords="244,248,370,227,384,238,369,258,244,274" href="#yellow-right">
<AREA shape="polygon" coords="243,169,262,177,247,182,241,177" href="#blue-top-right">
<AREA shape="polygon" coords="297,214,346,209,350,219,333,227" href="#blue-bot-right">
<AREA shape="polygon" coords="34,276,200,276,201,308,32,308,11,287" href="#blue-left">
<AREA shape="rect" coords="21,208,204,240" href="#red-left-rectangle">
<AREA shape="polygon" coords="113,199,204,154,202,181,154,203" href="#orange-left">
<AREA shape="polygon" coords="160,103,201,92,201,114" href="#mag-left-top">
<AREA shape="polygon" coords="81,135,122,143,82,153,71,143" href="#mag-left-bot">
<AREA shape="polygon" coords="78,91,209,126,208,154,66,121,52,99" href="#lt-green-left">
<AREA shape="polygon" coords="207,27,207,114,214,121,214,160,203,172,206,352,242,352,241,331,231,327, 239,285,240,4,205,3" href="#post">
<AREA shape="rect" href="#outside" 
coords="0,0,463,353"></MAP></P>

</BODY> </HTML>

TOP

  Image Map coords Explained 
<AREA shape="rect" coords="5,502,78,567" href="http://...">

TOP

<AREA shape="polygon" coords="35,50,197,29,198,54,39,72,22,59" href="yellow-left">
<AREA shape="polygon" coords="245,41,403,54,418,69,396,85,244,72" href="dk-green-right"
<AREA shape="polygon" coords="250,107,417,96,439,109,420,124,244,135" href="cyan-right">
<AREA shape="polygon" coords="243,186,415,167,438,179,416,197,242,219" href="white-right">
<AREA shape="polygon" coords="244,248,370,227,384,238,369,258,244,274" href="yellow-right">
<AREA shape="polygon" coords="243,169,262,177,247,182,241,177" href="blue-top-right">
<AREA shape="polygon" coords="297,214,346,209,350,219,333,227" href="blue-bot-right">
<AREA shape="polygon" coords="34,276,200,276,201,308,32,308,11,287" href="blue-left">
<AREA shape="rect" coords="21,208,204,240" href="red-left-rectangle"> 
<AREA shape="polygon" coords="113,199,204,154,202,181,154,203" href="orange-left"> 
<AREA shape="polygon" coords="160,103,201,92,201,114" href="mag-left-top"> 
<AREA shape="polygon" coords="81,135,122,143,82,153,71,143" href="mag-left-bot"> 
<AREA shape="polygon" coords="78,91,209,126,208,154,66,121,52,99" href="lt-green-left"> 
<AREA shape="polygon" coords="207,27,207,114,214,121,214,160,203,172,206,352,242,352,241, 331,231,327,239,285,240,4,205,3" href="post">
<AREA shape="rect" href="outside" coords="0,0,463,353">

TOP

--- T a b l e s ---

 
Beginning of TABLE 
<TABLE BORDER=1 CELLSPACING=2 CELLPADDING=6 WIDTH="600" HEIGHT="400" >
TOP
<TR> Beginning of a ROW
<TD> Beginning of CELL Data

End of CELL Data </TD>

 <TD> Beginning CELL Data
 

End of CELL Data </TD>

 <TD> Beginning CELL Data
 

End of CELL Data </TD>

 <TD> Beginning CELL Data

End of CELL Data </TD> 
End of a ROW</TR> 
<TR> 
<TD COLSPAN="4">    COLumn SPAN allows "gap tooth" tables

</TD>
<TR> 
<TD> 

</TD>

 <TD COLSPAN="2"> 

</TD>

 <TD> 
</TD> 
</TR> 
<TR> 

<TD> 

</TD>

 <TD> 
</TD>		 <TD> 
</TD>		 <TD> 
</TD>
</TR> 
End of TABLE </TABLE>
TOP

--- Alignment ---

ALIGN LEFT
ALIGN CENTER
ALIGN RIGHT
 		  
VALIGN TOP

 

 VALIGN CENTER VALIGN BOTTOM VALIGN BASELINE
    HSPACE="8" VSPACE="12"    

TOP

-- Table Borders --
A
B
C
D
 		 Border Width = 1 
Cell Spacing = 1 
Cell Pading = 1
A
B
C
D
 		 Border Width = 4 
Cell Spacing = 4 
Cell Pading = 1
A
B
C
D
 		 Border Width = 10 
Cell Spacing = 10 
Cell Pading = 1
A
B
C
D
 		 Border Width = 0 
Cell Spacing = 1 
Cell Pading = 1
TOP
Tables are         Where It's At!
These are 
Cells		 No Cell Below 
Because there is Nothing in it		 push-----> <----
  Images
Also
 
Empty Cell --> 
  
. The 
      more you 
                  Add the 
                    Larger 
        the Cells
g e t .		 |
|
V		 ^ 
| 
| 
| 

TOP

..                   Links
.
 
 

.

.

.

.

.

..

TOP

Background Colors Background Colors
Background Colors Background Colors

TOP

Background Textures Created by "WallPaper" Images (~/.gif ~/.jpg)
TOP

COLLECTION ofGadgets!
Images, ~/.gif, ~/.jpg
 
TOP
TOP

LINKS
The Web Developer's Virtual Library
Gamelan - The Official Directory for Java
HotWired Network
Anthony's Icon Library		 An Encounter on the Road
OneWorld/SingNet WWW & HTML Developer 's JumpStation - ver 2.0 (21 Oct 1994)

TOP

Tools Used in the Construction of this Web Page:
  • AMIGA A2000 Computer
  • Deluxe Paint-V by Electronics Arts  http://www.ea.com
  • WinTel clones 486 DX4, K6 233, K7 550
  • Windows95/98  http://www.microsoft.com
  • Animagic GIF Animator Version 1.21  http://www.rtlsoft.com/animagic
  • HTML Assistant Pro 97, sales@brooknorth.com
  • MapEdit, 2.24  http://www.boutell.com/mapedit
  • Netscape Page Composer 4.75  http://www.netscape.com (best of the 4.xx series)
  • Paint Shop Pro 7.02, JASC, Inc.  http://www.JASC.com
  • UltraEdit32  6.00  HEX editor    http://www.ultraedit.com/  (best editor I have used) v8.10b available
  • Pro Motion 4.2  (PC version of the AMIGA Deluxe Paint-V)  http://www.cosmigo.com/promotion/

    •  

    TOP

         Web Author:

    Glen A. Williamson 
     Copyright 1999 2000  2001   Web Author: Glen A. Williamson webmaster@williamson-labs.com

    --- T h e  E n d ---