Creating HTML5 Ads with Animate CC: Google HTML5 Ad Templates
by Cory Hudson
posted on 08-24-2016
So, as a reward for you readers who have made it to the end of my series on creating HTML5 ads with Animate CC (see more posts on this), I am providing you with 2 updated AdStarter FLAs in order to help you get started using Animate CC for HTML5 ads that will be served through one of Google’s ad-serving solutions.
Specifically I am sharing separate templates for standard HTML5 ads that are compatible with both Google DoubleClick and Google AdWords. It’s probably worth mentioning that the 2 templates are identical except for the fact that the AdWords template uses the Google Exit API for click-through handling which allows you to easily limit the clickable area to specific elements if desired. This can come in handy because HTML5 ads that are created with Animate CC, will by default, be clickable on the entire area of the ad when uploaded into the AdWords platform.
Please understand that this is a behavior of the AdWords platform and not a limitation of Animate CC. In fact, when using Animate CC it is extremely easy to assign click-through functionality to individual elements such as simple Buttons, invisible Buttons and MovieClips in order to define and restrict the clickable areas of your ad unit. You are free to take this approach with ads created for DoubleClick, however AdWords handles this differently, which is why the template leverages the Google Exit API.
For more information regarding the specific HTML ad requirements for both AdWords and DoubleClick, please refer to the following links:
The AdStarter FLAs automatically leverage the most commonly used features covered in this article, specifically the new template tokens, high-DPI scaling and preloader support. The other features that I’ve introduced in this article are ones that you can decide to enable through the Publish Settings on an as-needed basis.
Now if you’ve read my previous articles then you may recall that AdHelper handled high-DPI scaling and my custom template handled preloader support for you. With these new FLAs that I am providing, Animate CC is now handling those features instead. That said, the custom templates still provide you with the option to leverage AdHelper for animation control, performance monitoring and backup logic. If you wish to continue to use AdHelper, simply uncomment the AdHelper code within the HTML output.
There is no better time than the present to begin using Animate CC for HTML5 ad creation. The program has continued to evolve and currently features a powerful collection of tools that are extremely easy to use and that facilitate an incredibly efficient workflow.
Products: Creative Cloud