This is a neat trick that allows one some control over the
layout of his (or her) text when writing
HTML. As you may know, HTML is a little unkind to
whitespace, only drawing a single space between words regardless of how many
spaces,
tabs or
newlines you write in the
source. This is a particular pain if you want to
indent your text without having to mess about with <
blockquote>s. Simply create a
GIF image of a single
pixel in size (1x1) and set that pixel to the
transparent colour. Then using the
width and
height attributes the invisible image can be set to take up as much space as required allowing you to put giant gaps between words or indent your text by precisely 17 pixels or 10% of the available text area. This can also be used to position other (visible) images and so on.
If the proper
optimisations are used such a GIF need only be 85
bytes in size, which though far greater than the single byte for each space/tab/newline it replaces is really pretty small. Besides it's only loaded once,
cached and then the cached copy used for the rest (with any modern
browser anyway).
Paint Shop Pro 7 has a built in image optimiser which is very good at helping you create
teeny weeny gifs.
Also the pixel needn't be transparent. One could use exactly the same technique except with a black pixel for creating
horizontal or
vertical lines (or big fat black boxes).
Of course all of this assumes you're
hardcore enough to give a toss about HTML.
WYSIWYG yuch.