Text Tips

Using text in graphics can enhance a web page greatly and actually “set the mood”. An elegant font will affect the visitor in a different way than a “fun” font. I have included many fonts on these pages to demonstrate this theory. Collecting fonts can become addicting. I have numerous links to free font sites on my links page.

Creating text graphics in Paint Shop Pro 5 is much more creative than PSP 4 since you can place your text on a separate layer and save the text selection. Then, if you decide to change colors or textures, you don’t need to start over with a new graphic.

Add Text

The Add Text dialog box is pretty straightforward. There are a few things you need to know, though:

1. Always work in 16 million colors when creating a text graphic. Antialias doesn’t work in less than 16 million colors.
2. Always have “antialias” checked (this smoothes the edges of text).
3. Always place your text on a separate layer and save the selection (Selections|Save to Alpha Channel).
4. The size of the text allowed appears to stop at 72. Don’t let this fool you. You can enter any number you want in the box. Just be careful. I have had PSP crash on me with text sizes larger than 300.
5. When “floating” is checked, your text will be the color of the foreground. When “floating” is unchecked, you will be placing a text selection only (all you will see is the “marching ants” outline).
6. When you place the text cross-hair on a graphic, the text will be centered half to the left and half to the right.
7. Right-click anywhere on the graphic to “place” the text (make the marching ants go away).
8. If you find that the font names appear in the Name window, but there is nothing to the left of the font name and you can’t place your text, this usually means you have run out of memory resources. Close down open programs including Paint Shop Pro then open the program again, the fonts should be back.
9. If you are using PostScript fonts, you need to go to Adobe Type Manager, under Advanced functions, and turn off “Screen Font Smoothing”. If you don’t, you will probably crash Paint Shop Pro.

Creating a Text Graphic

To create a new text graphic:

1. Create a new graphic of 16 million colors with a white background.
2. Add a new layer and call it “Fill”.
3. Add a new layer and name this layer “Text”.
4. Place your text where you want it on your graphic and choose Selections|Save to Alpha Channel. Keep text selected.
5. Add a new layer, call this one “Shadow”. Switch to this new layer.
6. If you have dropped your text selection, you can pick it back up by choosing Selections|Load from Alpha Channel (this is why you saved your text selection to the alpha channel).
7. Add a drop shadow keeping opacity at 100%. You can then adjust the opacity of the shadow by using the opacity slider on the shadow layer.
8. Save as a “PSP” file if you think you will want to play with the graphic at a later date (i.e. changing font color, etc).
9. To save the graphic as a transparent gif, lower the colors to 256 (this will flatten the text), then proceed to create a transparent gif per my instructions under PSP Basics.
10. You might want to imbed in the graphic the name of the font you used (View|Image Information, click on Creator Information, and type in your font name in the Description box).

The reason for the “Fill” layer above the “Background” layer is that any layer (you can tell it is a layer because the opacity slider is not greyed out) has a transparent background as default. If you hold the cursor over the layer name, you will see a checkerboard pattern. This tells you that the background is transparent. By having the bottom layer white, you can adjust the transparency of the “Fill” layer and you won’t see the checkerboard pattern show through, which can be very disorienting.

Drop Shadows

You can use the drop shadow filter in Paint Shop Pro exactly the same as you can use it in Version 4. But, since Version 5 has layers, I suggest you take advantage of this new feature to add your drop shadow on a new layer. The advantage to this is that you can create your drop shadow at 100% opacity, then use the opacity slider on the new layer to adjust the opacity until it looks perfect for your background and text.

Your settings on this filter are strictly a matter of taste. Keep in mind, though, if you add drop shadows to graphics, always keep the shadow going in the same direction. The more blur you add, the “higher” off the page the text appears to be. Adding a short shadow (offset 1,1) in black or white is a good way to make text stand out from a textured background. Use black for light-colored text and white for dark-colored text.

      

The first “welcome” above has a drop shadow set at Offset: 3,3, Blur 8. I then adjusted the opacity on the shadow. The “welcome” on the right has the drop shadow set to Offset: 1,1, Blur 1. I didn’t adjust the opacity. The first graphic is rather elegant and the second is kind of fun. The sharp black drop shadow on the second graphic makes it stand out from the page rather than being flat on the page.

Text Fills

Why have plain old boring flat one colored text when you can fill your text with whatever you want. You can make it rainbow, wood, let your imagination be your guide. Filling text with Paint Shop Pro is easy. There are two methods you can use. The first is to set a pattern or color and fill it with the Flood Fill tool. The second is to cut the text out of a graphic. You can do both with layers, again giving yourself the ability to change your text at will.

To fill the text with the paint bucket tool, all you need to do is to choose a pattern or texture or set the linear-gradient, then flood fill your text. Following the guidelines for creating layered text graphics, you always want to place your text on a second layer and save your selection for future use. Following are some examples of filled text using the flood fill tool (all have Eye Candy inner bevel applied for effect):

Flood filled with a wood pattern.

Flood filled with linear gradient set to 180 degrees.

This one is kind of fun. It is the same linear gradient as the graphic above except I set the “Match Mode” to RGB value rather than “None”. This allowed me to fill each letter individually. I just reversed the colors for the linear gradient for each letter. Kind of cool!

Cutout Text

The advantage to “cutting” text out of a graphic is that you can move your selection to the spot you think looks best on the pattern you are cutting your text from. To create cutout text:

1. Open the background texture you want to cut your text out of (or flood fill a new graphic with a background tile).
2. Place your text, floating unchecked.
3. Move your text selection with the Mover tool (right click on the selection and drag) to where you think it looks best.
4. Promote your selection to a layer (Selections|Promote to Layer).
5. Save your selection to an alpha channel.
6. Switch to the base (Background) layer.
7. Flood fill with your background color.
8. Click on your text layer again and load your selection.
9. Bevel your text id desired.
10. Add another layer for a drop shadow.
11. Crop your entire image to an appropriate size (cropping won’t effect the layers or text selection).

Beveled Text

Text graphics usually look much better when they have a bevel applied. Unfortunately the one shortcoming of Paint Shop Pro is that they do not have a good beveling filter. The most widely used filter for creating text bevels is Alien Skin’s Eye Candy. The problem with Eye Candy is that it costs more than Paint Shop Pro! Fortunately there is now a more reasonably priced alternative. A new program called Blade Pro does great bevels and also other text effects that Eye Candy can’t do. Please see my Blade Pro tutorial for more information on this great program. The graphic below on the left was beveled with Blade Pro and the graphic on the right with Eye Candy.

 

Beveling with PSP

The above graphic was beveled entirely with Paint Shop Pro. I call it the “Poor Man’s Bevel”. To create this bevel:

1. Create your text graphic as outlined above.
2. With your text selection active, add two new layers.
3. On the first layer apply the cutout filter (Image|Effects|Cutout) Color: Black, Offset -2,-2, Blur 5, Opacity 100%.
4. On the second new layer apply the cutout filter again with Color: White, Offset 2,2, Blur 5 and Opacity 100%.
5. Adjust the opacity sliders on both the cutout layers until you get the effect you want.
6. Add a drop shadow on a new layer if desired.