The benefits of HTML5 animated adverts
In this article, we’ll discuss what’s special about HTML5 adverts – and why you should use them.
HTML5 adverts are online display adverts for services and products. They appear in a range of sizes on websites that are part of the Google Display Advert network and provide smooth and complex animations along with user-triggered and interactive functions.
The adverts can support short video sequences, multi-layered animation and different mouse-over and on-click functionality. Until the advent of HTML5 adverts, achieving animation in adverts was limited to animated gifs, slow and jerky stop-animation techniques, basic, single-click linking to a URL, and large file sizes.
What are the benefits?
HTML5 adverts are the future of online display advertising because they make use of the better and more complex browser support that is now available.
- Visually more appealing for web users
- Greater and enhanced options for interactivity
- More visual impact to get messaging across in an already-busy arena
- Light in filesize
- Better browser and mobile compatibility
- Video clip support
Why use HTML5?
Simply put, by using a code-based language that all browsers understand, rather than stitching together lots and lots of images in a motion-stop animation way, filesize stays small and is therefore quicker and better for both desktop and mobile experiences. Users can enjoy enhanced code-based features and functions that remain compatible with the different browsers.
The examples at the bottom of this post each only carry a 30kB file size, whereas their older animated gif format equivalent (which wouldn’t have the smoothness or degree of complexity) would weigh in at around 500kB (0.5MB). In any case, it is unlikely such a large gif file could have been used, because many online platforms limit ads to 300kB.
Google has firmly pinned its future of online advertising as coming from mobile phone advertising and in many cases is displaying the mobile-optimised content first. It’s therefore essential to ensure compatibility with mobiles, which is where HTML5 scores another point. Lighter, faster and better-looking is the future. For now, anyway.
What about Flash?
Flash is what was popular if you hop in a time machine and rewind to the year 2000. It is one of those proprietary languages created [originally] by Macromedia and then taken over by Adobe. Adobe’s Flash application was eye-wateringly complicated, didn’t come with any sort of manual and created adverts that didn’t display properly in 50% of browsers because it also required the user’s browser to have a special extension or plugin installed. You will have seen the ‘Flash plugin not installed’ image on a website in the past.
By using native code in HTML5, many more people will see the advert without them having to install any special extras or do anything out of the ordinary.
How are HTML5 adverts created?
We recommend and use Google’s own tool – Google Web Designer. It has a similar interface to those of other design packages and works like other animation and scene-creation applications. It has a timeline for each layer that has graphics, text or video and, once the finished advert is ready, can be exported to a ‘packaged’ folder of files for hosting either on Google Display AdWords or on a private website.
Below are two examples of recent HTML5 animated adverts:
How much do they cost?
Typically, an HTML5 animated advert similar to the above will take a designer around 3-4 hours to create and so carry a cost of around £200. If you’re interested in HTML5 adverts for your business, we’d be delighted to discuss them further with you.