How to make an AdBanner (static)

Part 1 of 3


Part 2


There are several ways to make a banner, and the way you choose depends upon what
kind of banner you want. Regardless of the kind of banner, all you really need is a thin,
rectangular image with some text (and perhaps a small picture to make it catch the visitors
eyes) and some ingenuity.


The measurements of a banner vary (I have seen at least a dozen different sizes). My
decorative banners (which can be seen here) are approximately 408 x 80 pixels. However,
if you want the banner for use in banner exchange you need a different kind. This banner
(also known as the ad banner) has three specific criteria to be met:


468 x 60

File size limit

Not above 10 kb

File type

Has to be a .gif

Step 1

Creating the text

Keeping the above-mentioned criteria in mind let's go on and make a banner. "Safeman's
Security Equipment" needs to be advertised on the net and we are going to make their ad

• Open a new file with the dimensions set to 468 x 60 pixels
• Fill the layer (Layer 1) with the colour white (This is to better see what we are doing, and
most ad banners are white anyway)
• Create the first text SECURITY

Note: It is not necessary to use the same colours as in the title we made earlier, but it is
preferable to do so. And we should use the same fonts as well.
I will try to use colours as close to the title as possible

• First text: SECURITY (Font: Arial Black; Size: 25)
• Second text: EQUIPMENT (Font: Courier New; Size: 20; Character spacing: 190)
• Third text: Safeman's (Font: Monotype Corsiva; Size: 30)

Before clicking OK after we have typed in Safeman's let's take the opportunity and make the
initial S bigger (as in the title). Highlight it and choose size 40. Then set the base line to -4.
• Now click OK

What we have got now doesn't look much like a banner (I've attached a thin border around
the image to make it more distinguishable). The file size is only 4 kb so we are well within
the limit.

Step 2

Adding a picture (bitmap)

Next step is to add the picture of a safe (Safe.bmp). If you haven't made any graphic since
the title you should be able to find the file in the short file list at the bottom of the File menu.
If the file isn't there you will have to use the Open command to find it.

• Open the file (Safe.bmp)
Then perform the following:

Ctrl + A


Select all

Shift + Ctrl + I


Invert mask (selection)

Ctrl + C


Copy the picture to the clipboard

Ctrl + D


Remove mask

Close the file and answer no to the question about saving changes (You haven't made any).
Now press Ctrl + V to paste the picture onto a new layer.

A new layer was created automatically because the active layer was a text layer (Safeman's).
There would have been no new layer created had the active layer been an ordinary layer.
This could cause problems so pay attention to the layer palette!

NOTE: Should you need to undo an operation (e.g. pasting onto the wrong layer) you can do
so simply by deleting the event (i.e. the operation you performed) from the Events palette.
If you don't have this palette visible you can bring it up by selecting Show events from the
Window menu.

Back to the banner. We need to arrange the text and the safe to make the image look more
like a banner.
• Move the SECURITY and EQUIPMENT to the right hand side and position them centered
vertically below each other
• Switch to the layer with the safe and move the safe quite close to the text you just moved.
Center it vertically
While the layer with the safe is active we might as well add some shadow to the picture.
• Right click on the layer (in the layer palette) and choose Effects
The Effects box opens with Shadow as default effect.
• Choose the default colour and set it to 2 pixels
• Click OK
Now the banner should look like this:

File size is now 5,4 kb. We are still well within the limit


Proceed to Part 2