HTML5 mobile banners – the new era of ad creation

Éva Szántai

Director, Product & Technology

In the past one and a half year the creative part of the advertising industry was loud from HTML5. The “death” of flash has started a whole avalanche, and today everybody wants HTML5 banners whether it’s on web or mobile. In the world of mobile ads it wasn’t new, because due to the low then discontinued support of flash, on mobile every animation is made with HTML5 for years.

We placed our bets on HTML5 in 2010, as this was the year when we had run our first campaign made with HTML5 technology. It wasn’t sharp and moved lumpy, but the effect a moving banner made was noticeable anyway. The Hungarian and international mobile websites mostly consist of static pictures and texts (in the worst case of gifs), thus the banners which move are more successful when it comes to raising awareness. In addition, a HTML5 banner is a spectacular antidote against banner blindness.

HTML5 is not only good because it’s conspicuous, but it’s also device-independent. The same banner, game or even website could be displayed without any conversions or extra production on mobile, tablet or web too. Thus, if there is a banner size in the production list which is suitable for every platform – e.g. 300x250px – then it only takes one round to made it, saving time, manpower and money.

We prefer HTML5 banners, because almost everything is realizable with this technology. We could add different components to it, so even videos, galleries or longer texts and games could appear in the banner. A whole product promotion or a brand is introducible through it. It is even more useful, when too much information is needed to be placed on the ad. For example, the legal text could be hidden under a button, and only appears to interaction. It helps to decrease the sense of crowding that the different texts may appear after each other. It’s also possible to implement dynamic elements: the banner’s message may change according to the location or weather, like in one of our recent campaigns.

More special solutions are easily feasible thanks to HTML5. We constantly seek new possibilities to create something different than standard static pictures and how we could highlight the banner with captivating movements which match the product, emphasizes its features and raises awareness in a sophisticated way.

The best scenario is when we have all the materials of the campaign, so only the imagination limits the solutions. This is how our game for the Angry Birds movie has been made or the idea of using the mobile’s gyroscope for the Batman v Superman campaign was born.

It’s important to follow a few basic rules during production, because they guarantee your campaign won’t perform worse than its static counterparts:

  • Avoid the gratuitously long animations! It’s a common mistake when the client choses HTML5 format, everything that can move in the banner, moves. This makes the ad incomprehensible and heavy, and the brand also becomes unrecognizable (e.g. the logo appears only in a specific phase). Under particular circumstances even the appearance of some small text or a picture might be enough animation.
  • Keep yourself to the size limits! It’s even more important on mobile to load the banner quickly, and the mobile internet hardens the situation even more. Forget the programs converting flash to HTML5, because they are full of codes which make the banners too heavy.
  • Only sharply! The biggest enemies of size limitations are picture sizes, but those help us to make razor sharp, high-resolution ads. Due to the increasing mobile screen sizes and pixel numbers we have to upload twice as big pictures to the adserver to serve them elegantly. We could use picture-optimizers or sprite solutions in order to decrease them.

Flash is not supported by any big search browsers anymore, so it’s obvious that the world is going towards HTML5 solutions. With the end of the never was mobile flash era it’s not worth to consider HTML5 as a banner burdening enemy. With a little exaggeration, we could say HTML5 is a digital media toolbox, which subverts the whole ad world. This progressive technology enables brands to be present with such creative advertising solutions on mobile that they not only reach their audience, but actually engage them.



September 19, 2016
Seeing is believing – the current state of mobile viewability

We have written about the importance of viewability in digital advertising early last year. Ever since we have gathered a lot of experience and many things have changed in the industry, so we decided to dedicate a second overview to this topic.

Read it >
2017 Rewind

It’s become a tradition now to summarize the best moments, do we have a lot to sum up this year again. Gábor has already shared his predictions for 2018 but for now let’s see what were we up to in 2017.

Technical development of the year: MCX

In 2017 we introduced our big hit, Madhouse Creative Exchange (MCX). This innovation allows even rich media formats to run on programmatic. Here are two …

Read it >