Rich media developer's guide

Developer best practices

Before you build rich media creatives, we strongly recommend that you refer to the specifications for the apps or sites your ads will run on. If you need to build creatives before a final media plan or site specs are available, you can follow these best practices. These recommendations are based on what's common across sites. 

Quick tips

Guidelines for every rich media creative

Follow these guidelines for every rich media ad you make.

Keep first ad load below 200 KB

When the ad first loads, try to keep the total file size below 200 KB. If the total compressed file size of an ad's assets is over 200 KB, set up polite loading. Creatives with polite loading wait for the publisher's page to load first before loading larger files.

Keep total ad size below 500 KB

  • After the first polite load, you can load up to 300 KB more, for a total of 500 KB.
  • To reduce HTML5 file size, delete unused elements, images, and videos from your creative.
Creatives with a file size larger than 4 MB, CPU usage of more than 15 seconds per 30-second period, or 60 seconds of total CPU usage might be unloaded by Chrome at serving time.

Include only the elements you need

To reduce file size and avoid unnecessary ad serving fees, include only the elements you need. For example, don't include video elements in creatives that don't have any videos.

Limit animations or video to 30 seconds

Publishers usually don't budge on this point. No one wants to visit a site where ads are blinking and moving everywhere. It's distracting and annoying. Don't let animations or videos loop endlessly. Stop animations after 30 seconds of play or add a "Click to continue" button to let the viewer choose to resume.

When someone clicks an exit link or call to action in your ad:

  • Stop all videos.
  • Stop all sounds.
  • Go to the ad's end frame.
  • Collapse the ad if it's expanded.

Guidelines for specific formats

Follow these guidelines if your ad has video, expands, or is an interstitial ad.

Video guidelines

Follow these guidelines if your ad has any videos.

Limit autoplay video to 30 seconds

If a video is longer than 30 seconds, stop the video at 30 seconds. Add a "Click to continue" button so the viewer can play the full video.

Limit 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 the ad has 10 seconds of animation followed by a video that plays automatically, the video must stop after 20 seconds.

Give the viewer control of audio and video

After up to 30 seconds of 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.

Video sound should be muted until the viewer turns it on

  • 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.
  • (Expandable creatives only) If a creative requires a click or tap to expand, video in the expanded state can autoplay with sound.

Expandable guidelines

Follow these guidelines if your ad expands.

Common expansion sizes and directions

  • 300 × 250 ads expand left or right. Common expanded size: 500 × 250.
  • 160 × 600 creatives expand left or right. Common expanded size: 300 × 600.
  • 120 × 600 creatives expand left or right. Common expanded size: 300 × 600.
  • 728 × 90 ads expand up or down. Common expanded size: 728 × 180.

Add a close button

Viewers should be able to collapse an expanded ad. Typically this is a "Close  X" button at the top right.

Don't overlap close button and expand buttons

If the close button overlaps the expand button, the ad might re-expand after someone clicks the close button.

Limit the size of the click-to-expand area

The clickable area that triggers expansion should no more than 25-33% of the collapsed area of the creative.

Match the expand and collapse actions

  • When an ad requires a click to expand, it should require a click to collapse.
  • When an ad requires a rollover to expand, it should require a roll off to collapse.

Collapse automatically expanding creatives after 15 seconds

  • If a person interacts with the ad, the ad can stay open, otherwise it should collapse. For example, when an ad expands automatically, and the viewer clicks a "Play game" button, the ad can remain expanded.
  • Automatically expanding creatives shouldn't start the rich media expansion timer because it wasn't expanded by a person.
  • Use the startExpanded() call to pre-expand your creative. Read the expandable build guide for more information.

Clean up expandable elements

To avoid problems interacting with the publisher's page, make sure to remove the <div> element used for the expanded creative when it collapses.

Interstitial guidelines

Follow these guidelines if your ad is an interstitial ad.

Add a close button

Viewers should be able to close an interstitial ad. Typically this is a "Close  X" button at the top right.

Close interstitials after 15 seconds

If a person interacts with the ad, the ad can stay open, otherwise it should close. For example, when the viewer clicks a "Play game" button in the ad, the ad can remain expanded.

Don't polite load interstitials

Interstitials should appear right away. Otherwise the viewer might go elsewhere before the ad appears, providing a poor site experience, which publishers want to avoid.

Was this helpful?

How can we improve it?

Need more help?

Try these next steps:

Search
Clear search
Close search
Google apps
Main menu
2011546360729673613
true
Search Help Center
true
true
true
true
true
74220