ネイティブ動画広告の動作と機能のサポート

Google アド マネージャーは、ネイティブ ディスプレイ広告のほか、動画アプリ インストール広告、動画コンテンツ広告、カスタム フォーマットなどのネイティブ動画広告にも対応しており、さまざまなプラットフォームでネイティブ動画を使って効果的に情報を発信することができます。ネイティブ広告スロットには、動画とディスプレイのどちらのフォーマットも配信できます。

ネイティブ動画広告の動作

アド マネージャーのネイティブ動画広告では、PC ウェブ、モバイルウェブ、モバイルアプリのリクエストで、Fluid サイズを含むすべてのネイティブ スタイル設定オプションを使用できます。ネイティブ動画広告は次のように動作します。

動画の再生

  • 動画は、ブラウザによる制約がない場合は自動再生される。自動再生がブラウザで許可されていない場合は、ポスター画像が表示され、ユーザーが画像をクリックすると動画が再生されます。

    ブラウザによっては、再生中の動画がユーザーの視界から外れたとき(別のタブに切り替わったときなど)の動作も異なります。その結果、アクティブ ビューや動画視聴完了に関するデータに多少の差異が生じる可能性があります。

  • 動画の 50% を超える部分が画面から外れると再生が自動的に一時停止し、50% が画面に入ると再生が再開する。ただし、動画の再生中に新しいタブを開くと、動画の再生が明確に一時停止されない場合があります。この動作はブラウザによって異なります。
  • プログラマティック ネイティブ動画広告は Wi-Fi 接続のユーザーにのみ配信可能で、プログラマティック以外はすべてのトラフィックで再生される。

音声

  • 自動再生は音声オフで開始される
  • 音声をオンにするにはユーザーのクリックが必要
 

機能のサポートと制限

ネイティブ動画広告は、アプリとウェブのプレースメント、すべての予約広告、直接取引、間接的なプログラマティック デマンドに対応しています。ネイティブ動画広告の要件は次のとおりです。

レンダリング ネイティブ スタイルまたはモバイルアプリ用カスタム レンダリング
動画のホスティング

アド マネージャーでホスト、または第三者の VAST

アド マネージャーでホストする場合は、動画アセットをアップロードするか、クリエイティブとして使用するアセットのソース URL を指定するかを選択できます。アセットは、サポートされている形式である必要があります。アド マネージャーではアセットをメザニン ファイルとして自動的に指定し、利用可能なすべてのフォーマットとサイズにコード変換します。

ホストされる動画の最大サイズ 512 MB*
インプレッション トラッキング ネイティブ動画広告のインプレッションは、動画広告の業界標準に合わせて、プレーヤーで広告の再生が開始された後にカウントされます。カスタム ネイティブ テンプレートのモバイルアプリ用カスタム レンダリングの場合は、アプリで recordImpression メソッドを呼び出す必要があります。
使用プレーヤー
  • Android: ExoPlayer
  • iOS: Google 動画プレーヤー
  • ウェブ: HTML5 プレーヤー(WebView でラップ)
必要な SDK
(モバイルアプリ用)
ネイティブ スタイル
  • Android Google Mobile Ads SDK 9.0 以上
  • iOS 7.16.0 以上

カスタム レンダリング
  • Android Google Mobile Ads SDK 10.2 以上
  • iOS 7.16.0 以上

*アド マネージャー 360 をご利用でないネットワークでは、ホストされる動画の最大サイズは 30 MB となります。

制限事項

  • VPAID 動画は、ネイティブ動画では使用できません
  • 現在のところ、クリエイティブのプレビューはネイティブ動画には対応していません
  • カスタム ネイティブ動画広告は、プログラマティック保証型取引のパブリッシャー管理のクリエイティブでサポートされています。優先取引の広告主提供のクリエイティブではサポートされていません。プログラマティック直接取引でサポートされているクリエイティブ タイプをご覧ください。
  • 現時点でサポートされているのはバナーとフィード内プレースメントのみで、インタースティシャルはサポートされていません

Google に提供し、使用されるすべてのコンテンツは、利用規約に沿ったものである必要があります。

SDK 経由でネイティブ動画をリクエストする

アプリ向けネイティブ動画広告は、標準のディスプレイ バナー広告のコードを使用して呼び出すことができます。

メインの画像アセットをネイティブ広告のレイアウトに含める場合は、ImageView アセットの代わりに MediaView アセットを使用する必要があります。実装とカスタマイズについては、デベロッパー ガイドをご覧ください。

HTML と CSS の要件

ネイティブ動画広告のスタイルを設定する際、動画プレーヤーはアスペクト比を保つために 1 つの HTML 要素内に配置する必要があります(div#%NATIVE_VIDEO_WRAPPER%# マクロを使ってプレーヤーをトリガーする)。また、動画プレーヤーは配置した要素の中で最大限のスペースを使って表示されなければなりません。したがって、ネイティブ動画フォーマットのスタイルを設定するにあたっては、以下の 3 点に留意してください。

1. ネイティブ動画ラッパーを含む div 要素のサイズを明示的に指定する

#%NATIVE_VIDEO_WRAPPER%# マクロを含む div 要素のサイズを、CSS 内に割合(%)またはピクセルで明確に指定します。

.host-div {
   width: 300px;
   height: 200px;
}

2. 動画とコンテナ div のアスペクト比に注意し、余白ができないようにする

コンテナ div と動画プレーヤーのアスペクト比が異なると、動画の周囲に余白が生まれます。余白部分の色は、モバイルアプリの場合は透明、モバイルウェブと PC ウェブの場合は黒になります。ここに示す例では、高さに対する幅の比率が、動画よりコンテナ div で大きくなっています。

余白をなくすには、コンテナ div のアスペクト比を動画と同じにする必要があります。事前に動画のアスペクト比がわかっている場合は、次の HTML と CSS を使って、動画がぴったり収まる div をレンダリングできます。

動画のレターボックスの例

: 動画より div の方が幅の比率が大きい

HTML
<div class="video-ratio-wrapper">
  <div class="video">
    #%NATIVE_VIDEO_WRAPPER%#
  </div>
</div>
CSS
.video-ratio-wrapper {
  position: relative;
  width: 100%;
}

.video-ratio-wrapper:after {
  padding-top: 56.25%;
  /* 16:9 ratio */
  display: block;
  content: '';
}

.video {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}

3. HTML 要素が動画プレーヤーにどのように重なるかを知っておく

モバイルアプリに実装された動画プレーヤーは、常に他の HTML 要素よりも下に(奥に)表示されます。この表示方法は仕様であり、見出しなどの要素が動画に重ねて表示されることを意図したものです。

コンテナ div に Z-Index を設定してもこの動作に影響はありませんが、コンテナ div に背景色を設定すると、div 要素が動画プレーヤー全体を覆うことになります。

そのため、動画をラッピングする div 要素は透明にする必要があります。コンテナ div に透明以外の背景色が設定されていると、動画が覆われてしまいます。

SDK を使うと、コンテナ div を透明色で維持しつつ、動画の周囲に余白が表示される場合の色を設定できます。これを行うには、CSS の body 要素に background-color を設定します。SDK では、この値が動画の周囲の余白の色として使用されます。

body {
  background-color: aliceblue;
}

この情報は役に立ちましたか?

改善できる点がありましたらお聞かせください。
検索
検索をクリア
検索を終了
メインメニュー
12384494195668290529
true
ヘルプセンターを検索
true
true
true
true
true
148
false
false