AMP
EN
Deutsch Français العربية Español Italiano Indonesia 日本語 한국어 Português Русский Türkçe 中文 Polski Tiếng việt

AMP for Ads 規範

如果您想提議變更此標準，請在 Intent to Implement (實作意向) 上留言.

AMPHTML 廣告是一種在 AMP 頁面中呈現快速且高效能廣告的機制。為了確保 AMPHTML 廣告文件 (「AMP 素材」) 可以在瀏覽器中快速且順暢地呈現，且不會降低使用者體驗，AMP 素材必須遵守一組驗證規則。與 AMP 格式規則 的精神類似，AMPHTML 廣告只能存取一組有限的允許標記、功能和擴充功能。

AMPHTML 廣告格式規則

除非以下另有規定，否則素材必須遵守 AMP 格式規則 提供的所有規則，此處以引用方式併入。例如，AMPHTML 廣告的 樣板 與 AMP 標準樣板不同。

此外，素材必須遵守以下規則

規則 理由
必須使用 <html ⚡4ads> 或 <html amp4ads> 作為其外層標記。 允許驗證器將素材文件識別為一般 AMP 文件或受限 AMPHTML 廣告文件，並適當地進行調度。
必須包含 <script async src="https://cdn.ampproject.org/amp4ads-v0.js"></script> 作為執行階段指令碼，而不是 https://cdn.ampproject.org/v0.js。 允許針對跨來源 iframe 中提供的 AMPHTML 廣告量身定制執行階段行為。
不得包含 <link rel="canonical"> 標記。 廣告素材沒有「非 AMP 標準版本」，也不會被獨立編入搜尋索引，因此自我參照將毫無用處。
可以選擇性地在 HTML 標頭中包含中繼標記作為識別碼，格式為 <meta name="amp4ads-id" content="vendor=${vendor},type=${type},id=${id}">。這些中繼標記必須放置在 amp4ads-v0.js 指令碼之前。vendor 和 id 的值是僅包含 [0-9a-zA-Z_-] 的字串。type 的值為 creative-id 或 impression-id。 這些自訂識別碼可用於識別曝光或素材。它們對於報告和偵錯可能很有幫助。

範例

<meta name="amp4ads-id"
  content="vendor=adsense,type=creative-id,id=1283474">
<meta name="amp4ads-id"
  content="vendor=adsense,type=impression-id,id=xIsjdf921S">
<amp-analytics> 可見度追蹤可能僅以完整廣告選取器為目標，透過 "visibilitySpec": { "selector": "amp-ad" } 在 Issue #4018 和 PR #4368 中定義。特別是，它可能不會以廣告素材中元素的任何選取器為目標。 在某些情況下，AMPHTML 廣告可能會選擇在 iframe 中呈現廣告素材。在這些情況下，主機頁面分析無論如何都只能以整個 iframe 為目標，並且無法存取任何更精細的選取器。

範例

<amp-analytics id="nestedAnalytics">
  <script type="application/json">
  {
    "requests": {
      "visibility": "https://example.com/nestedAmpAnalytics"
    },
    "triggers": {
      "visibilitySpec": {
      "selector": "amp-ad",
      "visiblePercentageMin": 50,
      "continuousTimeMin": 1000
      }
    }
  }
  </script>
</amp-analytics>

當封閉廣告在螢幕上持續可見 1 秒時，此設定會向 https://example.com/nestedAmpAnalytics URL 發送請求，可見度為 50%。

樣板

AMPHTML 廣告素材需要的樣板樣式行與 一般 AMP 文件 不同，且簡化許多

<style amp4ads-boilerplate>
  body {
    visibility: hidden;
  }
</style>

理由： amp-boilerplate 樣式會隱藏主體內容，直到 AMP 執行階段準備就緒並可以取消隱藏為止。如果停用了 Javascript 或 AMP 執行階段載入失敗，預設樣板可確保最終無論如何都會顯示內容。但是，在 AMPHTML 廣告中，如果完全停用了 Javascript，AMPHTML 廣告將無法執行，並且永遠不會顯示任何廣告，因此不需要 <noscript> 區段。在沒有 AMP 執行階段的情況下，AMPHTML 廣告依賴的大多數機制 (例如，用於可見度追蹤的分析或用於內容顯示的 amp-img) 將不可用，因此最好不顯示廣告，而不是顯示故障的廣告。

最後，AMPHTML 廣告樣板使用 amp-a4a-boilerplate 而不是 amp-boilerplate，以便驗證器可以輕鬆識別它，並產生更準確的錯誤訊息來幫助開發人員。

請注意，關於樣板文字變更的相同規則適用於 一般 AMP 樣板。

CSS

規則 理由
創意 CSS 中禁止使用 position:fixed 和 position:sticky。 position:fixed 會跳脫出 shadow DOM，而 AMPHTML 廣告依賴 shadow DOM。此外，AMP 中的廣告已經不允許使用固定位置。
禁止使用 touch-action。 可以操縱 touch-action 的廣告可能會干擾使用者捲動主機文件的能力。
創意 CSS 限制為 20,000 位元組。 大型 CSS 區塊會使素材膨脹、增加網路延遲並降低頁面效能。
轉場效果和動畫受到額外限制。 AMP 必須能夠控制屬於廣告的所有動畫，以便在廣告不在螢幕上或系統資源非常低時停止它們。
為了驗證目的，供應商特定的前綴被視為沒有前綴的相同符號的別名。這表示如果 CSS 驗證規則禁止符號 foo，則符號 -vendor-foo 也將被禁止。 某些供應商前綴的屬性提供與這些規則下另行禁止或限制的屬性等效的功能。

範例：-webkit-transition 和 -moz-transition 都被視為 transition 的別名。它們僅在允許裸 transition 的情況下才被允許 (請參閱下方的 選取器 區段)。

CSS 動畫和轉場效果

選取器

transition 和 animation 屬性僅允許在符合以下條件的選取器上使用

  • 僅包含 transition、animation、transform、visibility 或 opacity 屬性。

    理由： 這允許 AMP 執行階段在頁面效能必要時從內容中移除此類別以停用動畫。

良好

.box {
  transform: rotate(180deg);
  transition: transform 2s;
}

不良

CSS 類別中不允許的屬性。

.box {
  color: red; // non-animation property not allowed in animation selector
  transform: rotate(180deg);
  transition: transform 2s;
}
可轉場和可動畫化的屬性

唯一可以轉場的屬性是不透明度和變形。( 理由 )

良好

transition: transform 2s;

不良

transition: background-color 2s;

良好

@keyframes turn {
  from {
    transform: rotate(180deg);
  }

  to {
    transform: rotate(90deg);
  }
}

不良

@keyframes slidein {
  from {
    margin-left: 100%;
    width: 300%;
  }

  to {
    margin-left: 0%;
    width: 100%;
  }
}

允許的 AMP 擴充功能和內建功能

以下是在 AMPHTML 廣告素材中允許的 AMP 擴充功能模組和 AMP 內建標記。未明確列出的擴充功能或內建標記均被禁止。

大多數省略都是為了效能或使 AMPHTML 廣告更易於分析。

範例： 此清單中省略了 <amp-ad>。明確禁止它是因為允許在 <amp-ad> 內部使用 <amp-ad> 可能會導致廣告載入的無限制瀑布，這不符合 AMPHTML 廣告的效能目標。

範例： 此清單中省略了 <amp-iframe>。禁止使用它是因為廣告可以使用它來執行任意 Javascript 並載入任意內容。想要使用此類功能的廣告應從其 a4aRegistry 條目傳回 false，並使用現有的「3p iframe」廣告呈現機制。

範例： <amp-facebook>、<amp-instagram>、<amp-twitter> 和 <amp-youtube> 都被省略，原因與 <amp-iframe> 相同：它們都會建立 iframe，並且可能會在其中消耗無限制的資源。

範例： 此清單中省略了 <amp-ad-network-*-impl>。<amp-ad> 標記處理委派給這些實作標記；素材不應嘗試直接包含它們。

範例： <amp-lightbox> 尚未包含，因為即使某些 AMPHTML 廣告素材可能會在 iframe 中呈現，目前也沒有廣告擴充到 iframe 之外的機制。如果證明有此需求，未來可能會新增對此的支援。

HTML 標記

以下是在 AMPHTML 廣告素材中允許的標記。未明確允許的標記均被禁止。此清單是一般 AMP 標記附錄允許清單 的子集。與該清單一樣，它的排序與 HTML5 規範第 4 節 HTML 元素 一致。

大多數省略都是為了效能，或因為這些標記不是 HTML5 標準。例如，省略了 <noscript>，因為 AMPHTML 廣告依賴於啟用 JavaScript 才能運作，因此 <noscript> 區塊永遠不會執行，因此只會使素材膨脹並耗費頻寬和延遲。同樣地，禁止使用 <acronym>、<big> 等，因為它們與 HTML5 不相容。

4.1 根元素

4.1.1 <html>

  • 必須使用類型 <html ⚡4ads> 或 <html amp4ads>

4.2 文件中繼資料

4.2.1 <head>

4.2.2 <title>

4.2.4 <link>

  • 不允許使用 <link rel=...> 標記，但 <link rel=stylesheet> 除外。

  • 注意： 與一般 AMP 不同，禁止使用 <link rel="canonical"> 標記。

    4.2.5 <style> 4.2.6 <meta>

4.3 區段

4.3.1 <body> 4.3.2 <article> 4.3.3 <section> 4.3.4 <nav> 4.3.5 <aside> 4.3.6 <h1>、<h2>、<h3>、<h4>、<h5> 和 <h6> 4.3.7 <header> 4.3.8 <footer> 4.3.9 <address>

4.4 群組內容

4.4.1 <p> 4.4.2 <hr> 4.4.3 <pre> 4.4.4 <blockquote> 4.4.5 <ol> 4.4.6 <ul> 4.4.7 <li> 4.4.8 <dl> 4.4.9 <dt> 4.4.10 <dd> 4.4.11 <figure> 4.4.12 <figcaption> 4.4.13 <div> 4.4.14 <main>

4.5 文字層級語意

4.5.1 <a> 4.5.2 <em> 4.5.3 <strong> 4.5.4 <small> 4.5.5 <s> 4.5.6 <cite> 4.5.7 <q> 4.5.8 <dfn> 4.5.9 <abbr> 4.5.10 <data> 4.5.11 <time> 4.5.12 <code> 4.5.13 <var> 4.5.14 <samp> 4.5.15 <kbd > 4.5.16 <sub> 和 <sup> 4.5.17 <i> 4.5.18 <b> 4.5.19 <u> 4.5.20 <mark> 4.5.21 <ruby> 4.5.22 <rb> 4.5.23 <rt> 4.5.24 <rtc> 4.5.25 <rp> 4.5.26 <bdi> 4.5.27 <bdo> 4.5.28 <span> 4.5.29 <br> 4.5.30 <wbr>

4.6 編輯

4.6.1 <ins> 4.6.2 <del>

4.7 嵌入內容

  • 僅透過 AMP 標記支援嵌入內容，例如 <amp-img> 或 <amp-video>。

4.7.4 <source>

4.7.18 SVG

SVG 標記不在 HTML5 命名空間中。它們在下方列出，沒有區段 ID。

<svg> <g> <path> <glyph> <glyphref> <marker> <view> <circle> <line> <polygon> <polyline> <rect> <text> <textpath> <tref> <tspan> <clippath> <filter> <lineargradient> <radialgradient> <mask> <pattern> <vkern> <hkern> <defs> <use> <symbol> <desc> <title>

4.9 表格資料

4.9.1 <table> 4.9.2 <caption> 4.9.3 <colgroup> 4.9.4 <col> 4.9.5 <tbody> 4.9.6 <thead> 4.9.7 <tfoot> 4.9.8 <tr> 4.9.9 <td> 4.9.10 <th>

4.10 表單

4.10.8 <button>

4.11 指令碼

  • 與一般 AMP 文件一樣，素材的 <head> 標記必須包含 <script async src="https://cdn.ampproject.org/amp4ads-v0.js"></script> 標記。
  • 與一般 AMP 不同，禁止使用 <noscript>。
    • 理由： 由於 AMPHTML 廣告需要啟用 Javascript 才能完全運作，因此 <noscript> 區塊在 AMPHTML 廣告中沒有任何用途，只會耗費網路頻寬。
  • 與一般 AMP 不同，禁止使用 <script type="application/ld+json">。
    • 理由： JSON LD 用於主機頁面上的結構化資料標記，但廣告素材不是獨立文件，並且不包含結構化資料。其中的 JSON LD 區塊只會耗費網路頻寬。
  • 所有其他指令碼規則和排除項都從一般 AMP 繼承。