11 minutes read

How to design a banner ad Creatopy

Recently, I’ve been reading an article on creativity in advertising and it started with an interesting quote from a Chief Creative Office: Nothing is more efficient than creative advertising.

“Creative advertising is more memorable, longer lasting, works with less media spending, and builds a fan community… faster.” source

So I got to think about the importance of creativity in advertising today, even if we talk about traditional advertising or digital advertising. Creativity never gets old and it will always be in the top of everything a marketer, advertiser or designer does.

Creativity is a major player in everything happening today, including banner ads design.

Let’s go back in the past and see how the first banner ad looked like. 

It was a simple banner with a transparent background font on black, with 2 types-font and a narrow. “Have you ever clicked your mouse right HERE?” and the answer was “YOU WILL”.

You also should check our interview with the creator of the first banner ad, Joe McCambley

 A good banner is like any piece of good marketing. It reaches the right person in the right place at the right time with the right message.


No people in the image. No branding. No CTA buttons. Nothing. It was so simple that people clicked on the banner just because they were intrigued.

In 20 years, the banner ad got a lot of other elements, such as dynamic, cliparts, buttons and images. And even more, today you can test your banner ads and see if they convert or not.

But I think that we must design simple yet attractive banner ads  which will stand out from the crowd – or the website.

According to Inside Google Marketing:

Just as any marketing campaign, the success of a banner campaign comes down to creative quality. 

In the following blog post I will show you how brands like Kissmetrics, SEMrush, Apple, Grid and others have designed some good looking banner ads, considering:

  1. Sizes
  2. Messages
  3. Branding


The importance of sizes in banner ads

IAB  shows a variety of common ad unit sizes, from the large Billboards 970 x 250px to the smaller Rectangle 180 x 150px. You can download their PDF from here.

By now, we’ve designed for you 2 infographics where we showed you top 5 banner ad sizes:

Click on the image to see the entire infographic

Web banner ad sizes


And we’ve compiled a list of top social networks where you can do advertising.

Social media ad sizes

Also, I want to remind you about our blog post where we’ve took all the information about Google display ads and put it together in an article.

Before you start designing a banner ad, you should ask yourself:

What is my purpose with this banner ad? What do I want to gain with it? 

If you want to get a good number of impressions, we recommend you used the popular ad sizes. Most websites feature ad placements is for 300×250, 728×90 and 160×600 ad units.

And to make it easier for you, we created in our app a top standard ad sizes from which you can start.

Let’s see what kind of sizes are using other brands:

“WhatRunsWhere” display their ads in different sizes, as you can see:




Or, as you can see the example from the web-site builder “Grid”, which makes use of a 970×250 Billboard size:


Or you can see a 300×250 ad on the Mashable website:


Some big websites like Mashable, The Verge, The Guardian are using the cards layout Design, so this can be a great opportunity for your 300 x 350 or 728×90 banner ad size to go ahead.

2. The clarity of the message

How important is the clarity of the message for you? For example, when you receive an e-mail from a client, you need to have it as clear as it can be, so that you know what he needs, right?

Therefore, the clarity of the message is very important, even when we talk about banner ads. Because banner ads are not only about making them look good and having a high quality image insert in it, it’s about the message you want to send to the user.

You can have the best message in the world, but the person on the receiving end will always understand it through the prism of his or her own emotions, preconceptions, prejudices, and preexisting beliefs. It’s not enough to be correct or reasonable or even brilliant.

The key to successful communication is to take the imaginative leap of stuffing yourself right into your listener’s shoes to know what they are thinking and feeling in the deepest recesses of their mind and heart. How that person perceives what you say is even more real, at least in a practical sense, than how you perceive yourself. (source: Copyblogger)

This is what we tell our clients, wanting to let them and you know that you should always write a clear message on your banner ad.

Do you want to write the perfect banner ad copy?

Here are 4 steps or, better said, questions that can help you:

  1. What are you selling?
  2. What makes your brand different?
  3. How can you say that differently?
  4. Combine the answers.

So what kind of text could you write in your banner ad?


1. Brand tagline or statement

You can start with a brand tagline or a brand statement.

Warby Parkers use young and dynamic statements like  “rebellious,” “revolutionary,” “socially-conscious.” But their longest form version is “We believe that buying glasses should be easy and fun. It should leave you happy and good-looking, with money in your pocket”.

So think about your short term statement and what words describe your brand.

Let’s look at Appypie – their tagline is “Make an App, as Easy as Pie” and with them you can create your very own app in just a few minutes; and it’s free to use!

So what is their short statement? “No coding needed”  – because not everybody can code, so this is why they go with this tagline:

Appypie banner ad

2. Testimonials

If you have great testimonials about your brand, you should try them in your banner ads.

Using testimonials help your banner ad and brand establish a strong credibility. They give you the chance to prove claims about your product or service.

But if you don’t have them, you can learn here how to receive some great ones.

Grid goes with several testimonials in their banner ads, from publishers who wrote about them, like Fast Company or Wired:

Grid Wired banner ad

And also Quicksprout is using testimonials on its blog page:



3. Powerful message

Using powerful words in your banner ads can help you create a good message, but sometimes we go too far away with our words.

That doesn’t mean you can’t play with words, though.

Let’s look at Workfront banner ads. In their logo you can see a graphical lion. So the lion is the king of the jungle and Workfront crafted a message where they put themselves as the “King of hitting deadlines” or “The king of teamwork” .


And don’t forget to use readable fonts. Because you don’t want to create an impactful message that nobody reads.

Be transparent and truthful when you create your banner ad copy.


3. The almighty branding 

Overall, because branding is about creating and sustaining trust, it means delivering on promises. The best and most successful brands are completely coherent. Every aspect of what they do and what they are reinforces everything else. Wally Olins

Every element in your brand identity contains a promise to the buyer, and every element in your banner ad should be an important part from your brand.

But what exactly is branding in the banner ad?

We know what branding is in social media, what branding is in content marketing, what branding is in traditional advertising… but what about banner ads?

Jennifer Aaker (psychologist and Stanford professor) has conducted a study named “Dimensions of Brand Personality” where she found five core dimensions that play a role in the personality of a brand:


image source: Helpscout

To help you understand your branding, you need to answer a simple question:

What is the simplest and still the most important promise you keep with your brand? 

And starting from this, you need to understand that your brand is – or should be – a promise for this world.

In order to help you build an irrezistible brand, you can try answering all these 125 questions.

So let’s get a little deeper in the brand subject, regarding banner ads.

A. Colors

Researchers found out that up to 90% of judgments made about products can be based only on colors.

Choosing the perfect color for your banner ad will help you reach your goal, even if we talk about brand awareness, sales or about converting users.

But how do you choose colors?

First, you have to choose your colors in your brand identity color palette. Because if you have a brand manual, you should have a color palette as well.

But if you don’t have a brand identity manual, you should start creating one by talking to a specialist, consultant – or you can take a look at these examples and try to craft your own. However, my recommendation is to go along with the specialist!

Let’s take a look on Vimeo brand guidelines:


Their primary colors are black, white and blue. So that means that they will use these  colors in their banner ads.

Vimeo branding

As you can see in these examples, Vimeo use only 3 important colors: blue, white and black.

Tips: Stay in your brand identity when you choose your banner ads colors. 


B. Fonts

Maybe you’ve heard a lot talking about the importance of fonts and typography in a brand identity or in an ad. But let me tell you something very important when it comes to banner ads: fonts are as important as every element in your banner ad.


Because when you write something down on your banner ad (title, promotion, sale, new product) you want it to be read, so that means you should choose a good and readable font.

Just like you see in the iStock banner ads:

istock banner ad

And if you don’t have any clue on what font to use, we recommend you Tahoma, Roboto, Arial, Verdana, Century Gothic, Futura or Georgia.


C. Brand identity elements (Logo, Name, Website)

A logo is not a brand and a brand is not a logo. But with the logo, you will always identify yourself and it helps you stand out in the crowd.

I see a lot of banner ads without their logos on it and I just don’t click on them. Why? Because I don’t know you who’s going to be behind that banner ad.

So insert your logo in your banner ad in order to build trust.

Let’s look a little bit on Kissmetrics logo:

Kissmetrics Logo Dark

The KISSmetrics company logo is simplistic in style, consisting of only five solid elements, four of  which have the appearance of a bar graph representing the analytical nature of the brand. The solid shape surrounding the bars is a border of a heart symbol rotated left on it’s side, representing the “Keep it simple” nature of KISSmetrics company’s mantra. It also represents KISSmetrics company nature of being helpful, personal and friendly, something we strive for every day.

And now let’s see their banner ads:

Kissmetrics banner ads

You will see that they use their logo in every banner ad. Even if it’s not the entire logo, with the “kissmetrics” letter, but it’s the important graphic element that they use to build trust.

You can use the important element from your logo or you can use the entire logo with the letters. But you should never forget to insert your logo in your banner ads.

Maybe sometimes you just don’t want to put your logo out there, so when that happens, you can use only your brand name (don’t forget about the readable fonts) or your website.

Yes, you can write down your website on your banner ad, this way you will tell the user where this banner ad will have the landing page.

Just like “Power PDF” is doing with their banner ad.


D. Call-to-action button

We don’t need to remind you the importance of the CTA button in a banner ad because my colleague wrote an article about it and created a video where he showed you the way you can insert and customize buttons in our app.

Each banner should have a call to action button in order to grab the customer’s attention. .The call to action is essential and we highly recommend you to add a high contrast button on all of your banners Buttons are what make people click and conversions happen. So if you want to generate conversions with your banner, add a Call to Action Button.

E. Images

Images are also important elements in your banner ads. Because the low-quality, blurry one will make your banner ad look less credible; and trust me when I’m saying almost nobody will click on it.

This is why in Creatopy you can use our +5000 professional stock photos ready to use in any banner (with transparent background).

But what kind of images can you put in your banner ad?

1. Product

If you have a product you want to insert in your banner ad, you should choose the highest quality image.

MVMT create a 300×600 size banner ad where they show their a high quality images with their product. They believe in their high quality product, so that means they should have the best picture of their product, right?

MVMT banner ad

If you want to know how important the quality of a product image is, just think about the banner ads Apple had over the past years:

Apple banner ads

2. Personas and Emotions

Facial expressions of emotion are part of our evolutionary history and are a biologically innate ability, we all have the ability to read them.

So think about using persons in your banner ads.

You can think of a client who is using your product.


Or if you fight for a cause and you want to get people involved in your project, you can use emotional pictures.

cause banner ad

Also, you can use your brand ambassadors, just like CNN is doing with Christiane Amanpour, Anchor and Chief International Correspondent.

Christiane Amanpour banner ad

Or just figure out how your buyer persona should look like and find some good looking stock photos.

Banner ads stock photos

3. Backgrounds

Backgrounds for the banner ads are important as well.

You can use a simple color, texture or even a low opacity picture just like Kissmetrics, Sprout Social, NewsCred or Grid do.

Banner ad background example

The background in your banner ad should help your message, your logo and also your CTA buttons to stand out in your design.

If we look at SEMrush banner ads, we can see a simple color that is looking exactly like their brand main color:

SEMRUSH banner ad

And this color helps the message plus the buttons to get noticed by the user. Simple, right?

I recommend you to use a simple color and texture, so that your other elements can make a great job to convert the user who is looking at your banner ad.

Please, stay away from over crowding your banner ad and keep it short and simple.  Also, you can use our Banner Score – it can be your personal assistant, helping you create your best work.


Start designing your banner ad with the next question: What is my purpose with this banner ad? 

Use the standard banner ad size. Be transparent and truthful with the message on your banner ad.

Build trust with your brand, high-quality images and good colors.


Now back to you, do you follow a certain guide when you create your banner ad?



Robert Katai
Robert Katai is the Product Marketing Specialist at Creatopy. His work was featured on Adweek, Entrepreneur, Marketing Profs, Content Marketing Institute and other places.


  1. I just want to advertise a company’s product on my blog, and is compulsory to go create a banner before I am able to put the ad?

  2. Yes, we recommend you to start create a banner before you are able to put the ad. You could just write on the banner for your blog – advertise your company here. And so people and the advertiser will know that they could advertise on your blog.

Leave a reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

You may also like