Array Studio Reading List - a list of useful books

Banner ads with HTML elements – banners that actually work June 19, 2006

Banners are one of the most used marketing tools on the Web for ages – you can see them on almost every commercial site. Some of them are successful, some are not. Some of them are truly annoying, some interesting.

No matter how they look and feel, people are still using them. One thing that’s important for any web designer is – there is still need for them and you’ll be creating them for a long time.

Key point you need to understand when you are creating a banner ad is – it doesn’t have to be good looking. Over-animated, shiny banners won’t do you any good if they are not clickable.

Making your banners clickable

Here is what you should do, and what you need to avoid:

• Beside your marketing message, try to use bottom right corner of the banner for Call-to-Action part (visit now, more info, click here, etc.). If you can’t place it in the bottom right, use banner center for it. One way or another – always place a Call-to-Action part on your banner ad.
• If you are creating animated banner, don’t make it blink every 10ms – save your visitors from epileptic attacks. Don’t animate entire banner, just animate some small thing to draw visitor’s attention. This way your banner will load quickly and it’ll still grab your visitor’s eye!
• If you are using text link (visit our CD store now) for Call-to-Action, use underlined blue link. Users recognize this combination as a regular link and will click on it.
• Use light borders or no borders wherever possible. If you are creating a banner that will be positioned on the page with white background, create white banner! This way, it would look as a part of the web page, and people will click on it.
• Use HTML elements on your banner ads – this is very important – some researches (and my personal experience) showed me that this technique highly increases their conversion rate. I am talking about elements like: buttons, checkboxes, input fields, radio buttons and select fields. This really works, and it’s easy to create. People used to click on HTML elements and they will more willingly click on HTML button then on some shiny – rotating-chicken banner. Just use print screen option on any webpage with some sort of form and cut elements you need.

Here are some samples of clickable banners. You may dislike it, but people keep clicking.

So, in just a few words: use HTML elements, animate something small to draw attention (rotating bullet, small chicken, whatever you need) and place your Call-to-Action button to the bottom right. Your conversion rate will grow for sure.