WebTech University

Odds and Ends - 1

In this lesson we shall be covering:

  1. Transparent Background Gifs
  2. Reducing File Size
  3. Rulers and Grids
  4. Clone Brush

Transparent Background Gifs

We can only make rectangular graphics, but often we want a graphic to go on a patterned background and only the shape of the actual design to be visible.

Here are 2 graphics exactly the same except the second one has the blue background color set as transparent.

[ PSP text on blue background ] [ PSP text with transparent background ]

With Paint Shop Pro achieving this is very simple. Create your graphic using a background color that is not used in any other part of the graphic. Reduce your graphic to 256 colors - remember you normally work in 16 million colors. . From the Colors Menu, select Decrease Color Depth, and pick 256 colors.

[ Color menu ]

This will open another window with several options.

Decrease Color Depth window

These are the default settings and all you need for normal use. Click on OK.

Now that you have a 256 color graphic ready for saving as a gif, you are ready to make one color transparent. Note that you can only make just one color transparent.

From the Colors Menu - Set Color Transparency.

[ Menu set transparency ]

This window will open -

Set Palette Transparency

NOTE:- The "current background color" refers to the current background color in your color palette, not the background color of the graphic.} You can select the color directly from your image that needs to be transparent - just move your pointer over to your graphic and it will change to the color picker. This will set the transparency value to palette entry.

[ pick transparent color ] [ transparency preview ]
[ set transparency panel ]

You can check the transparency first by clicking on the Proof button. This will show you a checker pattern where the transparent areas are without changing the graphic. If everything is okay, then click OK.

Now that you have given your graphic a transparent background you will need to save it as a gif. Only this and PNG file types will save the transparent color. This window will appear when you select File - Save As. You should be very familiar with this window by now :o)

File Save window

From the "Save as type:" list, select "CompuServe Graphics Interchange (*.gif)", then give your graphic a name, then click Save.

Congratulations, you have a gif with a transparent background.

NOTE: You will not see the transparency in PSP7 unless, for a particular image, you go to the Color Menu and select "View Palette Transparency". Rest assured, on a web page your chosen transparent color will be invisible.

A Problem:

Here are 2 gifs with transparent backgrounds.

[ PSP text gif transparent ] [ PSP gif with shadow ]

Both are the same background as the original 2 we started with. What has gone wrong with the second one?? The problem is the shadow - this is a gradient of many colors running from black to the background color. Since we can only make one color transparent, the near background colors do not become transparent but show up as a border around the lettering.

Later on we will look at a way to improve the appearance of the second graphic but the best way is to use solid colors as the outline when making gifs with transparent backgrounds.

If you want a shadow effect on lettering, then use a second layer of lettering to make the shadow effect as shown in the lesson on Layers.

The content and design of this site are the property of WebTech University
and may not be used without written consent of the owner.
Copyright © 1998-2010 WebTech University. All rights reserved.
Privacy Statement