Sign in As:

Welcome to the BannerBoo Advertising and Marketing Blog

Advertising tips, advice, and blogs from the BannerBoo team
header image
How to make animated GIF banner ads: step-by-step instructions

How to make animated GIF banner ads: step-by-step instructions

According to Giphy, an average user spends about 2 hours a day watching animated banner GIFs online on their network services. Considering this attention and the ability to attract the audience, animation banners in particular will become an excellent media tool for advertising campaigns to overcome banner blindness on the Internet. Do you want to test all the abilities of banner ads? Then we invite you to learn how to create a banner and try everything in the BannerBoo designer right now!

An example of GIF banner made with BannerBoo tools

An example of GIF banner made with BannerBoo tools

How to make animated GIF banner ads

Step 1: Decide on the size of an animated paper

In order to decide on the size of your ad, answer 3 key questions:

  1. On which platform will you host your ad?
  2. In which block on the page should the banner be?
  3. What sizes are available for your ad message?
Take a look, for example, at Google recommendations for which banners are effective and desired. And in BannerBoo designer, when choosing a size, you immediately get successful banner ads examples with set parameters. Moreover, each banner can be designed in the size you need in just a couple of clicks, which means that you can conduct split tests and determine the most suitable size for your advertising campaign.

Top performing ad sizes

Step 2: Set the background

To make your banner truly recognizable, you don't need to use too many colors. Develop a general color concept as close as possible to the design of the website or page that your animated banner leads to. Work with color schemes or ready-made backgrounds in high quality with our gallery of over 1,000,000 photos. Didn't find what you were looking for? You can always use your own creative photo or picture. There are no prohibitions on commercial use (advertising that brings money) of the copyright object.

background color screen

Step 3: Add a specific ad message

Follow the “4U” rule: “usefulness” of the product, “ultra-specificity” of the offer, “uniqueness” (of the product or offer), and “urgency” (in what period of time the offer is valid). These are the answers the reader should get in order to understand whether one should click on the ad or not. Moreover, by providing this information, you will also save your advertising budget, as the fewer the users who don’t benefit from your offer, the cheaper the hosting will be.

Add a specific ad message

The example of adding a specific message

Step 4: Install a button in the online animated maker

The online banner click-through rate mainly depends on how the call to action or the button is designed. Internet users already understand this concept, since everyone already intuitively knows that the button performs the action that one needs. Implement the button directly under the advertising message and do not forget to add a name to it: "Order," "Buy," "Get a consultation." Note that the name of the button determines what the reader will receive on the page they’re taken to. So carefully choose both the page and the call to action on the button.

How to add a specific ad message

An example of a button in the online animated banner

Step 5: Add dynamism

To animate a banner is quite simple: choose elements that will change from frame to frame: inscription, icons, backgrounds, buttons. Work with an animation timeline where you can move elements to create the fade in / out / motion effects. Please note that the total animation duration should not exceed the recommended indicators of your website (usually 15-30 seconds).

buttons screen

Step 6: Save the ready GIF animated banner

Set the number of banner playbacks repetitions and optimize display ads under individual requests. With BannerBoo, you do not need to waste hours adding and removing effects by trial. It is enough just to mark the maximum size and acceptable quality of the final file; the designer will do the rest itself.

smooth gif screen

Be creative and reach your goals!

In 2020, according to Smallbiz Genius, the average user sees around 1,700 advertisements per month but only notices half of them. Work on the quality of your banner images, create ads using the “4U” technique, use relevant but creative effects, and perhaps your display ad will be appreciated by users!
Try to create your first advert in our animated banner maker, and you will see — it's fast, simple, and very interesting!

« Back to the list
Related posts:
How to make animated banner ads online: tips from the best advertising experts
How to make animated banner ads online: tips from the best advertising experts
What is an animated banner?
What is an animated banner?
arrow icon
Upgrade for Exclusive Features!
Upgrade icon
Ignite your creativity with our premium subscription!

✨ No watermark
✨ Unlimited banners
✨ Banner resize
✨ Animated banners
✨ Export to GIF, HTML, AMP

Unlock a treasure trove of cliparts, professional templates, and exclusive branding options. Upgrade now!
Oh noes!
We are sorry, it seems like your web browser is using some kind of Ad blocker.

Since BannerBoo is all about creating and managing banners, an ad blocker would heavily impair your experience and the whole application in general.

Please add ** as an exception or disable the ad blocker to continue.