- How to use the Google Web Designer interface
- How to create templates and animations
- How to build interstitial ads
- How to build advanced expandable ads
- In DoubleClick Campaign Manager, our systems will automatically show the HTML5 version of an ad, where available. (Before, the HTML5 version would only show in environments where Flash wasn't supported).
- DoubleClick Bid Manager will stop supporting bids for Flash ads in Chrome (which pauses Flash ads automatically). This means advertisers won't end up paying for ads that will be paused by default.
- HTML5 Overview Hangout and step-by-step tutorial
- Google Web Designer Landing Page with components and templates
- HTML5 Toolkit -- everything you need in one place
- Upcoming HTML5 Immersion Days: (All Immersion Days are hosted at Google’s offices. Please contact your DoubleClick Rep if you’d like to join.)
- In NYC: Monday, Jul. 27 (10am-1pm) and Thursday, Jul. 30 (10am-1pm)
- In LA: Monday, Jul. 27 (1:30-3:30pm) and Monday, Aug. 10 (2-4pm)
- In SF: Tuesday, Jul. 28 (1-3:30pm)
- In Chicago: Wednesday, Aug. 12 (1-3pm)
- Google Web Designer Fundamentals Certification Exam launches: To go alongside our DoubleClick Studio HTML5 certification exam, we’ll be launching a Google Web Designer certification exam that teaches you the ins and outs of building HTML5 ads with the tool. Block off an hour for Monday to take the exam and develop the expertise you need to use Google Web Designer to the fullest. Check back on our certification page on Monday to take the exam.
- “Making the transition to HTML5” Hangout on Air: Building ads in HTML5 is now more important than ever to ensure your campaigns run effectively across screens and browsers. Join us for a conversation about the state of the industry and ecosystem around HTML5, as we discuss the challenges that people face in making the transition to HTML5 and provide resources and tools for helping you make the transition for your own campaigns. RSVP here. [12pm ET / 9am PT]
- David Evans, Founder of the creative agency Hook Studios
- Brian Hoskins, Senior Manager, Digital Technology Development and Integration at ESPN
- Jonathan Marino, Creative Specialist, Google
- Moderator: Jeff Sundheim, Creative Account Executive, Google
- “How to build HTML5 ads: A step-by-step workshop” Hangout on Air: Many agencies and advertisers are still building campaigns in Flash, but we’re here to help you start building in HTML5 today. Join us for a live Hangout on Air workshop, where we’ll deep dive into the tools and resources available to build rich, impactful, beautiful ads. Bring your own creative assets and follow along as we walk through different creative formats and tackle complex ads with ease. RSVP here. [5pm ET / 2pm PT]
- HTML5 Immersion Day NYC: Designers and developers are invited to this half day workshop (12pm-3pm) in the Google NYC office. Bring your laptop and sit with our Creative Specialists to learn how to execute a campaign in HTML5, leveraging Google Web Designer and DoubleClick Studio. Please reach out to your DoubleClick Rep to RSVP if you’re interested.
- Can’t make it on the 23rd? There will be two other Immersion Days in NYC: Monday, July 27th (10am-1pm) and Thursday, July 30th (10am-1pm).
- Not based in NYC? We’ll also be hosting Immersion Days in LA on July 27th from 1:30-3:30pm and Aug. 10th from 2-4pm; San Francisco on July 28th from 1:00-3:30pm; and Chicago on August 12th from 1-3pm. Please contact your DoubleClick Rep if you’d like to join.
- New Google Web Designer Landing Page: Launching on the Rich Media Gallery, this page will contain instructions for building and using custom components and templates in Google Web Designer.
The HTML5 SDK has two main ways to render ads: what we call “standard” rendering and “custom ad playback.” To avoid confusion and to keep you all informed, here’s a breakdown of those rendering modes and how the SDK decides which to use.
Standard RenderingIf you're using the HTML5 SDK you probably have a web page playing your content in a
<video>element. In standard rendering, the SDK will create another
<video>element and render it in the ad display container div you provided, which should be placed on top of your video player. The ads will then play in this SDK-owned video player on top of your content player. To the user, it looks like one video player switching from content to an ad, but in reality it’s another video player appearing on top of your content to play an ad and then disappearing. For a visual representation of what’s going on, see the image below.
Why use standard rendering?The main benefit to this standard rendering involves buffering. Using a separate video player to render ads allows us to preserve your content buffer while ads are playing. If you’re playing a pre-roll, you can start loading your content when the ad starts and buffer the content the whole time the ad is playing. For mid-rolls, the separate player allows you to preserve your content buffer while ads are playing - if your viewer has buffered 10 minutes of your content, and you play an ad at the 5 minute mark, they won’t lose the content in the buffer for 00:05:00-00:10:00.
Custom Ad PlaybackAs avid blog readers will know, we recommend always passing in your content video element as the custom playback element. If you’re not already doing this, check out our guide to custom ad playback. The HTML5 SDK will intelligently use custom ad playback only when it deems necessary, as described below. When it’s not necessary, it will use standard ad playback.
What is custom ad playback?When the SDK decides to use custom playback mode, it renders video ads in the same player as your content. This means you lose the buffer-related benefits of standard rendering. If your viewer has buffered 10 minutes of your content, and you play an ad at the 5 minute mark, they will lose the content in the buffer beyond the ad. Certain ad formats (such as AdSense) require an SDK-owned player and can't play in your content player.
Why use custom ad playback?Simply put, some platforms do not support multiple, simultaneous, active video elements. On those platforms, the SDK can’t create its own ad player because the one allotted video player slot per page is already occupied by your content player. If the SDK tries to play an ad in a second video player, it will either fail to play (freezing the player) or make it impossible for the content to restart after the ad is finished (again freezing the player). Thus we must show the ad and video content in the same player.
How does the SDK know when to use custom ad playback?The HTML5 SDK looks at the UserAgent string of each browser on which it’s loaded. When it sees a browser that it knows has trouble with multiple video elements, it uses custom ad playback. Currently those browsers are limited to Android and iPhone. We’re in the process of phasing out custom ad playback on Android 4.0+ to bring the benefits of standard playback to users.
Now you know all there is to know about HTML5 video ad rendering. As always, if you have any questions feel free to contact us via the support forum.
Over the last four years, we’ve worked with browser vendors and the broader community to close those gaps, and now, YouTube uses HTML5 <video> by default in Chrome, IE 11, Safari 8 and in beta versions of Firefox.
The benefits of HTML5 extend beyond web browsers, and it's now also used in smart TVs and other streaming devices. Here are a few key technologies that have enabled this critical step forward:
Adaptive Bitrate (ABR) streaming is critical for providing a quality video experience for viewers - allowing us to quickly and seamlessly adjust resolution and bitrate in the face of changing network conditions. ABR has reduced buffering by more than 50 percent globally and as much as 80 percent on heavily-congested networks. MediaSource Extensions also enable live streaming in game consoles like Xbox and PS4, on devices like Chromecast and in web browsers.
VP9 video codec
HTML5 lets you take advantage of the open VP9 codec, which gives you higher quality video resolution with an average bandwidth reduction of 35 percent. These smaller files allow more people to access 4K and HD at 60FPS -- and videos start 15-80 percent faster. We've already served hundreds of billions of VP9 videos, and you can look for more about VP9 in a future post.
Encrypted Media Extensions and Common Encryption
In the past, the choice of delivery platform (Flash, Silverlight, etc) and content protection technology (Access, PlayReady) were tightly linked, as content protection was deeply integrated into the delivery platform and even the file format. Encrypted Media Extensions separate the work of content protection from delivery, enabling content providers like YouTube to use a single HTML5 video player across a wide range of platforms. Combined with Common Encryption, we can support multiple content protection technologies on different platforms with a single set of assets, making YouTube play faster and smoother.
YouTube enables everyone to share their videos with the world, whether uploading pre-recorded videos or broadcasting live. WebRTC allows us to build on the same technology that enables plugin-free Google Hangouts to provide broadcasting tools from within the browser.
Using the new fullscreen APIs in HTML5, YouTube is able to provide an immersive fullscreen viewing experience (perfect for those 4K videos), all with standard HTML UI.
Moving to <iframe> embeds
Given the progress we've made with HTML5 <video>, we’re now defaulting to the HTML5 player on the web. We're also deprecating the "old style" of Flash <object> embeds and our Flash API. We encourage all embedders to use the <iframe> API, which can intelligently use whichever technology the client supports.
These advancements have benefitted not just YouTube’s community, but the entire industry. Other content providers like Netflix and Vimeo, as well as companies like Microsoft and Apple have embraced HTML5 and been key contributors to its success. By providing an open standard platform, HTML5 has also enabled new classes of devices like Chromebooks and Chromecast. You can support HTML5 by using the <iframe> API everywhere you embed YouTube videos on the web.
Richard Leider, Engineering Manager, recently watched, “Ex Hex - Waterfall.”
- 250% growth in HTML5 impressions in DoubleClick Studio
- 130% growth in the percent of DoubleClick Campaign Manager impressions being served to mobile devices
- Almost half of the mobile inventory available in DoubleClick Bid Manager is now in-app inventory
- Easy HTML5 creative: Our platform will automatically create an HTML5 version of every Flash banner you upload, with automatic Flash-to-HTML5 conversions for reservation campaigns (available in beta for programmatic campaigns). When your ads run on mobile devices, the interactive HTML5 ad will show up instead of a static backup image, helping expand your reach on mobile. You can also report on HTML5 impressions separate from Flash impressions. Learn More>>
- Precise mobile targeting: For users who opt-in to location-based targeting, marketers can use Geofence Targeting in DoubleClick Bid Manager to deliver highly relevant messages to people based on their proximity to a specified chain store, across a broad geographic area. You can easily target all your store locations with a single click, enabling you to reach the right consumer and drive foot-traffic into your stores. For example, if you’re a hotel company, you can reach people who are close to your hotel, and offer them a discount to get them to choose your business. Learn more>>
- Re-engage your app users: People are spending 86% of their time on mobile devices in applications. (4) DoubleClick now allows marketers to remarket to existing app customers inside other apps, for both reservations and programmatic buys. Using Floodlight tags, you can create audience lists around any engagement that takes place in-app (e.g. people who added an item to a shopping cart, top spenders in the last 30 days, or gold member app users). This lets you improve ROI by offering relevant ads to people who are already in the purchase funnel. Learn more>>
2. StatCounter Sept. 2013 data
3. Internal DoubleClick Data, Nov. 2014
4. Flurry Analytics Report, Mar. 2014
Getting startedThere are no configuration or setting changes to the IMA HTML5 SDK to enable IE11 support. If you already have a player with the IMA HTML5 SDK integrated, you can start serving to IE11 visitors immediately.
If you want to walk through integrating the IMA HTML5 SDK with an HTML5 video player, check out our quick start guide.
Older Internet Explorer versionsCurrently only IE11 is supported; some publishers are using the IMA HTML5 SDK with IE10 without issues, but it isn't officially supported. SDK support will be focused on on IE11 and subsequent versions given the upgrade rate from IE10 to IE11. Version 9 and earlier of Internet Explorer are not supported by the IMA HTML5 SDK and likely will not correctly serve video ads.
Questions?If you have any questions about Internet Explorer support or other IMA SDK questions, feel free to contact us via the support forum.
On desktop, they could use the video camera on the computer to capture a person’s lips. But smartphones and tablets don’t have a front-facing video camera that would work. Instead, the developers used the touch screen capabilities of these devices to allow people to kiss their screen. The device was able to understand the size and shape of the person’s lips via the touchscreen and digitize the image. This provided the same overarching brand experience for the user, but utilized a different way of executing it on different devices.
Posted by Becky Chappell, Product Marketing Manager, DoubleClick
Source: DoubleClick Advertiser Blog
Savvy advertisers know they need to pair smart creative with their media buying strategies, to accomplish successful digital campaigns. Today, we're making it easier than ever to do just that with 13 new tools across our DoubleClick Creative Solutions. These updates help advertisers succeed with four key creative + media pairings:
1. Powerful creative management tools support large-scale campaigns
2. Dynamic creative tools support programmatic media buys
3. HTML5 and in-app creative tools support mobile ad targeting
4. In-stream video tools support video ad targeting
- A lightweight version of dynamic creative for retail and hotel clients is available in DoubleClick Bid Manager (Premium US users). Use six HTML5 templates to build dynamic ads that are aligned with the programmatic media buy. They work for Facebook right-hand side inventory too!
- Advertisers can now pull their Google Merchant Center Feed into a dynamic remarketing creative in both DoubleClick Studio and DoubleClick Bid Manager. This makes it much easier to build complex retail campaigns without having to re-input the data.
- Understand which products in your dynamic ad lead to which website conversions, using the new u-reporting feature in DoubleClick Studio.
- Build mobile-compatible ads in minutes, with 20 new HTML5 and in-app Studio Layouts.
- To build more custom HTML5 ads, agencies can use Google Web Designer and then publish their ads in one click to DoubleClick Studio.
- For a dynamic creative campaign, DoubleClick Studio supports HTML5 dynamic creative, so advertisers can ensure their real-time messages reach consumers wherever they are.
- Publish with confidence: DoubleClick supports MRAID 2.0 (the IAB’s latest mobile in-app standard) and has certified over 90 of the largest publishers and networks, to make sure their websites will support DoubleClick in-app ads.
- Our new VPAID Layout lets you easily build interactive in-stream video ads (VPAID). Simply upload your video asset and add interactive elements to create a complex ad unit in minutes.
- You can also ensure people have a smooth viewing experience with your mobile video ads. DoubleClick Campaign Manager will transcode and segment your videos so they can be served in a file size that will load on the viewer’s mobile connection (3G, 4G or wifi). The video can even be altered on the fly, if the connection changes during playback.
Posted by Becky Chappell, Product Marketing Manager, DoubleClick Creative Solutions
Source: DoubleClick Advertiser Blog
Custom playback changes
Effective today, custom playback will now be used only when necessary (e.g., on devices such as iPhones or pre-4.0 Android phones) rather than whenever a custom playback video element is passed in.
We recommend all implementations now pass in the custom playback element so that ads will be rendered via a more seamless playback experience across different environments. For more info on the change and code snippets to help you upgrade, see upgrading to the new custom playback.
Custom click tracking element changes
Custom click tracking elements will now only be used in certain video environments. To determine whether or not a custom click tracking element is being used, check ima.AdsManager.isCustomClickTrackingUsed in an AdEvent such as ima.AdEvent.STARTED. Additionally, please do not render your custom click tracking element over your video player as it will break the ad experience by preventing clickthroughs on the ad and skip button. For more information on the custom click tracking element changes, see "a note about custom click tracking elements" on our custom playback guide.
As always, if you have any questions about these changes or other IMA SDK questions, feel free to contact us via the support forum.