Computers/Internet: LifeSupport - Gif Girl on Clean Columns

Search:The WebTripod

click here for ebay

The Adventures of Girl Girl

January 2, 1997
Making CleanColumns

Here is how Gif Girl helped create the column layout found on pages such as Tripod's Homepage Builder. These instructions assume that you are using Photoshop; some of the steps might be slightly different with other imaging software.

First, create a new graphic that is 1600 pixels wide by 32 tall. Yes, this is really wide, but that's how wide you have to make it in order for it to work on all monitors. Fill in the whole graphic with white or whatever main background color you want. Make sure that the colors you are choosing are in the Netscape safe palette, available at:

http://www.lynda.com/hex.html

This will keep the graphic from dithering, or degrading to a splotchy mess.

Second, select the left column portion of the graphic. I usually select a piece 200 pixels wide by 32 pixels tall. Fill this with your second color.

Third, index the graphic, selecting "custom palette" as your palette option; load in the "safe" palette. Also, make sure to select "none" for dithering. Name the graphic something like "background.gif"

Now, in the HTML on your page, use this as your body tag:

To create the column for the text which will lay over the background, you must create a table. Please note: These will only work with some browsers, so there are some users who will see your page looking a little messy...this is a trade-off which may or may not be worth it to you.

Use the following template to start out:

<HTML> <HEAD> <TITLE>
Title of Your Page </TITLE> </HEAD>
<BODY BACKGROUND=
"background.gif">
<TABLE CELLSPACING ="10">
<TR>
<TD WIDTH="190">
This is where your left column text goes.
</TD>
<TD>
Here is where your right column stuff goes.
</TD>
</TR>
</TABLE>
</BODY>
</HTML>

You will need to play around with the <TD WIDTH="X"> to make it work with the background tile.

A good resource for learning how to tweak tables, which you'll need to do to perfect your page layouts, is:

http://home.netscape.com/assist/net_sites/tables.html

Columnar layout is not an exact science. It is very difficult to keep the columns in place correctly. But when it works, it looks pretty snazzy. Good luck!

NEXT TIME:
Color My World:
Gif Girl gets the blues...
and reds, and greens.

Gif Girl, when she isn't out saving the world from dithered graphics and illegible Web pages, helps keep Tripod's pages running fast and furious.

Send your comments, ideas, suggestions, and of course, your solutions for saving the world from bad Web page design, to Gif Girl. She'd love to hear from you.

NameSecure

A Lycos Network Site


Get Tripod in: United Kingdom - Italy - Germany - France - Spain - Netherlands Korea - Peru - Americas - Mexico - Venezuela - Chile - Brasil Tripod International \| Advertise with Tripod \| Privacy Vow \| Terms of Service \| Check System Status

©Tripod Inc. Tripod ® is a registered servicemark of Tripod, Inc., a Lycos Company. All rights reserved.