About HTML5 creatives

HTML5 creatives don't require third-party plugins or special file types. This makes them compatible with most mobile devices, including iOS. In fact, HTML5 features are increasingly supported across major devices and browser types.

Display creatives are non–rich media creatives made with HTML, JavaScript, and CSS that support the following features:

click tag reporting on individual exits

unlimited asset file size

polite loading

Rich media Rich media creatives include interactive elements, like videos, games, or galleries. They can also expand to provide a larger canvas for your brand's message, or fill the screen between natural content breaks. Each element can include detailed tracking metrics to get insight on creative performance, including up to 100 exits and up to 400 total tracking events. Rich media creatives must be created in Studio, then published to and trafficked in Campaign Manager.

Prepare and upload HTML5 assets

To set up display creatives or HTML5 assets, upload your HTML5 creative to Campaign Manager in the form of a .zip file. The .zip should consist of an HTML file plus any files referenced by the HTML file.

Create a folder.

Add your HTML file plus any assets referenced by the file. Don’t include any other files. You may organize your assets into subfolders, but do not compress these subfolders.

HTML file: The primary asset of your HTML5 creative is the HTML file. This is the entry point for your creative. It must be a complete HTML document that includes at least one click tag and can load into an iFrame. Campaign Manager serves the iFrame along with your assets. See below for click tag help.

Other files: Include any other files that are referenced by the HTML file. Do not include any files that are not referenced.

What not to include

No .zips within .zips: Do not include any .zip files within your HTML5 .zip file. However, if you have several separate HTML5 .zip files for several separate HTML5 creatives, you can zip these files together and batch upload them to Campaign Manager.

No unreferenced files: As noted above, only include files if they referenced by the HTML file.

No local or session storage: Campaign Manager does not accept HTML5 assets that use local storage or session storage.

No backup assets: Do not include backup assets in your HTML5 .zip file unless they are referenced by the HTML file.

The trafficker must upload a separate backup image to Campaign Manager. This image is used if Campaign Manager cannot use your primary assets because they are not supported. Do not include this backup image with your HTML5 .zip file.

However, some HTML files may be coded to use their own backup assets when a browser can't handle all the features. In this case, you'll need to include a backup image in your .zip in addition to the file the trafficker must upload separately.

If you have problems uploading your file: The issue may be that your file did not contain valid HTML5 assets, contained more than 100 files (the maximum), or exceeded your file size limit. Another issue may be that your HTML5 asset uses JavaScript APIs for local storage or sessions storage. To help protect user privacy, Campaign Manager does not allow these APIs.

To help protect user privacy, Campaign Manager does not accept HTML5 assets that use local storage or session storage. If your upload is rejected for this reason, work with your developer to remove the forbidden APIs. Then try uploading the asset again. Specifically, you cannot upload HTML5 assets with the following JavaScript APIs:

indexedDB

localStorage

openDatabase

sessionStorage

If your advertising goals depend on these APIs, try using Campaign Manager settings instead. For example, some advertisers use these APIs for ad targeting and frequency caps, but this isn’t necessary: you can use Campaign Manager to set up many kinds of targeting, and to set frequency caps. Ask support for help implementing workarounds. (Just keep in mind that regardless of how you set up your asset, you should only attempt to capture data that meets the privacy requirements in your contract with Google Marketing Platform.)

What is local storage and session storage? These are two kinds of HTML5 Web Storage. They are ways to store data on a browser. Local storage stores a file on the browser across browsing sessions. It remains on the browser permanently, unless the user clears the browser cache or deletes the file manually. Session storage only stores data on the browser during a particular browsing session. Once you close and restart the browser, all the session-stored data will be cleared.

Why isn't this type of storage allowed? The stored file can potentially include code designed to capture Personally Identifiable Information (PII), track cross-session browser activity, or send other data to third parties that may violate the terms of your Google Marketing Platform contract. This kind of data collection is certainly not the only use of local and session storage, but it's one possible use, because the file can include any type of code.

Dimensions

Unlike images or videos, HTML documents don't have dimensions on their own. For this reason, use the size meta tag to indicate the intended size for your creative. The size meta tag is an optional parameter in your HTML document. It's the best way to be sure your creative renders at the right dimensions.

HTML5 creatives for Campaign Manager can have fixed dimensions e.g., 300x250 or 400x400. Traffickers can only assign these creatives to placements of the same size

Click tags

Include one or more click tags in your HTML file. Click tags allow Campaign Manager to pass a click-through URL to the creative and track clicks. They also allow traffickers to change the click-through URL after your creative's been built and trafficked.

Make sure your banner uses the click tag variable as the click destination.

The click tag should be easy for the ad server to read—no minification or obfuscation, though you can use minifers in the rest of your code and in other files.

We do not recommend hard-coded click-through URLs in your HTML file because that prevents Campaign Manager from tracking clicks.

Sample files

Here's an example of a complete HTML document for an HTML5 creative. The click tag and size meta tag are shown in bold.

Because this creative is so simple, no other assets are needed. If this were your HTML5 creative, you'd compress it into a .zip file, change the file extension to adz, and send it to your Campaign Manager trafficker.