| Introduction
SiteBuilder does not have
elements for creating nested tables or triple backgrounds,
whatever term you know them as. But, you can use SiteBuilder
to set your page properties and the
page's background settings.
For the tables on top of the page you need to grab the HTML
from a dummy page you create in a WSIWYG editor such as
Microsoft FrontPage or FrontPage Express or from right here.
Sometimes, if you grab some graphics for nested tables at a
web graphics designer's site, they will also include the HTML
for the tables. Or you can view their page source to grab the
HTML, too. But the bottom line here is, you have to know
some HTML for this.
You copy-and-paste the tables HTML into the Insert HTML
element in the Elements Palette. Make the changes you need to
do for the background tiles, any links, any images you add,
and your text. Re-size the element to fit the size you
indicated and you're set. This is where a little bit of HTML
knowledge comes in handy as you need to know what the HTML
tags are and how to use them.
The Table Code
Here's the HTML code for a two-table, triple background or
nested tables set. This code has adjustments for use at
Homestead sites and is specifically made for use with
SiteBuilder. (In SiteBuilder, do not use the part before the
<body> tag and after the </body> tag.)
<table
background="files/tile.jpg" cellpadding="xx"
cellspacing="0" width="xxx%"
border="x" bordercolor="#xxxxxx">
<tr>
<td width="100%"><div
align="center"><center>
<table
background="files/tile.jpg" cellpadding="xx"
cellspacing="0" width="100%" bgcolor="#xxxxxx"
border="x" bordercolor="#xxxxxx">
<tr>
<td width="100%">
<p>Body of text, images, and links</p>
</td>
</tr>
</table>
</center></div></td>
</tr>
</table>
The table width described on the first line of the code,
which is for the outside
or bottom
table, should be in percentages. Usually, 85-90% will give you
a nice border of the page background. The inside
or top
table width should be 100% when cell spacing or padding is
used for the outside table; smaller % if no cell spacing or
padding is used. Make sure you set the Insert HTML element's
width to whatever you feel comfortable with - it'll expand to
accommodate the visitor's monitor resolution anyway; the height
doesn't matter. Just don't put other elements too close to the
table. Check in View format to be sure.
The table border and cell padding are numerical settings
expressed in pixels. You can choose not to have a border, but
personally, I think a border in a coordinating color looks
nice. A border size of 3-5 pixels is good. Use zero (0) if you
do not want a border or just omit the tag.
Cell padding is the amount of space between the edge of the
table cell and the content within the table cell. A cell
padding of 10 or more pixels allows the tile to be displayed
nicely rather than being covered up by the top table which
happens if you do not use cell padding on the bottom table. On
the top table, it allows for nice "white space" or a
less crowded look of your content. Use zero (0) if you do not
want cell padding.
The bgcolor (background color) and bordercolor are
expressed in hexadecimal units of a combination of six letters
and numbers. Here is a very good visual guide to colors in Hex
code from Visibone.
Also very helpful visually are these guides at Project
Cool and Webmonkey.
Important Tips:
1) About background colors in a
nested table: You can set the background color for the page
and you can probably use a background color only, rather than
a tile, for the bottom table. But for the top table I advise
not using just a background color. Use a solid background tile
whether patterned or plain color.
The reason is the page's
background tile or color will "bleed" through to the
top table when viewed in Netscape. If you use a tile, the
bleed-through doesn't occur.
2) Regarding nested tables and
transparent GIFs: If you use a transparent GIF, such as an
animation within the table, the transparent background of the
GIF will show the page's background - again the bleed-through
effect. So if you don't want a strange-looking GIF, use the
same tile for the page background as for the top table.
3) Homestead suggests you
not use more than two tables nested. Homestead uses framesets
and tables as well, and any more tables will cause your page
and/ or browser to malfunction. So far I've had no such
problem but it could happen.
So with those cautionary tips in mind, I suggest you use at
least two tiles for your backgrounds on the page and the two
tables. I suggest using a plain-colored tile for the top table
rather than a busy patterned one so that your text is
readable. If you cannot find plain tiles, I'm offering some here.
They're free to grab, but you must save them to your own hard
drive rather than direct-linking to them. No credit and link
back to me is necessary unless you want to. ;-)
So what about the text and images I want to put in the
table, you ask? Continue to the next page where I talk a
little about HTML, HTML tags, and how to put them together for
your table content. I also present two demos to compare.
Page
2
|
