HTML5 Creatives. MediaMath now supports HTML5 Creatives. Each T1AS HTML5 Creative must be uploaded with the following 2 components:

Similar documents
BEST PRACTICES HTML5 SPECIFICATIONS. what's next in data-driven advertising. File Types. HTML5: HTML, JS, CSS, JPG, JPEG, GIF, PNG, and SVG

Technical Specifications Leaderboard + Mobile Leaderboard. 27/12/2018 Tech Specs 1

If you are supplying a 970x250 Billboard or 970x90 Super Leaderboard you must supply the following sizes for Mobile and Tablet:

Mobile LREC. Dimension: Mobile: 640 (W) x 500 (H) pixels (for News app now, available on mytv SUPER app since Jan 2018)

Contents AD SPECIFICATIONS AND STYLE GUIDE 2018

PRODUCTION GUIDE. Adform Skin (836x x x x x754)

CREATIVE SPECIFICATIONS

HOW TO Build an HTML5 Pushdown Banner

AD SPECIFICATIONS AND STYLE GUIDE 2018

Haymarket Business Media RECRUITMENT AD SPECIFICATIONS AND STYLE GUIDE 2018

Contents AD SPECIFICATIONS AND STYLE GUIDE 2017

MIMS Online AD SPECIFICATIONS AND STYLE GUIDE 2018

AD SPECIFICATIONS AND STYLE GUIDE IMPORTANT INFORMATION Please ensure that all Third Party Tags are SSL compatible (see page 9)

Chapter 1 Introduction to Dreamweaver CS3 1. About Dreamweaver CS3 Interface...4. Creating New Webpages...10

Flash Ads. Tracking Clicks with Flash Clicks using the ClickTAG

Haymarket Business Media AD SPECIFICATIONS AND STYLE GUIDE 2018

Pop-up. File format/ size: Must provide (.gif or.jpg) still image - max. 75KB for Mobile - max. 400KB for Tablet

Figure 1 Properties panel, HTML mode

If you are supplying a 970x250 Billboard or 970x90 Super Leaderboard you must supply the following sizes for Mobile and Tablet:

TECHNICAL SPECIFICATIONS DIGITAL Q1-2019

Adform Nousukas (1600x40 > 1600x400) PRODUCTION GUIDE

Last updated on 1/20/2017

OU EDUCATE TRAINING MANUAL

1. Setup a root folder for the website 2. Create a wireframe 3. Add content 4. Create hyperlinks between pages and to external websites

AARP Creative Asset Specifications

Technical Specifications Half Page + Mobile Medium Rectangle. 31/05/2016 Tech Specs 1

Technical Specifications Expandable Takeover. 6/03/2017 Tech Specs 1

MIXPO GUIDE SERIES. Mixpo Platform User Guide: Overview of Rich Media Ad Units RICH MEDIA

DIGITAL TECHNICAL SPECS

TinyMCE Users Guide. This user manual will show you all the basics of the TinyMCE editor.

1 GENERAL CREATIVE SPECS

Web Programming and Design. MPT Senior Cycle Tutor: Tamara Week 1

Technical Specifications Responsive Takeover

Website Management with the CMS

Technical Specifications ONLINE 2019 Q1. De Standaard Het Nieuwsblad Gazet van Antwerpen Het Belang van Limburg

CMS 101. For questions or issues: go.pacific.edu/webrequest

/ Ver.1.0. Production Regulations

Manual Html A Href Javascript Window Open In Same

Banner Advertising Technical Specifications

DIGITAL TECHNICAL SPECS

INDUSTRY SITES AD SPECIFICATIONS

Online Creative Production Guidelines

CIW 1D CIW JavaScript Specialist.

Siteforce Pilot: Best Practices

GUIDELINES & SPECIFICATIONS FOR ADVERTISING ON THE SOJERN PLATFORM. Travel s Leading Performance Marketing Engine

DIGITAL TECHNICAL SPECS

HEALIO.COM ADVERTISING SPECIFICATIONS

Ad Spec Guide

CMS Training. Web Address for Training Common Tasks in the CMS Guide

How to lay out a web page with CSS

Technical Specifications Pareto pack:

How to use the Assets panel

Technical Specifications ONLINE 2019 Q1. De Standaard Het Nieuwsblad Gazet van Antwerpen Het Belang van Limburg Vier & Vijf Zes

MOBILE. SMARTPHONE 320x50 Small Banner SMARTPHONE TABLET STATIC. 320x480 Dual Full Screen. 1024x768 Dual Full Screen TABLET SMARTPHONE

Advertising Standards and Creative Specifications

Technical Specifications ONLINE

HTML5. clicktag implementation

Sharper Insight. Smarter Investing Advertising Specs

Technical Specifications ONLINE 2018 Q4. De Standaard Het Nieuwsblad Gazet van Antwerpen Het Belang van Limburg Vier & Vijf Zes

Technical Requirements

Sizmek Formats. The New MSN. Build Guide. October 2014

Third party edm - material specification

New Cars - Hero Image Guidelines. High Impact Homepage. Desktop & Mobile Specifications

Dear Candidate, Thank you, Adobe Education

Dreamweaver Domain 4: Adding Content by Using Dreamweaver CS5

GoLive will first ask you if your new site will be for one individual or a work group; select for a Single User, and click Next.

Digital Media Ad Specs

Design Importer User Guide

How to set up a local root folder and site structure

How to create and send a new . NOTE: See different guide for repurposing an existing

Chapter 12 Creating Web Pages

Online banner advertising specifications 2013

Advertising specifications. Version 1.1

Information Technology Services

Login: Quick Guide for dotcms & Accessibility April 2016 Training:

DIGITAL TECHNICAL SPECS

BCI.com Sitecore Publishing Guide. November 2017

Related Solution(s) Note: Standard Ad Solution. KBB.com Advertising Specifications Medium Rectangle (MREC) Ad Unit

Dreamweaver CS6. Table of Contents. Setting up a site in Dreamweaver! 2. Templates! 3. Using a Template! 3. Save the template! 4. Views!

Configuring Hotspots

Deadlines The creative must be received no later than 3 working days (usually a Wednesday) before the commencement of the advertisement.

COSAS A TENER EN CUENTA

Manual Html A Href Javascript Window Open New Browser

Manual Html A Href Javascript Window Open In New

AD SPECIFICATIONS. General Guidelines 1. Standard Display 2. Rich Media 3. Video 4. Appendix: Additional Ad Sizes 6

ADITION HTML5 clicktag

master ad specifications.

Xerte. Guide to making responsive webpages with Bootstrap

Designing the Home Page and Creating Additional Pages

PBwiki Basics Website:

Reporting and Printing Guide

Specifications Multiple Impact

Apple News Apple Advertising Platforms Specifications May 2018

The Economist Apps. Advertising Specs

Training Sister Hicks

This will ensure full campaign support, regardless of individual trafficker availability.

Online banner advertising specifications

Index. alt, 38, 57 class, 86, 88, 101, 107 href, 24, 51, 57 id, 86 88, 98 overview, 37. src, 37, 57. backend, WordPress, 146, 148

Google Chrome 4.0. AccuCMS

Internet: An international network of connected computers. The purpose of connecting computers together, of course, is to share information.

Transcription:

HTML5 Creatives MediaMath now supports HTML5 Creatives. Each T1AS HTML5 Creative must be uploaded with the following 2 components: Component HTML5 Asset Package: The zip file for the T1AS HTML5 creative. Overview This zip file must contain a root HTML document within the root directory: o The HTML5 Asset Package file name and the names of any files (HTML, Javascript, CSS or Image) within the Asset Package must not contain any blank spaces or non- English characters. o If the zip file has a single HTML document in the root directory, that HTML document will be used as the root document for the creative. o If the zip file has multiple HTML documents in the root directory, and one of them is named index.html, the index.html file will be used as the root HTML document. o If the zip file has multiple HTML documents in the root directory, and none of them are named index.html, the first HTML document detected by T1 Ad Server during upload will be used as the root HTML document. o As a best practice, it is recommended to have a single HTML document named index.html in the root directory of the zip file. o The root HTML document can be a maximum of 20,000 characters in length (including spaces and comments). o The root HTML document must have all tracked urls, including urls set via a Javascript, prepended with MediaMath s unencoded click tracker. o The root HTML document must not have any <noscript> tags. The zip file can also contain any of the following documents: CSS, Javascript, Image, Flash, Web Fonts and additional HTML documents. The file extensions supported by T1 Ad Server are:.swf (Flash),.GIF,.JPG,.JPEG,.TIF,.TIFF,.PNG,.CSS,.HTML,.HTM,.JS,.WOFF,.WOFF2. All resources referenced in the root HTML document must be referenced via relative links to files included in the HTML5 Asset Package. External images not included in the HTML5 Asset Package cannot be referenced from the root HTML document. The assets included in the Asset Package must not use local storage or session storage. HTML5 Backup Image Each T1 Ad Server HTML5 creative must have a single unique Backup Asset which is an Image Asset provided during upload. This Backup Image will be uploaded outside of the HTML5 Asset Package zip file. This Backup Image must have the same name as the HTML5 Asset Package. The Backup Image will be served when the creative is shown to users whose browser / environment has Javascript disabled. Since T1 Ad Server does not currently support responsive / resizable creative, the dimensions of the Backup Image selected will be used as the dimensions of the HTML5 creative. It is your responsibility to ensure that the creative uses graceful degradation and complies with guidelines recommended by the IAB. If the browser / environment the creative is served in does not support any features of HTML5 required by the creative, the creative must gracefully degrade to show alternate assets or a backup image. Compliance with IAB guidelines and exchange specific guidelines will improve the chances of a seamless creative approval and ad serving. MediaMath strongly recommends you to test the HTML5 creatives using an external testing toolkit such as the IAB HTML5 Ad Validator. To ensure a seamless browsing experience for users, we recommend that your creative complies with the file size and file load guidelines recommended by the IAB. You can use the IAB HTML5 Ad Validator to determine the file size and file load specifications for your creative. T1AS does not yet support resizable HTML5 creatives. The detected dimensions of the HTML5 Backup Image will be used as the dimensions of the HTML5 creative. If your HTML5 creative is resizable, you can simply upload one

HTML5 Asset Package and multiple HTML5 Backup Images of the different dimensions you want the HTML5 creative to serve for. The HTML5 Asset Package zip file cannot contain zip files within it. If the HTML5 Asset Package contains Flash (.SWF) files, the creative will not serve in Chrome and on exchanges which do not support Flash (e.g. AdX). T1 Ad Server does not currently support SVG files within the HTML5 Asset Package. T1 Ad Server does not currently support video files within the HTML5 Asset Package. T1 Ad Server HTML5 does not currently support expandables or MRAID. Click Trackers for HTML5 Creatives For T1 Ad Server HTML5 creatives, the MediaMath click tracker will need to be manually added to each HTML5 creative s root HTML document (for creatives generated from most builders, this document is named index.html in the root directory of the HTML5 Asset Package zip file). All click through URLs must be located in the root HTML document and the MediaMath click tracker must be prepended to all click through URLs to ensure tracking of clicks during ad serving. Below are guidelines on how the MediaMath click tracker can be added into the document for a sample set of scenarios. Please note that the guidelines do not cover all possible scenarios. It is up to you to ensure that the click tracker is included in the HTML document. The MediaMath click tracker to be added to the root HTML document is: [UNENCODED_CLICK_REDIRECT] If the Click Tracker is not added, T1 will not record clicks for the HTML5 creative. Prerequisites: You will require a text editor to complete the procedure below. If you do not have one, we recommend Sublime Text. Steps Step 1: Open The Root HTML Document For Your Creative Overview Open the root HTML document for your HTML5 creative. In most cases, this is the document named index.html in the HTML5 Asset Package.

Scenario A: Click Implementation via Javascript Variables HTML5 creatives may implement click throughs via Javascript variables. In such cases, the click through is often implemented via a variable named clicktag (although different may have different names for the variable) enclosed within script tags as shown below: /* <script type="text/javascript"> <--Javascript or HTML Markup--> var clicktag = "https://www.mediamath.com"; </script> */ In this case, MediaMath s unencoded click tracker will be prepended to the click through url (https://www.mediamath.com) as shows below: Step 2: Add The MediaMath Click Tracker To All Clickable Elements /* <script type="text/javascript"> <--Javascript Markup--> var clicktag = "[UNENCODED_CLICK_REDIRECT]https://www.mediamath.com"; </script> */ Please note that using the following method to implement click throughs in the body of the HTML document in FireFox will result in a successful redirect to the click through url in a new tab. However, the creative served in the original tab will disappear and be replaced by the text [object Window]. javascript:window.open( [UNENCODED_CLICK_REDIRECT]https://www.mediamath.com ) This is because FireFox expects a value to be returned for the Javascript function. If it does not receive a value, it replaces the HTML body with [object Window]. This can be fixed by forcing the expression to return a value by modifying the click through expression to: javascript:void(window.open( [UNENCODED_CLICK_REDIRECT]https://www.mediamath.com ));

Scenario B: Click Implementation via HTML Attributes HTML5 creatives may implement click throughs via HTML attributes. In such cases, the click through is often implemented via the href attribute which is enclosed in anchor <a> tags. as shown below: <a href="https://www.mediamath.com"> <--HTML Markup--> </a> In this case, MediaMath s unencoded click tracker will be prepended to the click through url (https://www.mediamath.com) as shows below: <a href="[unencoded_click_redirect]https://www.mediamath.com"> <--HTML Markup--> </a> Please note that using the href attribute to implement click throughs will result in the click through breaking when all of the following conditions are met: The creative is served on a device with ios version 9 or higher installed The creative s click through redirects to the ios App Store To avoid broken redirects when the above conditions are met, please use an alternative method for implementation of click throughs. Save the root HTML document. Open the document in a web browser and try clicking on the creative. In your test, the click will lead you to an error page which has the local file path followed by the MediaMath Click Tracker and your click through URL in the browser address bar as shown below: Step 3: Save and Test file:///localfilepath/[unencoded_click_redirect]https://www.mediamath.com This is the expected result and a sign that your creative will click through as expected. This can be confirmed by testing the click through in T1 preview. During ad serving, the click tracker will be expanded to ensure that T1 tracks all clicks for impressions served and the click tracker redirects to the valid, desired click through URL.

Step 4: Zip Creative Contents Select all of the files / folders of the creative and compress the contents into a zip file. You are now ready to upload your HTML5 creatives into T1. For an in-depth guide on uploading & editing creatives, please see: Display Tab Why am I now seeing multiple vendor declarations (T1AS, Sizmek Expandable, etc)? Do I/my clients need a Sizmek account? Will I/my clients have access to see Sizmek reporting? Since we are now retrieving Sizmek placement tags, our vendor auto-detection will detect both the T1AS vendor and a Sizmek vendor. Note: clients will not be billed for this new Sizmek vendor. No, there will not be individual accounts for each MediaMath client and you will not be billed by Sizmek. This entire integration will be run under the MediMath account and you will be billed for T1AS as normal. No, clients will continue to use T1 Reporting for T1AS creative reporting information after this initial integration. As we progress and begin to offer more rich media offerings, we will import Sizmek data in to T1 Reporting, but reporting will never be viewed on Sizmek. This project is happening in three phases: This is nice, but when can I expect to see full HTML5, mobile & rich media support for T1AS? Phase 1 (current): swf->html5-hybrid conversion Phase 2: Upload Standard HTML5 Banner - templates and ad builders Phase 3: Upload advanced HTML5 and MRAID creatives - templates and ad builders