PRODUCT
Follow

The Immersive Takeover format consists of a full-width expandable header, with left and right gutters that appear around the page content, as well as a full page wallpaper skin that appears behind the page content. The header, gutters, and background skin are responsive to different screen sizes. The header height can be configured to resize to different viewport breakpoints.

Responsive gutters are shown if there is enough space to display them to the left and right of the page content. They will not be visible when the ad is viewed on mobile or tablet devices.

The Immersive Takeover can be set as a simple image with a video in the header, or as a full video.

Note

Note: If your skin ad does not need to be responsive, build a Standard Banner (if below 200kb with a single click as the interaction) or a Rich Media Banner. For more information, see About Standard Banner and About Rich Media Banner.

Demo

Click here to preview a demo of the Immersive Takeover format.

Variations

The Immersive Takeover can be set as ImageSkin (a simple image), Video (includes a video in the header), or as a VideoSkin (the skin is a full video).

All of these variations include the following capabilities:

  • Basic Cross Domain Configuration using one ad (creative-level)

  • Affect the site with style (requires publisher approval)

  • Affect the site with script (requires publisher approval)

  • Inter-panel synchronization

  • Responsive

  • Mobile Experience (gutters are hidden, different header expansion)

  • Scroll Detection

  • Domain Configuration via Domain Config Tool (f/k/a Programmatic)

  • Local Preview

  • Uses AdKit (able to include DCO and Additional Assets)

  • Polite Loading

None of these variations include the following capabilities:

  • Safeframe Support

  • MRAID (In-app Support)

ImageSkin Template

The ImageSkin is an Immersive Takeover template with predefined options to inject an image to the background of the publishers page without the use of a panel in the background. There are three panels in the Workspace, used solely for mouse events (mouse position and click-throughs):

  • LeftGutter (transparent)

  • RightGutter (transparent)

  • Header (transparent but with Sizmek Ad Suite logo and click-through button)

The template has no background panel.

Most of the logic is located in the header panel, where you can find different methods used to inject images or breakpoints / CSS to the publishers page.

You can inject an image in to the content of the publisher's page using a <div> element as a wrapper, or directly inject CSS to affect the background element of the publisher's page. The CSS injection process means creating several mediaQueries, which are injected automatically to the site when the ad is loaded, to achieve certain responsive behavior.

ImageSkin with a custom background image:

immersive_takeover1.png

ImageSkin with a pattern using the repeat option:

immersive_takeover2.png

Video Template

The Video template is the basic template for the Immersive Takeover with a video in the header panel. There are four panels in the workspace:

  • LeftGutter

  • RightGutter

  • Background

  • Header

In the following example, the gutters have a logo and a click button. The background panel has an image that will appear as wallpaper skin spanning the background of the page. When the header is collapsed, you will see an image with a play button, the logo, and a clickthrough button. Expanding the header will show the video, which will be responsive to the size of the panel and hold the aspect ratio of the video.

Video Template when collapsed:

immersive_takeover3.png

Video Template when expanded:

immersive_takeover4.png

VideoSkin Template

The VideoSkin template is the advanced template for the Immersive Takeover with a video in the background panel, which will be loaded behind of the content of the page. There are five panels in the workspace:

  • LeftGutter (transparent)

  • RightGutter (transparent)

  • Background

  • Header (transparent but with the logo and click-through button)

  • Controls

The gutters are transparent and will be used to do click-through. The background panel shows the video in the size of the full browser. The video will be auto-played depending if the device is compatible with the autoplay feature. If not, the user must click the video to play. This template has a special panel. Controls, which you can use to play/pause the video, turn on/off the sound, or expand/collapse the banner.

Immersive Takeover - VideoSkin Collapsed:

immersive_takeover5.png

Immersive Takeover - VideoSkin Expanded with Full-screen option enabled:

immersive_takeover6.png

Immersive Takeover - VideoSkin when clicked

immersive_takeover7.png

Building a Immersive Takeover Ad

The Immersive Takeover is an advanced format which can be built as a Workspace ad in SAS. A code editor of your choice is recommended as the best option.

Create

Create the ad using a code editor. For more information, see Create an Immersive Takeover in a Code Editor.

Set Up

Share

Share your ad with your media agency.

Immersive Takeover Ad Details

Specifications

Dimensions

Any

The ad will automatically resize to fill the available container, or it can be set to any fixed size.

Maximum duration

None

The publisher or the media technology (for example, DSP) determine the max duration.

IAB recommendation: 30 seconds

Maximum size

10 MB

As per IAB recommendation.

Tag type

In-Banner

For more information about tag types, see Sizmek Ad Suite Ad Formats.

Compatibility

Device

Any

Examples include Web, Mobile Web. Supported in Mobile browsers only and not In-app.

Publisher Certification

Web

Mandatory

For more information, see About Publisher Certifications.

In-app

N/A

Programmatic

Recommended

Measurements

Available Metrics

Examples include:

  • Click-through

  • Impressions

  • Viewability

  • UserAction

  • Video Quartiles

  • Video Control

For more information about metrics, see Aggregated Reports: Dimensions and Metrics Glossary.

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments