3 reasons to use HTML5 for your next banner ad

Every advertisement craves attention. But in our busy, crowded world, competition for attention is fierce. Smart marketers are taking steps to ensure their ads not only attract attention, but do so in a non-intrusive and polite way. One of the ways to achieve this is with animated banner ads. But what kind of animated banner ad should you use? GIF? HTML5? There are some significant differences, and we believe that HTML5 is the way forward for animated banner advertising. With that, here are 3 reasons to use HTML5 for your next banner ad.

1. Use HTML5 for your next banner because HTML5 files are smaller.

GIFS are created by swapping out a series of full-size images. It’s like drawing a running stick man on the edge of a book and flipping pages. Even though just the running stick man is moving, you must flip the whole page to see the animation. When a GIF animation is rendered by the browser, each frame (page) must be re-rendered. As you can imagine, that adds up quickly. Consider someone on a mobile device without unlimited data having to wait for your ad to load… Not a great experience.

HTML5, by contrast, only animates the part that is moving. This results in a much smaller file size because there is no frame to re-render whenever something changes. When most platforms are requiring ads under 150K (Google included), size is incredibly important.

2. Use HTML5 for your next banner because it presents your brand more professionally.

GIF files are 8bit. That means they have 256 colors maximum. On the other hand, HTML5 files have access to 16.7 million colors. If your company’s blue must be a certain blue, you will be hard-pressed to get that from a GIF.

Being 8bit also affects other elements like photos and gradients. You will notice pixelation, dithering, and banding in gradients. That is because there simply are not enough variations in 256 colors to render elements properly.

On retina screens, GIF ads often feel dull and blurry. On standard screens, GIFs can look jaggy and splotchy. HTML5 does not have these problems. There are plenty of colors to render your brand professionally every time.

As noted earlier, with GIF each frame has to be re-rendered to create the illusion of movement. Oftentimes its necessary to cut out frames to stay under platform size maximums. That creates jumpy or stuttering animation, probably not the look you’re going for. HTML5 animations are smooth as can be. Low speed animation such as the Ken Burns effect or high speed movements are accomplished with ease and look amazing.

3. Use HTML5 for your next banner because it delivers more creative freedom.

GIF files are created in software like Adobe Photoshop, Sketch, or Canva. Each frame is crafted, and movements are most often built frame-by-frame. While this allows for some creativity, designers are limited by the platform and the GIF format itself.

HTML5 is powered by HTML, JavaScript, and CSS, among other technologies. This provides incredible flexibility and a host of options. Tackling effects like opacity, movement, rotations, and interactivity are all possible. Try call to action buttons that get bigger or change color on mouseover, or an open sign that swings in “3D”. Yep, HTML5 can do that.