BACKGROUNDS



in general, backgrounds suck. tons of garbage are available under the guise of webpage backgrounds, and maybe a handful are usable. almost any busy colorful background will obscure text in some way, finding a font color to be legible on a solid color is difficult enough. if you insist on your pages sporting a background, please build a solid color table to host your area(s) of text.

a solution is to make your own background. here's a few ways to have one uniquely yours, and maybe even be attractive. if you do make your own background, remember to use only a few colors and simple designs. this not only looks better, but assures fast loading.

make a vertical GIF (or JPG) in agreeable colors about 10-20 pixels wide, and as high as you think your page is going to be (a MSNTV full screen non-scrolling page is about 400 pixel high and 550 across.) some examples below.



here's what they look like respectively used on a page:

1 2 3 4 5
the same can be done with horizontal images. (a MSNTV screen is about 560 across.) this gif and this gif are shown used on this page and this page. you can also add a small design to a side on a horizontal image to look like a fake sidebar.

all the above images are very small in file size, so they load instantly, and save so much space (in bytes) in your account and on a page, in theory you could use a different one for each of your pages.

a photographic or graphic design image can give an extra dimension to these otherwise flat backgrounds . the trick is to add a transparent gif to overlap two background colors (this effect won't work over one color) as shown here, here and here. a small simple animated design can also look great. a drawing or painting will only appear flat, no matter how many frames are added to it.

my favorite use of a background is one which fills the entire screen as shown here and here. this method is only for images that have reduced bytes, and have little color and detail that would otherwise obscure text. again, a MSNTV screen is about 560 width x 400 height (nobody can agree on the exact dimension). for PC users to view the same effect, the safe size of the background image should be 1200x800. sadly, our online tool scoff at these dimensions.

don't forget that backgrounds can be used with more that just the 'body' tag. for example, this single image is used in the 'body background', 'table background', 'td background', and 'img src' tags on the sitemap page of this site. note the effect on the top of the page. since the same image is used with all those tags, and is only 3kb, it loads instantly.

ok, i've given you enough ideas.now repeat after me: "i will never use crappy backgrounds again". now say it again....