oz web hub

resources to assist the web designer

Making backgrounds for web pages

People went mad with backgrounds at first. But they soon learned that those graphics took way too long to load.

The next two methods are about making seamless tiles. Have you ever seen tiles which repeat all the time. These are not those.

1. In Paint shop pro make an image which you think will make a nice background. Click on the Selection tool. Drag the tool across a selection of your image and then click on Selections and Convert to seamless tile

2. The best way is with Photoshop. See our free backgrounds and tutorial about how to make them in Photoshop.

The most common way these days and the most attractive is to make a background gif which is fixed and which is controlled by CSS.

Here is some code

You will notice that the position of the background image position can be determined by pixels (20px10px), percentages (30%30%), or keyword (top center)

Find some images and give it a try. You can alter all the positions.

Ohter methods of making backgrounds

Seamless 1

Seamless 2

Bordered 1

Bordered 2

Back to graphic tutorial index

« computers | web design »