AMP

使用廣告在您的 AMP 頁面中營利

重要事項:本文件不適用於您目前選取的格式「stories」!

本指南提供在您的 AMP 頁面中顯示廣告的操作說明和最佳做法。

在您的頁面中加入廣告

在非 AMP 頁面 (傳統 HTML) 中,如果您想在頁面中顯示廣告,您會加入一段 JavaScript 程式碼片段,以便從您的廣告聯播網投放廣告。基於效能和安全性的考量,您無法在 AMP 頁面中加入第三方 JavaScript。因此,若要在 AMP 中顯示廣告,您必須將自訂的 amp-ad 元件加入您的 AMP 頁面。

提示 – 請參閱 AMP By Example 以觀看即時示範,瞭解如何將 amp-ad 標籤加入 AMP 頁面。

讓我們逐步瞭解加入元件的步驟,以便您在 AMP 頁面中顯示廣告。

步驟 1:加入 amp-ad 指令碼

amp-ad 元件是 AMP 函式庫的自訂廣告擴充功能。amp-ad 的底層是經過精心設計的自訂 JavaScript,可最佳化效能。若要執行 amp-ad 元件,您必須將此元件所需的 JavaScript 加入 AMP 頁面的 head 區段。

<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>

步驟 2:將 amp-ad 標籤加入您的 AMP 頁面

超過 100 個以上的廣告伺服器和聯播網提供與 AMP 的內建整合。若要為指定的廣告聯播網加入廣告,請加入 amp-ad 標籤,並在 type 屬性中指定聯播網。

在這個範例中,我們要加入一個廣告版位,以便從 a9 聯播網投放廣告

<amp-ad type="a9">
</amp-ad>

步驟 3:指定廣告單元的大小

將 width 和 height 屬性加入 amp-ad 標籤。這會指定廣告在您的 AMP 頁面上的大小

<amp-ad type="a9">
   width="300" height="250"
</amp-ad>

步驟 4:設定廣告聯播網參數

每個聯播網都有投放廣告所需的特定資料屬性。請參閱廣告聯播網的 amp-ad 文件,並加入所需的屬性。在以下範例中,a9 聯播網需要額外的參數來指定廣告大小和其他詳細資訊

<amp-ad type="a9"
    width="300" height="250"
    data-aax_size="300x250"
    data-aax_pubname="test123"
    data-aax_src="302">
</amp-ad>

步驟 5:(選用)指定預留位置

根據廣告聯播網而定,您可以選擇顯示預留位置,直到廣告可供瀏覽為止。這樣做可避免空白空間,進而提供更優質的使用者體驗。若要指定預留位置,請加入具有 placeholder 屬性的子元素。詳情請參閱「預留位置與備用內容」。

<amp-ad type="a9"
    width="300" height="250"
    data-aax_size="300x250"
    data-aax_pubname="test123"
    data-aax_src="302">
   <amp-img placeholder src="placeholder-image.jpg"></amp-img>
</amp-ad>

步驟 6:(選用)指定備用內容

根據廣告聯播網而定,如果沒有可投放的廣告,您可以選擇顯示備用元素。若要指定備用內容,請加入具有 fallback 屬性的子元素。詳情請參閱「預留位置與備用內容」。

<amp-ad type="a9"
    width="300" height="250"
    data-aax_size="300x250"
    data-aax_pubname="test123"
    data-aax_src="302">
   <amp-img fallback src="fallback-image.jpg"></amp-img>
</amp-ad>

恭喜!您現在已在 AMP 頁面中投放廣告!

投放直售 AMPHTML 廣告

amp-ad 元件會投放您指定的聯播網的廣告。這些廣告可以是標準 HTML 廣告或 AMPHTML 廣告,前提是廣告聯播網支援 AMPHTML 廣告。若要將您的直售廣告投放為 AMPHTML 廣告,請根據 AMPHTML 廣告規格需求在 AMP HTML 中建立廣告,並使用可投放 AMPHTML 廣告的廣告伺服器。

擴增廣告請求的目標指定資料

Real-Time Config (RTC) 功能是 Fast Fetch 投放機制的一部分,可讓發布商使用在執行階段擷取的第一方和第三方目標指定資訊來擴增廣告請求。RTC 允許對每個廣告版位的目標指定伺服器發出最多 5 次呼叫,呼叫結果會附加到廣告請求中。若要在您的廣告中使用 RTC,您使用的廣告聯播網必須支援 RTC 和 Fast Fetch。

您可以從這部 YouTube 影片中瞭解更多關於 RTC 的資訊

觀看「透過 Header Bidding 實現有效的 AMP 營利」。

或者,從這些 RTC 資源中瞭解更多資訊

最佳做法

以下是一些訣竅,可讓您盡可能提高 AMP 頁面中廣告的成效

版位與控制項:最佳化您的廣告版位

  • 在 AMP 頁面中放置與非 AMP 頁面相同數量的廣告,以產生每頁最高收益。
  • 將第一個廣告放置在第一個視窗 (「首頁下方」) 的正下方,以提供最佳使用者體驗。
  • 除非您使用進階 CSS 或媒體查詢,否則請確保您的廣告單元置於頁面中央,以便為使用者提供最佳行動版網頁體驗。
  • 在您的 AMP 廣告空間中啟用多尺寸廣告請求,以增加廣告競價壓力並提高收益。

需求與定價:為您的廣告取得合適的價格

  • 透過所有銷售管道 (包括直接和間接管道) 在您的 AMP 頁面中銷售廣告單元,以盡可能提高 AMP 頁面廣告空間的競爭力。
  • 以與非 AMP 頁面廣告空間類似的方式為您的 AMP 頁面廣告空間定價。監控成效並據此調整定價。
  • 確保所有廣告需求管道都在競爭您的 AMP 頁面廣告空間,以提高競爭力。

廣告類型:投放最佳廣告類型

  • 避免使用過於龐大的素材,請參閱 IAB 指南。
  • 避免使用間隙廣告或其他會在廣告載入時導致內容重新排列的廣告格式。
  • 將 data-loading-strategy 設定為 prefer-viewability-over-views,以針對可視度進行最佳化。
  • 透過支援的播放器或 amp-iframe 將廣告放置在您的影片內容中,以在所有類型的內容中實現收益。
  • 導入原生廣告,以便使用多尺寸廣告請求與展示廣告競爭,在增加需求壓力的同時,為您的讀者提供優質的使用者體驗。

創新:提供最吸引人的廣告產品

其他資源