Tricks and Treats
Used to make a sidebar.
Insert a table within a table to highlight or as a design element.
All That Jazz
Tables don't have to take up the entire page. Use percentages to control the width. See Middleboro.
Be careful about using absolute pixels. Don't force people to scroll sideways. Peoples screen resolutions and sizes vary. Percentages let things move with the screen size.
Use tables to separate a busy background from the text. See Arboretum Swim Club.
Use tables to organize a page's sections. See WayNet.
Be aware that computerized "readers" for the blind have difficulty with tables. If your audience includes the visually handicapped - you may want to stay away from tables.
Control the Space Around Your Graphics
You can control the spacing around your graphics by using hspace (horizontal space) and vspace (vertical space).
This picture is not controlled at all. Notice how the letters snuggle right up to the picture, and the left edge aligns with the left margin.
picture includes the code
<img src="images/1st_bridge_1834_175.JPG" width="175" height="77" alt="1st bridge 1834 175.JPG (8363 bytes)" hspace="10" vspace="10"> that includes 10 extra pixels horizontally and vertically on each side of the graphic. Notice the extra space between the letters and the bottom of the picture.
Control Space with a 1 Pixel Transparent
You can also control spaces by creating a 1 pixel X 1 pixel transparent graphic. Insert this graphic where you need space and set the size to however many pixels you need. Occasionally a browser will show this upon loading, so test carefully when using this trick.
This sentence is indented with a 80 X 5 pixel transparent graphic that I created - because it's easier to "grab" using a wysiwyg program.
If one of your early pages contains lots of interesting content that will hold your audience's interest, you may load a large graphic at the bottom of that page as a 1 X 1 pixel image. It will then cache on the visitor's drive & be ready to open immediately when they move to the next page.
<img scr="viewevent.gif" width="1" height="1">
Specifiying Multiple Fonts
You can't guarantee that a specific font will be installed on a viewer's system, but you can specifiy what typeface is used if it is there. Use the code
<font face="arial, geneva, verdana">
(or which ever font you prefer used that you are pretty sure exists on most Windows and Mac systems). The browser will look for the fonts in the order they are listed.
Normally use anti-aliasing on type to smooth the "jaggies". It adds extra colored pixels to smooth out the edges.
Smoother, softer look
Jaggies - but often easier to read in very small type
Reduce your graphics without a great deal of software or headbashing by using GIF Wizard to reduce the size of your graphics.
Return to Index.