本期的文章將帶領(lǐng)你打通 AMP 與 SEO 的任督二脈，引導(dǎo)你如何從 GA 數(shù)據(jù)中檢測出自己是否需要使用 AMP ？以及揭開優(yōu)化 AMP 的神秘面紗，了解優(yōu)化 AMP 的 7 個最佳做法。

1. 在 AMP 網(wǎng)頁上展示與非 AMP 網(wǎng)頁相同數(shù)量的廣告，以實現(xiàn)每頁收益最大化

當(dāng)你使用 AMP 并看到網(wǎng)頁加載時長、網(wǎng)站訪問次數(shù)等多方面都有所提升之后，請不要急于安裝更多的廣告位置。AMP 項目的目標是幫助提高網(wǎng)頁加載速度，讓用戶獲得最佳體驗。AMP 上投放廣告也本著這樣的目標，力求廣告能夠快速安全地呈現(xiàn)給用戶、極具吸引力且效果卓著，而不是過度增加每個頁面的廣告比重。

2. 在 AMP 中展示廣告，你需要將自定義 <amp-ad> 組件添加到 AMP 網(wǎng)頁中

在非 AMP 網(wǎng)頁（傳統(tǒng) HTML）中，若要展示廣告，需要添加一段 JavaScript 代碼，才能投放來自廣告網(wǎng)絡(luò)的廣告。出于性能和安全原因，你不能在 AMP 網(wǎng)頁中添加第三方 JavaScript。因此，要在 AMP 中展示廣告，你需要將自定義 <amp-ad> 組件添加到 AMP 網(wǎng)頁中。

第 1 步：添加 amp-ad 腳本

<amp-ad> 組件是 AMP 庫的一個自定義廣告擴展組件。<amp-ad> 本質(zhì)上是專為優(yōu)化性能而精心設(shè)計的自定義 JavaScript。要運行 <amp-ad> 組件，你必須在 AMP 網(wǎng)頁的 head 部分添加此組件所需的 JavaScript：

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

第 2 步：添加 amp-ad 標記到 AMP 網(wǎng)頁

超過 100 個廣告服務(wù)商和廣告網(wǎng)絡(luò)提供與 AMP 的內(nèi)置集成。要為指定廣告網(wǎng)絡(luò)添加廣告，請?zhí)砑?<amp-ad> 標記，然后在 type 屬性中指定廣告網(wǎng)絡(luò)。

在本例中，我們添加一個廣告位來投放 a9 網(wǎng)絡(luò)中的廣告：

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

第 3 步：指定廣告單元的大小

將 width 和 height 屬性添加到 <amp-ad> 標記中，以便指定 AMP 網(wǎng)頁上廣告的大?。?/p>

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

第 4 步：設(shè)置廣告網(wǎng)絡(luò)參數(shù)

每個網(wǎng)絡(luò)都具有投放廣告所需的特定數(shù)據(jù)屬性。請參閱廣告網(wǎng)絡(luò)的 <amp-ad> 文檔并添加所需的屬性。在下面的示例中，a9 網(wǎng)絡(luò)需要其他參數(shù)以指定廣告的大小及其他詳細信息：

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

第 5 步：（可選）指定占位符

根據(jù)具體的廣告網(wǎng)絡(luò)，你可以選擇在廣告可供查看前顯示占位符。這樣做可防止出現(xiàn)空白，從而提供更好的用戶體驗。要指定占位符，請通過 placeholder 屬性添加一個子元素。有關(guān)詳情請參閱占位符和后備行為。

<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 步：（可選）指定后備行為

根據(jù)具體的廣告網(wǎng)絡(luò)，你可以選擇在沒有廣告可投放時顯示后備元素。要指定后備行為，請通過 fallback 屬性添加一個子元素。有關(guān)詳情請參閱占位符和后備行為。

<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 網(wǎng)頁上投放廣告了。

3. 投放 AMPHTML 廣告

AMPHTML 廣告是一種更快速、更精簡且更安全地在網(wǎng)頁上投放廣告的方式。雖然 AMP 網(wǎng)頁支持傳統(tǒng)的 HTML 廣告，但這些廣告的加載速度可能很慢。要讓廣告本身與 AMP 網(wǎng)頁的其余內(nèi)容一樣快速顯示，你可以制作 AMPHTML 格式的廣告。AMPHTML 廣告僅在經(jīng)過驗證后才會投放，可確保廣告的安全性和良好表現(xiàn)。最重要的是，此類廣告可以在網(wǎng)絡(luò)上的任何位置（而不只是在 AMP 網(wǎng)頁上）投放。

AMPHTML 廣告是按照 AMPHTML 廣告規(guī)范使用 AMP HTML 編寫的（AMP HTML 的一種變體 + CSS）。這意味著廣告無法再運行任意 JavaScript，而任意 JavaScript 正是導(dǎo)致傳統(tǒng)廣告表現(xiàn)很差的首要原因。因此，與核心 AMP 一樣，核心廣告 JavaScript 用例也內(nèi)置于 AMP 開放源代碼項目中，以保證廣告實現(xiàn)良好行為。

4. 利用定位數(shù)據(jù)增強廣告請求

作為快速獲取投放機制的一部分，實時配置 (RTC) 功能使發(fā)布商能夠利用在運行時檢索到的第一方和第三方定位信息增強廣告請求。對于每個廣告位，RTC 最多支持對定位服務(wù)器發(fā)出 5 次出價邀約，相關(guān)結(jié)果會附加到廣告請求中。要對你的廣告使用 RTC，你所使用的廣告網(wǎng)絡(luò)必須支持 RTC 和快速獲取。

5. 展示位置與控件：優(yōu)化廣告展示位置

• 在第一個視口的正下方展示第一個廣告（“非首屏”），以提供最佳用戶體驗。

• 除非你使用的是高級 CSS 或媒體查詢，否則請確保你的廣告單元位于網(wǎng)頁中央，以便為用戶提供最佳移動網(wǎng)頁體驗。

• 對 AMP 廣告資源啟用多尺寸廣告請求，以增加廣告競價壓力并提高收入。

6. 需求與定價：為廣告確定合適的價格

• 跨所有銷售渠道（包括直接和間接銷售渠道）銷售 AMP 網(wǎng)頁上的廣告單元，以最大限度提高你 AMP 網(wǎng)頁上的廣告資源的競爭力。

• 為 AMP 網(wǎng)頁上的廣告資源定價（價格與非 AMP 網(wǎng)頁上的廣告資源相差無幾）。監(jiān)控效果并適當(dāng)調(diào)整價格。

• 確保所有廣告需求渠道都在爭奪你 AMP 網(wǎng)頁上的廣告資源，以提高競爭壓力。

7. 廣告類型：投放最佳類型的廣告

• 避免使用尺寸很大的廣告文件。

• 避免使用插頁式廣告或其他會導(dǎo)致內(nèi)容在廣告加載時重排的廣告格式。

• 進行優(yōu)化以提高可見度：將 data-loading-strategy 設(shè)置為 prefer-viewability-over-views。

• 通過支持的播放器或 amp-iframe 在視頻內(nèi)容中展示廣告，以通過各種類型的內(nèi)容創(chuàng)收。

• 使用多尺寸廣告請求實現(xiàn)原生廣告，以與展示廣告展開競爭，從而在提供優(yōu)質(zhì)用戶體驗的同時增加需求壓力。