今日のデジタル世界において、オンライン広告は誰もが無料で利用しているウェブの重要な部分です。広告が適切に実装されていないと、ブラウジング エクスペリエンスが遅くなり、ユーザーの不満やエンゲージメントの低下につながります。ページの読み込み速度に影響を与えることなく広告を効果的に読み込み、シームレスなユーザー エクスペリエンスを確保して、ウェブサイトの所有者の収益機会を最大化する方法をご紹介します。
ウェブサイトの主な収益源としてオンライン広告に大きく依存している。ただし、ウェブサイトに広告を表示すると、ユーザー エクスペリエンスやページの全体的なパフォーマンスが低下することがあります。そのため、ウェブサイトの所有者や広告主様の収益性とパフォーマンスと、ユーザー エクスペリエンスのバランスを取ることが不可欠です。
高い収益を狙って、コンテンツ内に広範囲に広告を配置するウェブサイトを考えてみましょう。広告の数が非常に多いことがユーザーの不満を招き、ユーザー エクスペリエンスの低下や直帰率の上昇につながっています。広告から多額の収益を得られる可能性にもかかわらず、放棄はウェブサイトの成功を著しく妨げます。
反対に、広告のないウェブサイトを考えてみましょう。広告のないこの環境は、読み込み時間が速く、ブラウジング エクスペリエンスがシームレスになるため、多くのユーザーを魅了しています。しかし、収益化戦略を導入しなければ、ウェブサイトは収益を生み出すのに苦労しており、長期的なサステナビリティと成長が妨げられる可能性があります。
どちらのシナリオも、収益化、ユーザー、パフォーマンスのバランスをとる重要性を示しています。
Core Web Vitals の活用
ページ速度に悪影響を与えずに広告を読み込むには、Core Web Vitals を渡すことが不可欠です。Core Web Vitals は、Largest Contentful Paint（LCP）、Cumulative Layout Shift（CLS）、Interaction to Next Paint（INP）などの指標で構成され、ウェブサイトのユーザー エクスペリエンスの品質を測定するユーザー エクスペリエンス指標です。
Largest Contentful Paint（LCP）
LCP の最適化に重点を置くことが非常に重要です。この指標は、コンテンツの多い最大要素がビューポートに表示されるまでの時間を測定するためです。ウェブサイトの所有者は、広告コンテンツの読み込み時間を最小限に抑え、非同期読み込み技術を優先することで、LCP を短縮し、ページで最も目立つコンテンツのレンダリング時間を短縮できます。
Interaction to Next Paint（INP）
2 つ目に、レスポンシブ ユーザー エクスペリエンスのためには、INP の改善が不可欠です。INP は、ページのライフサイクルを通じて発生する各クリック、タップ、キーボード操作のレイテンシを測定します。結果として得られる値は、多くの場合、完了までに最も時間がかかったインタラクションであり、ユーザー インタラクションにページ全体が迅速に応答する能力を表します。
ユーザーの操作が遅れる広告は、INP に悪影響を及ぼします。そのため、動作が遅い、あるいは極端なケースでは完全に機能しなくなると感じられることで、ユーザーをイライラさせる可能性があります。広告の遅延読み込みを実装し、重要でない JavaScript の実行を遅らせると、ページの INP が下がり、ページ全体の応答性が向上します。
Cumulative Layout Shift（CLS）
最後に、CLS では、ページの読み込み中に発生した予期しないレイアウト シフトの量を測定して、ページの視覚的な安定性を測定します。広告が動的に読み込まれたりサイズ変更されたりすると、レイアウトが不安定になり、ユーザー エクスペリエンスが低下し、レイアウトが突然変わってしまい、ユーザーがページ内のどこにいるかわからなくなったり、意図せず間違った要素をタップしたりすることにつながります。これを軽減するには、CLS を最適化して広告のスペースを確保してレイアウト シフトを防ぐとともに、広告サイズを最適化してコンテンツの急激なリフローを回避する必要があります。
ウェブページを個別のコンテンツ ブロックに構造化する
CSS の content-visibility: プロパティを使用し、テキスト、画像、広告コンテンツの両方のコンテンツ ブロックでウェブページを構成すると、最新のブラウザでの全体的なレンダリング時間を大幅に短縮できます。
これらのコンテンツ ブロック内に content-visibility: プロパティを戦略的に適用することで、テキスト、画像、広告コンテンツのレンダリング プロセスを最適化できます。これにより、ビューポートのコンテンツのみが完全にレンダリングされるため、最初のページ読み込みが高速化され、ユーザー操作がより滑らかになります。このパフォーマンス向上は、長いページや多数の広告を含むページを処理する場合に特に役立ちます。
重要な広告スロットを優先する
すべての広告スロットが同じわけではありません。たとえば、一般的に、スクロールせずに見える範囲の広告スロットは、スクロールしなければ見えない範囲にある広告スロットよりも視認性と収益性の点で価値が高くなります。スクロールせずに見える範囲の広告は、最初のビューポートでもスクロールしなくても表示されるため、ユーザーの目に留まりやすくなります。スクロールしなければ見えない範囲の広告は、ユーザーがページを下にスクロールするのに十分な数までスクロールすると表示されます。
スクロールせずに見える範囲の広告
スクロールせずに見える範囲の広告スロットとは、ウェブページの中でスクロールなしで見える部分を指し、デジタル広告で大きな価値を持つものです。このような最適なプレースメントは、次のような理由で有用と見なされます。
- スクロールせずに見える範囲に配置された広告は、ウェブページを読み込むとすぐにユーザーに表示されます。ユーザーがこれらの広告に目を留めて反応する可能性が高まるため、クリック率の向上につながります。
- 広告主は多くの場合、ウェブページの最上部を最も価値のあるスペースと見なしています。サイトにアクセスしたときにユーザーに与えられる第一印象は、影響力の強いプレミアムな広告を表示する重要な領域です。
- スクロールせずに見える範囲の広告は、ユーザーの目線に立っているため、視認可能率が最も高くなります。これにより、ページにアクセスするユーザーの大多数に、スクロールしなくてもこれらの広告が表示されます。
ただし、スクロールせずに見える範囲の広告スロットを初期ビューで利用する場合は、収益化とユーザー エクスペリエンスのバランスを取ることが重要です。重要な考慮事項をいくつか紹介します。
- 最初の画面の広告スロットは、ユーザーの最初のビューポートにできるだけ速く読み込む必要があります。広告の読み込みが遅いと、ユーザー エクスペリエンスに悪影響が及び、直帰率が上昇する可能性があります。スムーズなユーザー エクスペリエンスとブラウジング エクスペリエンスを維持するには、広告の読み込み時間を最適化することが不可欠です。
- スクロールせずに見える範囲への広告プレースメントは効果的ですが、この主要なスペースに多くの広告を集中させないようにすることが重要です。過度に広告が表示されると、ページが雑然とし、コンテンツの読みやすさが損なわれ、ユーザー エクスペリエンスが損なわれます。収益化と、シンプルでユーザー フレンドリーなレイアウトのバランスを取るよう努めてください。
- スクロールせずに見える範囲の広告スロットが、さまざまな画面サイズやデバイスに対応していることを確認します。レスポンシブ デザインの手法を活用すると、ユーザーの画面サイズに関係なく、一貫性があり、視覚的に魅力のあるレイアウトを維持できます。
スクロールしなければ見えない範囲の広告
スクロールしなければ見えない位置にある広告スロット、つまり、下にスクロールしないと見えない範囲にあるウェブページに配置された広告も、デジタル広告の世界において大きな価値を秘めています。これらのプレースメントには、スクロールせずに見える範囲に配置する独自のメリットがあります。
スクロールしなければ見えない範囲の広告には、スクロールしてコンテンツをさらに探索するユーザーがいるというメリットがあります。こうしたプレースメントは、より複雑なメッセージやストーリーテリングを伝えたいと考えているブランドにとって、追加情報を積極的に求めている熱心なユーザーの注意を引き付けることができます。
- 最初は表示されない広告スロットを、その横のコンテンツに合わせて配置することで、コンテンツとの関連性を向上できます。このように配置することで、ユーザーが探しているコンテンツに関連する広告を発見できるため、ユーザー エンゲージメントの向上につながります。
- 慎重にデザインすれば、スクロールしなければ見えない範囲の広告は周囲のコンテンツとシームレスに溶け込むため、ユーザーの邪魔にならないように感じられます。この統合（ネイティブ広告とも呼ばれます）により、より調和したユーザー エクスペリエンスを実現できます。
- スクロールが必要な広告プレースメントでは、クリエイティブなデザインとフォーマットの柔軟性が増し、十分なスペースと自由にテストできます。動画広告、インタラクティブな要素、大きな画像は遅延読み込みが可能で、ユーザーの操作を中断することなくユーザーの関心を引き付けることができます。
ただし、スクロールしなければ見えない位置の広告の配置に関しては、次の点を考慮する必要があります。
- スクロールしなければ見えない位置の広告プレースメントは効果的ですが、スクロールしなければ見えない範囲の広告もユーザーに見てもらいましょう。視覚的な手がかりやコンテンツ ティーザーを実装すると、ユーザーがさらに探索する意欲が高まり、広告が表示される可能性が高まります。
- スクロールしなければ見えない位置の広告の配置によって、コンテンツの品質や読みやすさが損なわれないようにしてください。広告とコンテンツのバランスを維持して、ユーザーに負担をかけずに快適にユーザー エクスペリエンスを提供できるようにする。
- スクロールせずに見える範囲の広告プレースメントとは異なり、スクロールしなければ見えない範囲の広告の場合、すぐに読み込む必要はない場合があります。こうした広告の読み込みをユーザーのビューポートに近づくまで遅らせると、ページの全体的な読み込み速度が向上し、最初のページ レンダリング時間を短縮できます。
スクロールしなければ見えない範囲の広告を戦略的に使用すると、スクロールせずに見える範囲の広告を補完し、クリエイティブな広告フォーマットとコンテンツの関連性を高めるプラットフォームとして機能します。良好なユーザー エクスペリエンスを提供するには、視認性の最適化、コンテンツのバランス調整、広告の読み込みタイミングの管理が重要な考慮事項となります。
現在の Google パブリッシャー タグ（GPT）のベスト プラクティス:
必要に応じて広告を遅延読み込みする
遅延読み込みは、重要でないリソースが必要になるまで読み込みを遅らせる手法です。すぐに表示されない広告（スクロールしなければ見えない範囲の広告）に遅延読み込みを適用すると、広告は表示されたときにのみ読み込まれるため、帯域幅を節約して全体的なページの読み込み速度を向上させることができます。ブラウザに、loading=lazy 属性を使用した iframe のネイティブ遅延読み込みが追加されました。
遅延読み込みを実装すると、広告がユーザーのビューポートに入ろうとしたときに広告が動的に取得されます。これにより、ページのライフサイクルの重要な部分でメインスレッドにおける初期読み込み時間と Total Blocking Time（TBT）（INP と密接に関連）が短縮されるため、ユーザー エクスペリエンスへの悪影響を最小限に抑えることができます。
ページを更新せずに広告を更新する
ページのパフォーマンスと広告の読み込みのバランスを取るためのもう一つの手法として、ページ全体を再読み込みせずに 30 ～ 240 秒ごとに広告を更新1できます。このアプローチでは、ユーザーのブラウジング エクスペリエンスを低下させたり、不必要な遅延を発生させることなく、広告コンテンツを動的に更新できます。
モバイルアプリでは、既存のウェブビューで広告を更新する方が、データおよびリソースのオーバーヘッドが最小限に抑えられるため、ページ全体の再読み込みや WebView の再作成よりもパフォーマンスが向上します。また、ゼロから始める際の遅延を発生させることなく、コンテンツの更新を高速化し、ユーザー エクスペリエンスをよりスムーズにできます。
広告を非同期で更新することにより、ウェブサイトの所有者は、ページ コンテンツをそのまま維持しながら、広告コンテンツをリアルタイムでシームレスに更新できます。これにより、ページ全体を再読み込みする必要がなくなるため、ページの読み込み速度が向上するだけでなく、表示される広告の関連性と訴求力も向上します。この手法により、ウェブサイトの所有者はユーザー エクスペリエンスへの悪影響を最小限に抑えながら、収益化とパフォーマンスのバランスを取り、魅力的な広告コンテンツをタイムリーに配信できます。
広告スロットの更新は、レシピページ、DIY チュートリアル、その他のコンテンツの多いウェブサイトなど、ユーザーが長く滞在する傾向があるページで特に効果的です。たとえば、ユーザーがチュートリアルに沿ってかなりの時間を費やす可能性がある DIY のクラフト ページでは、ステップの合間や画像ギャラリーの表示中に広告スロットを戦略的に更新すると、ユーザー エクスペリエンスと広告収入の両方を向上できます。同様にレシピページでは、ユーザーが材料リストや手順をスクロールした後に広告スロットを更新することで、ユーザーの関心を維持できます。
非同期読み込みを優先する
広告配信中にページの読み込み速度を改善する最も効果的な方法の 1 つは、非同期読み込みです。非同期読み込みでは、メインのウェブページのコンテンツとは独立して広告が読み込まれます。ページの表示が継続され、広告が完全に読み込まれるのを待たずにインタラクティブになります。 これにより、ユーザーが認識した読み込み時間が大幅に短縮され、ユーザーの満足度が高まります。
スクリプトタグの定義に async 属性を含めます。例:
AdSense:
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
AdSense（自動広告）:
<script async data-ad-client="ca-pub-xxxxxxxxxxxxxxxx" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
Google パブリッシャー タグ:
<script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>
広告のサイズ、位置、フォーマットを最適化する
広告のサイズ、位置、フォーマットは、ページの読み込み速度に大きく影響します。広告サイズが大きいとページの読み込みが遅くなり、ユーザーは不満を抱きます。これを軽減するため、ウェブサイトの所有者は広告主と緊密に連携して広告のサイズとフォーマットを最適化する必要があります。圧縮画像形式の使用を奨励し、広告クリエイティブの効率的なデザインを奨励することで、画質を損なうことなくファイルサイズを削減できます。これらの最適化により、ページの読み込み速度が向上するだけでなく、帯域幅が限られているユーザーのデータ消費量を最小限に抑えることもできます。
Better Ads Standards
広告を表示する際は、Better Ads Standards を遵守する必要があります。これにより、煩わしい広告フォーマットが減少してユーザー エクスペリエンスが向上するだけでなく、広告の配信位置とページの読み込み時間にもプラスの影響を与えるためです。
これらの基準に準拠することで、邪魔にならず目立たない位置に広告が表示される可能性が高くなり、ユーザー エンゲージメントとクリック率の向上につながります。
さらに、これらのガイドラインに準拠することで、軽量でリソース消費量の少ない広告フォーマットが好まれるため、ページの読み込み速度が向上し、ウェブサイトの全体的なパフォーマンスとユーザー満足度の向上につながります。
広告ネットワークとプロバイダの戦略的評価
広告ネットワークやプロバイダによって、パフォーマンスが同等であるわけではありません。最適なページ速度を確保するために、ウェブサイトの所有者はさまざまな広告ネットワーク、ヘッダー入札の実装、プロバイダのパフォーマンスを入念に評価する必要があります。
スピードを最優先し、軽量な広告コンテンツを効率的に配信してきた実績を持つプロバイダとパートナーシップを組むことで、ページ パフォーマンスの大幅な向上とユーザー エクスペリエンスの向上を実現できます。
まとめ
オンライン広告を通じて収益を最大化しながら優れたユーザー エクスペリエンスを提供したいと考えているウェブサイトの所有者にとって、収益化とパフォーマンスのバランスを取ることは非常に重要です。
非同期読み込み、遅延読み込み、広告フォーマットとサイズの最適化、インテリジェント キャッシュの活用、広告ネットワークの慎重な評価、ヘッダー入札、プロバイダなどの手法を使用することで、ページのパフォーマンスを損なうことなく、広告を読み込む際の問題に適切に対処できます。広告の効率的な配信を優先することで、最終的にはユーザーの層化、エンゲージメントの向上、持続可能な収益創出を実現できます。
脚注
- 広告サーバーには制限や要件が適用される場合があります。たとえば、アド マネージャーでは、管理画面で更新される広告枠を宣言する必要があります。購入者によっては、240 秒以上の更新の宣言を求める場合があります。一般に、更新の間隔が長いほど、購入者にとって広告枠は有利になります。詳細