So you want to make your own backgrounds. First there are some guidelines to follow. The background can't be so noticeable that it distracts the readers from the web page. The background picture can't be so huge that it takes forever to load. Lastly, it has to look good.

The Tiled Background
A background is basically made up of one image that is repeatedly tiled across the browser. So if you took just any old picture and attempted to use it in a background, you might end up with "grid-itus." Click here to see a sample of "grid-itus." Isn't that just putrid! There's two ways to fix that. First, if you have a graphical editor that has a "Create Seamless Pattern" function or something like it, use it. Otherwise, you'll have to do a bit of cutting, flipping and pasting.

First double the size of the canvas and put the image in the lower-left corner of the canvas. So you would have something like this.

Then take a copy of the image, flip it and place it above the old image. Take another copy, mirror it and place it beside the old image. Finally, take one more copy, mirror and flip it, then place it in the left over corner. So you would have something like this.

Finally, resize it so it's not so huge and your in business! Click here to see the new image. Doesn't that look so much healthier. Now on to making side banners.

The Side Banner
Have you ever gone to a web site and seen a cool looking side bar running the length of the page and wondered how they did that? It's still a single image being tiled, but the catch it that its so wide that it takes up the whole width of the window. Click here so see an example.

The banner on the example page is 2 pixels high and 1300 pixels long. 1300 pixels is a good number to make banners. That insures that it won't tile itself, making two or more banners. Click here to see what happens when the banner is too short. It looks terrible. Just remember to make the images about 1300 pixels wide and you won't have any problems.

For information about including background images into a web page read our HTML tutorial.