Thursday, 2 February 2012

Make Your Own Ads

I'm always looking out for more ways to promote my business and today I'm going to tell you about adverts and how to make your own.

If you don't have an image editor and can't afford Photoshop, use GIMP. There are other images editors around but I find GIMP easy to use and it's a decent, versatile program that easily gives Photoshop a run for its money. /End plug.

Beginner: static ad


Okay, you've fired up your image editor and you're ready to go. The standard sizes of the ads you're given for use on blogs and websites by Commission Junction are:

  • 460 x 60px
  • 250 x 250
  • 200 x 200
  • 300 x 300
  • 125 x 125
  • 125 x 60
  • 729 x 90

The figures for skyscraper (vertical) ads are usually 120 wide x varying heights up to 720 or 800px. The example animated gif above is 320 x 50px because I originally made it as a mobile phone ad.

Before you make your ad you've got to work out where it's likely to go when someone places it. For smaller ads you've got to make the content count and my business name is a long one. It's advisable to use eyecatching colours and clear text. The sharper the resolution is, the easier it will be to read. Usually, ads are placed where they're out of the way of the main content on a website or blog. I tend to put my CJ ones at the bottom of my posts and the JavaScript ones in the sidebar. Since that's where your ads are likely to go make sure it's not too big.

In GIMP click File, then New, then choose your dimensions. Click the x in the layers dialog. You don't need it. Go to View, Zoom, 400% so you can see the picture four times bigger. Click on the pencil icon in the left hand box and click on the Brush box to choose the brush size. Since this is basic we're not doing anything fancy just yet. Now click in the bottom left hand corner of your picture to make a small mark. Now hold down the shift key and slide your mouse up as far as you can to draw a straight line. Repeat until you get to the top, then hold the shift key down and drag your mouse across. Stop when you've drawn a thin black box around your ad.

You can change the colour with the bucket tool by clicking on the top colour square and changing the colour when the colours dialog comes up. When you've chosen the colour you want, click on the bucket icon then click on the line or you'll change the inner part of the ad. The point of the border is to display your work space better otherwise you may end up going over the line later on. You could use the box tool but I don't find that reliable because if you go over the edges of your workspace you've wasted your time: no line is drawn around the edge.

Now that you can clearly see what you're doing, let's add some pictures and text. You may have to shrink an image to size using the scale tool. If you're not sure what that is, hover your mouse over each tool in the toolbox on your left till you find it. Open the file you want to shrink, then click on the tool, drag your mouse to resize it, then click on "Scale."

Click on the A to add a text layer and to choose your font. GIMP will find all the fonts you have on your PC and display them in the toolbox. The default is Sans but if you click the box beside that and scroll up or down you can find something more interesting. I'm going to use Deja Vu Sans because it looks good at small sizes. Some fonts simply don't work at 10px or smaller. Tunga's 12px looks the same as Arial at 8px so I'm using that for the smaller text. The reason is, some fonts distort at smaller sizes and shrinking a picture with text on blurs the text.

To make it work as an ad, you add this code:

<a href="http://yourwebsite.com" target="blank"><img style="float: right; margin-left: 10px;" src="http://yourimagehost.com/images/yourimage.png" title="Buy my great product!" alt="The thing I'm promoting" width="120" height="120" /> </a>


That code directs people to your website when they click on the picture. Using .png instead of .jpg will help keep the images sharp. Ads that small aren't terribly effective but space on websites is at a premium so you need to be disciplined with your use of space. That's where animated ads come in.

Intermediate: animated ad


To make an animated ad like the one at the top, make a series of images that are all the same size. Then choose one to be the base image. If you're using GIMP go to Layer and choose New Layer/Transparency. Now go to Layer/Transparency/Semi- Flatten. Open the next image file, copy, then paste the image on top of the first image. Go to Layer. You may have to click on Transparency twice to get the option to choose a transparent layer. This is important as failing to do so leaves you with a messy animation. Repeat the process till you get to the last one which doesn't require a new layer. Now go to Filters/Animation/Optimize (for Gif). This will prepare your image as a duplicate file with the images ready to go. Choose Filters/Animation/Playback... and if it looks good to you save the duplicate untitled file as a .gif.

Save as animation. If you Merge Visible Layers you'll have to start again. the next dialog gives you the opportunity to set the transition time so you can slow down your animation. Tick the Loop forever box if you don't want it to run to the end then stop. Delay between frames where unspecified should be 2500 milliseconds or more. Choose Frame disposal: cumulative layers (combine) box. Tick the Use delay entered above for all frames box. Tick the Use disposal entered above for all frames box.

Use the same code to link the ad to your website. You're using an image hosting account to link the image from because if you don't you'll use up more bandwidth than you usually would if your ad is being used on sites other than your own.

Advanced: JavaScript ad


A simple Google search will turn up a multiplicity of links to websites offering free scripts to use for rotator banner adverts. Since they're basically carousels that do the same job as the fading slideshow on my Home page, I might as well use that. The Spyka Webmaster banner script is in use here. As I said, it's basically a carousel except that it shows the images in a random order rather than the set order I would prefer. You need to use JavaScript for mobile phone ads as far as I know. You can download the zip file by clicking on this link. The instructions for using it are all in there.

Want to use affiliate marketing? I've found some links to reputable companies that offer affiliate software or hosted solutions.

aflite.co.uk

winsite.com

software.informer.com

Or you could use the Google URL builder and make your own. I didn't realise they offered that until today. If you choose that option follow the instructions there and off you go. You will need a Google account with Analytics enabled.

Well, that's all I know about setting up your own adverts. I don't offer affiliate deals for my own company but I do have affiliate deals with companies that offer complementary services such as hosting, hardware, software, office and printing supplies, etc.

It's cool to think that, if I wanted to, I could set up my own affiliate program just as easily as clicking a few links. And so could you.

No comments:

Post a Comment