Creating Your Own Tiled Backgrounds


Any GIF or JPEG image can be used as a background tile. Pages look best, however, when the top edge of a background tile matches seamlessly with the bottom edge, and the left edge matches with the right.

If you're clever and have some time to spend on it, you can turn any image into a seamless tile by meticulously cutting and pasting, while touching up the edges. Paint Shop Pro provides a much easier way to automatically make any texture into a seamless tile: Simply crop out the rectangular area you want to make into a tile, and then choose EffectsEffEfE, Image Effects, Seamless Tiling. Paint Shop Pro crops the image and uses a sophisticated automatic procedure to overlay and blur together opposite sides of the image.

Figure 9.6 shows the Seamless Tiling dialog box in Paint Shop Pro as I turn a photograph of a piece of travertine stone into a seamless tile. The resulting tileshown as the background of a web page in Figure 9.7tiles seamlessly but has the tone and texture of a piece of natural travertine stone.

Figure 9.6. Paint Shop Pro can automatically take any region of an image and turn it into a background pattern that can be easily made into tiles.


Figure 9.7. These are the results of using the seamless tile created in Figure 9.6 as a background image for a web page.


You'll find similar features in other graphics programs, including Photoshop (use Filter, Other, Offset with Wrap Turned On), Kai's Power Tools, and the Macintosh programs Mordant and Tilery.

Try It Yourself

Here are some tips for making your own background tiles with Paint Shop Pro:

  • If you have a scanner or digital camera, try using some textures from around the house or office, such as the top of a wooden desk, leaves of houseplants, or clothing.

  • Using the AdjustAdju, Blur, Blur More filter on an image before you turn it into a seamless tile will help it look better as a background. Using Adjust, Brightness and Contrast usually is also necessary to keep the background subtle in color variation.

  • When you select an area to be turned into a tile, try to choose part of the image that is fairly uniform in brightness from side to side. Otherwise, the tile may not look seamless even after you use Convert to Seamless Pattern.

  • You can also make some almost-automatic textures with the paper texture feature in the paintbrush style palette in Paint Shop Pro. You can also make great paper textures by selecting AdjustAdju, Add/Remove Noise, Add Noise followed by AdjustAdjust, Blur, Blur.

    Did you Know?

    If you just cannot seem to get the pattern you want, you can check out some of the hundreds of sites on the Internet offering public-domain background images that are free or inexpensive and professionally designed.





SAMS Teach Yourself HTML and CSS in 24 Hours
Sams Teach Yourself HTML and CSS in 24 Hours (7th Edition)
ISBN: 0672328410
EAN: 2147483647
Year: 2005
Pages: 345

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net