Adding Text to Buttons
These instructions assume you are running a Windows/Windows 95/Windows NT platform. If you're not, this won't be much help to you.
Adding text to buttons is easy. I'll give the basics using Paint Shop Pro, although any bitmap graphics program (Adobe Photoshop, Corel PhotoPaint) should work just fine. If you don't have a copy of Paint Shop Pro, you can download a shareware version here:
- Choose a foreground color for the text that will stand out against the background of the button you want to add text to.
- Open the button graphic file (I used dkgbtn1.gif above). Immediately save the button using a new name so you don't accidentally overwrite the blank button.
- Most text for the web should be anti-aliased so the jagged edges don't show. Paint Shop Pro (and most other graphics programs) require that graphics use 16 million colors in order to do antialiasing. CompuServe GIF format is 256 colors. If you want to add antialiased text, you'll have to change the number of colors to 16 million. Choose the "Colors | Increase Color Depth >> 16 million colors (24 bit)" menu item.This will change the graphic appropriately.
- You'll want the text to be centered. This is easy in Paint Shop Pro. Select the text tool and move the mouse pointer over the graphic until the mouse position (shown on the left side of the status bar at the bottom of the Paint Shop Pro window) is (70, 20). Since each button is 140 x 40 pixels, this is dead center. Click the mouse button. A text dialog will display:
Paint Shop Pro aligns text using the position of the mouse when you click using the Text tool. Select "Antialias" text effect, "Center" alignment, and check the "Floating" checkbox. Select a font you like and an appropriate size. The dialog above shows what I used for the "Paint Shop Pro" button above. Type the desired text in the "Enter text here:" text box and click "OK" when you're done. If you don't like what you get, press "Ctrl-Z" to undo adding the text and try again and again until you get something you like.
After you have text the way you want it, you'll have to decrease the number of colors to 256 to save the file as a .GIF file. Select the "Colors | Decrease Color Depth >> 256 Colors ... (8 bit)" menu option. A dialog will display. Press the "OK" button to decrease the colors to 256. If you don't like the results you get from decreasing the colors, press "Ctrl-Z" to undo the color decrease and select the menu item again, experimenting with changing the settings in the "decrease colors" dialog box until you get something you like.
- Save the graphic and you're done!