Sometimes a product or website you’d like to promote doesn’t have any creative for you to use. In that case, you can easily create your own in a few minutes using Adobe Photoshop. In this brief tutorial, we’ll be making a small square text banner.
Before you get started, you should select your color palette and the fonts you want to use. This will help to make it a smooth process, similar to laying out your ingredients before baking a cake.
The colors you select can be taken directly from the website you’re promoting, or you can visit other websites for color inspiration; a great site would be Color Schemer where users can create and submit their own custom color schemes.
Font selection can quickly become an intricate science, but in general, the font will give it a classic or modern feel. Without getting into the complete art of typography, select a serif font (examples: Georgia, Times New Roman, Garamond) for a classic and conservative feel, or sans-serif font (examples: Tahoma, Verdana, Arial) for a more modern feel.
To get started, create a new document in Photoshop and give it the dimensions of your text banner. For this example, we’ll be making a 125×125 square banner.
Make sure you also open up your color scheme or have it handy somewhere.
Set your foreground and background colors in Photoshop. Because we’ll be making a slight gradient, the background color is simply a darker variation of the foreground color.
Select the Gradient Tool from the Tools menu by clicking and holding the small triangle in the lower right corner of the Paint Bucket tool.
While holding down the shift key (this will create a perfectly straight line), click in the top center of the canvas and while holding down the left mouse button, drag the cursor about halfway down the canvas. Assuming all went well, you should now have color filling the canvas going from light, at the top, to darker at the bottom.
Create a new layer by clicking on the new layer icon from the Layers window. This second layer will become the design nuance. What you use on this layer will depend on the product or website you’re promoting. If there is a logo, you may want to consider using that.
For the Blogossary banner, I’ll be using the letter b just for the decorative nuance. After selecting the text tool, set the text color to slightly darker than the background color, add the decorative nuance, and then position it on the canvas. 
Once it’s in place, set the opacity to 50% to give it a washed out effect.
The final step before saving will be to create the banner text. Create another layer as we did in the previous section.
From the text menu, set your font properties, making sure to reset your font color.
Click in the canvas where you want your type to show up and start typing your text. Don’t be afraid to position the text for the best possible layout using the move tool, you can always go back to editing the text if you want to change it.
That’s really all there is to it. Stand back and look at the results, and make any final tweaks. If everything is where it should be, click on the File menu and select Save for Web (this is a neat Photoshop feature that saves an image optimized for websites).
Since this tutorial was about creating a simple text banner, we didn’t use many of the Photoshop frills, but don’t let that stop you from experimenting on your own. There are a variety of free brushes, shapes, and filters for you to use. Go forth, and play creatively.
Discuss "Creating Simple Text Banners Using Photoshop" with Teli
