Horizontal Rules
<HR WIDTH="40%">
A percentage of the width of the browser window.
<HR WIDTH="255"> Fixed width, the number of pixels it
will be wide.
<HR SIZE="4"> A 4-pixel horizontal rule
<HR noshade> it removes the shadow effect (white area) and leaves a grey line
<HR ALIGN="CENTER"
SIZE="4" WIDTH="255">
<HR ALIGN="CENTER" SIZE="4" WIDTH="40%">
<hr width=25% size=1>
<hr width=50% size=5>
<hr width=75% size=10>
<hr width=100% size=15>
<hr width=50% noshade size=5 >
<hr width=50% noshade size=10 >
IMAGES
<img src="filename.jpg" width="100" height="100" border="2" alt="text description">
|
width="100"
|
The width of the image in pixels. |
|
height="100"
|
The height of the image in pixels. |
|
border="2"
|
The border around the image, the default color is black. Easy way to highlight and let the image stand out. |
|
alt="text
description"
|
You can name the image or have a description that the viewer will be able to read if they have the loading graphics off or the image takes a while to load and fill the space. |
By using WIDTH and HEIGHT you will cut down the time it takes for a browser to load a HTML page. The browser reads all of the WIDTH and HEIGHT's on a page and leaves space for them to load while the text and everything else loads faster and fills in the page (the viewer has something to look at while waiting). Then the images load and fill in the blank spaces.
It's usefull for large images or when there are many images per page or a slow modem connection.
1x1 pixel image
<IMG SRC="1x1.gif"> 
the image is really tiny so look closely
<IMG SRC="1x1.gif"
WIDTH="40" HEIGHT="40">
<IMG SRC="1x1.gif"
WIDTH="120" HEIGHT="14">
<IMG SRC="1x1.gif"
WIDTH="200" HEIGHT="50">
A 1x1 GIF image with one color is 1KB in size. By changing the WIDTH and HEIGHT amounts you can create single colored lines, boxes and the like.
WIDTH and HEIGHT are also used to create smaller and larger version of an image. Some people use this to create thumbnails instead of actually creating a smaller file. The problem with this shortcut to thumbnails it doesn't decrease the KB size of the file, just it's size on screen.
<IMG SRC="image.gif" ALIGN="top">
Align="LEFT"
Align="RIGHT"
Align="TOP"
Align="MIDDLE"
Align="BOTTOM"
|
You can position your text or image inside of the table cell itself by using the ALIGN and VALIGN attributes inside the <TD> tag.
Use only one ALIGN and one VALIGN attribute per table cell or they will not work. <TD ALIGN=left VALIGN=top>
|
||||||||||||||||||||||||||
This is the link that you use so the viewer can email you using their browser option.
<a href="mailto:myemail@myisp.com">text</a>
This is the link that you use so that you can chose the "subject" line. It helps you know where they where on your site as well as making sure you can spot viewer e-mail. Any spaces left in the link will be filled in with %20 so it's best if you use a hyphen or an underscore.
<a href="mailto:myemail@myisp.com?subject=Newschool_Classes">text</a>
SOUND
<A HREF="filename.wav"> text</A>
<A HREF="filename.wav"><IMG SRC="imagefile.gif"></A> <BR> text (6K File)
Internet Explorer
This will create an
infinitely looping sound.
<BGSOUND SRC="sound.wav" LOOP=INFINITE>
To create a sound
that doesn't loop:
<BGSOUND SRC="sound.wav" LOOP=0>
Netscape
This will create an
infinitely looping sound.
<EMBED SRC="sound.wav" AUTOSTART="true" HIDDEN="true"
LOOP="true">
To create a sound
that doesn't loop:
<EMBED SRC="sound.wav" AUTOSTART="True" HIDDEN="True"
LOOP="false">
OPTIONAL, you don't have to include this in the projects.
To control Margins
<body bgcolor="#ffffff" SPACING="0" marginheight="0" marginwidth="0" topmargin="0" leftmargin="0">
SPACING="0"
marginheight="0"
marginwidth="0"
topmargin="0"
leftmargin="0"
Experiment with different values and see what happenes.
Layout / Storyboarding
Which topic goes on which page?
Generally 1 topic per page unless it is short.
What are the primary forms of navigation between pages?
What alternative forms of navigation are you going to provide?
What will you put on your homepage?
What are your goals?
Use a consistent layout.
Group info visually.
Link back to homepage.
Don't split topics across pages.