Rich media developer's guide
Developer best practices
DoubleClick strongly recommends that you gather site-specific specifications before you build any rich media creatives. However, sometimes you need to build creatives or mockups before a final media plan or site specs are available. You can avoid potential live issues with creatives by meeting best practice and lowest common denominator (LCD) requirements.
Best practices and LCDs are generated based on what's acceptable on most sites. There's always a possibility that the website where an ad is running has specs that are different from the ones in this article.
Use the Basic QA checklist as a simple way to check if your creative meets these guidelines.
- 200 KB size limit for initial load
If the total, gzipped file size of all ad assets is over 200 KB:
- 15-second autoplay animation time limit
Publishers usually don't budge on this point. No one wants to visit a site where ads are blinking and moving all over the place. It's distracting and annoying. Don't let your animation loop.
- 30-second total autoplay video and animation time limit
Stop animations after 30 seconds of play or add a "Click to continue" button to let the viewer choose to resume.
- On exit, all creatives should:
- Stop all videos (if creative includes videos).
- Stop all sounds (if creative includes sound).
- Resolve the ad to end-frame graphics.
- Collapse the creative if expanded (expanding creatives only).
- Limit autoplay video to 30 seconds
If a video exceeds 30 seconds, add a "Click to continue" (or "Tap to continue") button at 30 seconds that plays the video when clicked.
- Limit all motion to 30 seconds total
If your ad includes both animation and video, the total duration of all motion should be no more than 30 seconds. For example, if you have a 10 second animation followed by an auto-play video, the video must stop after 20 seconds.
- Give the viewer control of audio and video
After the maximum 30 second autoplay, all video and audio should be started by the viewer using video controls (play/pause, stop, mute/unmute, and replay).
- Always add video controls such as play, pause, mute, and replay.
- When the video completes, show the replay button, but hide the rest of the video controls.
- (Optional) When someone clicks replay, turn on the sound
If a person clicks replay after the video completes, turn on the sound.
- Sound on video should be turned on by the viewer
- Most sites forbid autoplay video with sound.
- Autoplay video creatives should include a "Replay with sound" or "Unmute" option.
- Videos that require a person to click to play can play with sound.
- (Expanding creatives only) If a creative requires a click or tap to expand, video in the expanded state can autoplay with sound.
- Expansion size and direction
- 300 x 250 creatives should have maximum expansion of 500 x 250 left and right.
- 728 x 90 creatives should have maximum expansion of 728 x 180 up and down.
- 160 x 600 creatives should have maximum expansion of 300 x 600 left and right.
- 120 x 600 creatives should have maximum expansion of 300 x 600 left and right.
- Close button required on the expanding panel
All expanding creatives should include a way to collapse the creative.
- Hit area/hot spot size for expansion should no more than 25-33% of the collapsed area of the creative.
- Close button should not overlap the expansion hit area.
This best practice prevents the creative from immediately re-expanding after a user clicks the close button.
- Expand/collapse methods should match
If an ad is click-to-expand, then it should be click-to-collapse. If an ad is rollover-to-expand, then it should be roll-off to collapse.
- Automatically expanding creatives must automatically collapse after 15 seconds
- If a person interacts with the ad, the ad may remain open. For example, when an ad expands automatically, and the viewer clicks a "Play game" button, the ad can remain expanded.
- If automatically expanding creatives don't trigger the rich media expansion timer:
- Remember: The rich media expansion timer can only be called on an expansion triggered by a user interaction.
- Use the
startExpanded()call to pre-expand your creative. See the Expanding build guide for more information.
- The div layer of a webpage must collapse on your creative's collapse
- Interstitial creatives must have a close button
- Interstitial creatives must collapse after 15 seconds
- After 15 seconds the creative should automatically close.
- Use the
close()method to close the creative.
- Interstitial creatives should never polite load
Interstitials should appear right away. Otherwise a user might go elsewhere before the ad appears, providing a poor site experience, which publishers try to avoid.