Preparing Your HTML5 Creative

HTML5 creatives must meet the IAB standards for HTML5, which are defined in HTML5 for Digital Advertising v2.0. If you upload your HTML5 creative, it must also meet these requirements:

  1. All code needed for the creative (HTML, CSS, and JavaScript) must be compressed into a single .zip file.
    • If your HTML5 creative is already a single .html file, you must still zip it up and upload it to the DSP as a .zip file.
  2. The main HTML file must be in the root directory of the .zip file.
    • If only one HTML file (*.html or *.htm) is in the .zip file, this is considered the main HTML.
    • If your .zip file contains multiple html files, the main HTML file must be named index.html.
  3. The .zip file must be smaller than 200 kB.
  4. The clickable area on the creative must be either

    • A single clickable area that covers the entire creative:

      • No interactivity
      • No additional tracking events
      • If a user clicks anywhere on the creative, the ad opens one landing page.

      -or-

    • Designed with a click tag query string parameter. There are two options available here based on whether you declare the destination URL with the DSP or let the destination URL be decided by the creative at runtime:

      • The ad's Destination URL is declared with the DSP when you upload the creative:

        JavaScript code inside the HTML5 creative must read the click tag from a query string parameter named "clickTag" or "clickTAG".

        This example reads the click tag URL from a query string parameter named "clickTag" and then opens that URL in another window:
        function getParameterByName(name) {
            var match = RegExp( "[?&]" + name +  "=([^&]*)" ).exec(window.location.search);
            return match && decodeURIComponent(match[ 1 ].replace(/\+/g,  " " ))
            }
            window.open(getParameterByName( "clickTag" ),  "_blank" )
            
      • The ad's Destination URL is not declared with the DSP, but instead is decided at runtime when the ad is clicked:

        When the ad is clicked, the JavaScript code inside the HTML5 creative must read the click tag from a query string parameter named "clickTag" or "clickTAG", and then append the Destination URL where you want to take the user.

        This example reads the click tag URL from a query string parameter named "clickTag" and then opens that URL in another window:
        function getParameterByName(name) {
            var match = RegExp( "[?&]" + name +  "=([^&]*)" ).exec(window.location.search);
            return match && decodeURIComponent(match[ 1 ].replace(/\+/g,  " " ))
            }
            var clickRedirect = getParameterByName("clickTag") + getDestinationURLBasedOnClickLocation();
            window.open(clickRedirect, "_blank" );
  5. The creative code cannot interact directly with the parent window. HTML5 ads are served into an iframe, meeting publishers' security requirements. This iframe prevents a creative from manipulating or reading objects in the browser or the publisher's page.
Was this article helpful?
0 out of 0 found this helpful