AMP

AMP 驗證錯誤

有效的 AMP 文件不得包含任何驗證錯誤。本文件的目的是協助您更瞭解並修正您在驗證 AMP 網頁時遇到的任何驗證錯誤。如要全面瞭解驗證錯誤,請參閱 AMP 驗證器規格

AMP HTML 標記和屬性錯誤

缺少必要標記

程式碼 MANDATORY_TAG_MISSING
格式 「缺少或不正確的必要標記 '%1'。」
修正 新增 (或修正) 必要 HTML 標記。

所有 AMP 文件中都必須存在下列標記

  • <!doctype html>
  • <html amp> 或 <html ⚡>
  • <head>
  • <link rel="canonical" href="$SOME_URL">
  • <meta charset="utf-8">
  • <meta name="viewport" content="...">
  • <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
  • <script async src="https://cdn.ampproject.org/v0.js"></script>
  • <body>

這些必要標記在 AMP 驗證器規格中包含 mandatory: true 欄位;在 AMP 規格中也有提及。

缺少另一個標記要求的標記

程式碼 TAG_REQUIRED_BY_MISSING
格式 「缺少或不正確的 '%1' 標記,但 '%2' 要求必須要有。」
修正 新增 (或修正) 必要的 HTML 標記。

當驗證器在 AMP 文件中找到擴充元件,但找不到對應的 <script> 時,就會擲回 TAG_REQUIRED_BY_MISSING 錯誤。

擴充元件必須以自訂元素的形式明確納入 AMP 文件中。如要修正這些錯誤,請前往擴充元件的參考頁面,複製其必要的指令碼,並貼到 AMP 文件的 <head> 中。

不允許的標記

程式碼 DISALLOWED_TAG
格式 「不允許標記 '%1'。」
修正 移除不允許的標記。

標記已加入允許清單,因此沒有所有不允許標記的明確清單;不過,AMP 規格大致定義了不允許標記的集合。

不允許自訂 JavaScript

程式碼 DISALLOWED_SCRIPT_TAG
格式 「不允許自訂 JavaScript。」
修正 移除 javascript 標記或使用 amp-script。

AMP 格式不允許透過 <script> 元素將自訂 JavaScript 新增至網頁。JavaScript 的許多常見用途都有 AMP HTML 程式庫的對等實作項目。請參閱 AMP 元件,瞭解可用於強化 AMP HTML 網頁的元件集。

如果沒有任何可用的元件涵蓋您的使用案例,則可以使用 amp-script 執行您的自訂 JavaScript。

缺少必要屬性

程式碼 MANDATORY_ATTR_MISSING
格式 「標記 '%2' 中缺少必要屬性 '%1'。」
修正 將必要屬性新增至標記。

AMP 標記的必要屬性定義在 AMP 的驗證器規格中。只要搜尋標記、檢視列出的屬性,然後檢查是否有 mandatory: true 即可。每個 AMP 標記的必要屬性也會列在標記的規格中。

屬性值無效

程式碼 INVALID_ATTR_VALUE
格式 「標記 '%2' 中的屬性 '%1' 設定為無效值 '%3'。」
修正 將屬性值修正為有效的值。

這個錯誤表示 HTML 標記具有名稱允許但值不允許的屬性。舉例來說,這個錯誤的一個常見觸發原因是網址的值無效。所有網址值 (在 hrefsrc 屬性中) 都必須符合下列可能屬性值的其中一個。

重要事項:AMP 中的許多網址值都需要 HTTPS。如果您遇到這個錯誤,但不確定原因,請查看相關 AMP 標記的規格,以瞭解屬性是否需要 HTTPS。

不允許的屬性

程式碼 DISALLOWED_ATTR
格式 「屬性 '%1' 不得在標記 '%2' 中顯示。」
修正 從 HTML 標記中移除屬性。

屬性已加入允許清單,因此沒有所有不允許屬性的明確清單。如要檢查每個特定標記支援的屬性,請搜尋 HTML 標記,然後在 AMP 驗證器規格中搜尋 attrs

除了每個標記的特定屬性允許清單之外,所有 AMP 標記都可以使用 $GLOBAL_ATTRS 下允許清單中的任何屬性;所有具有 "data-" 字首的屬性也都在允許清單中。

缺少必要文字或文字不正確

程式碼 MANDATORY_CDATA_MISSING_OR_INCORRECT
格式 「缺少或不正確的必要文字 (CDATA) 在標記 '%1' 內。」
修正 在標記內新增或修正必要文字。

CDATA 是開始和結束 HTML 標記之間的內容資料,目前會使用允許清單和拒絕清單進行評估。具有必要 CDATA 的標記包括

<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>

<style amp-custom>

這個項目的詳細訊息可能是下列其中一項

  • 「必要樣式樣板 (已啟用 js)」
  • 「必要樣式樣板 (noscript)」
  • 「不允許的 -amp- CSS 類別名稱字首」
  • 「不允許 CSS 中的 !important 屬性」
  • 「不允許 CSS 中的 @charset」
  • 「不允許 CSS 中的 @import」
  • 「不允許 CSS 中的 @namespace」
  • 「不允許 CSS 中的 @supports」
  • 「不允許 CSS 中的 @document」
  • 「不允許 CSS 中的 @page」

  • 「不允許 CSS 中的 @viewport」

標記內不允許的文字

程式碼 CDATA_VIOLATES_DENYLIST
格式 「標記 '%1' 內的文字 (CDATA) 符合 '%2',這是被禁止的。」
修正 移除不允許的文字。

特定 CSS 資料已加入拒絕清單,以驗證必要的 CSS AMP 規則。

以下是不允許 CSS 資料的清單 (另請參閱 AMP 驗證器規格中的 disallowed_cdata_regex)

  • "\\.i?-amp-" ("CSS -amp- 類別名稱字首")
  • 「!important」
  • 「charset」
  • 「&#64;import」
  • 「@namespace」
  • 「@document」
  • 「@page」

  • 「@viewport」

標記中屬性內不允許的屬性

程式碼 DISALLOWED_PROPERTY_IN_ATTR_VALUE
格式 「標記 '%3' 中屬性 '%2' 內的屬性 '%1' 不允許。」
修正 移除指定屬性中不允許的屬性。

當屬性內的屬性名稱不允許時,就會發生這個錯誤。在這裡,屬性一詞指的是屬性內的結構化鍵/值資料。

舉例來說,下列程式碼會導致錯誤

<meta http-equiv="X-UA-Compatible" content="invalidfoo=edge">

應該是:<meta http-equiv="X-UA-Compatible" content="ie=edge">。再舉一個例子,在

<meta name="viewport content="width=device-width;minimum-scale=1"> 中,widthminimum-scale 是屬性名稱。

下列程式碼會導致 DISALLOWED_PROPERTY_IN_ATTR_VALUE 錯誤

<meta name="viewport content="width=device-width;invalidfoo=1">

屬性值無效

程式碼 INVALID_PROPERTY_VALUE_IN_ATTR_VALUE
格式 「標記 '%3' 中屬性 '%2' 內的屬性 '%1' 設定為 '%4',這是無效的。」
修正 修正無效的屬性值。

當屬性內的屬性值無效時,就會發生這個錯誤。在這裡,屬性一詞指的是屬性內的結構化鍵/值資料。

舉例來說,在 <meta name="viewport content="width=device-width;minimum-scale=1"> 中,device-width1 是屬性值。

下列程式碼會導致 INVALID_PROPERTY_VALUE_IN_ATTR_VALUE 錯誤

<meta name=viewport content="width=device-width;minimum-scale=invalidfoo">

請注意,如果您嘗試輸出無值屬性 (例如,amp-video 等元件的 autoplaycontrolsloop 等屬性),但您的 HTML 建構程序產生預設 (但無效) 值 (例如 true) (舉例來說,React 會預設產生 <amp-video autoplay="true" ...>),解決方法是將屬性的名稱輸出為值。例如,<amp-video autoplay="autoplay" ...>

缺少網址

程式碼 MISSING_URL
格式 「標記 '%2' 中屬性 '%1' 缺少網址。」
修正 新增有效的網址。

當需要網址的屬性缺少網址時,就會發生這個錯誤,例如,空的 hrefsrc 屬性。

網址無效

程式碼 INVALID_URL_PROTOCOL
格式 「標記 '%2' 中屬性 '%1' 的網址 '%3' 格式錯誤」
修正 修正損壞的網址。

當屬性具有網址,但網址無效時,就會發生這個錯誤。

網址協定無效

程式碼 INVALID_URL_PROTOCOL
格式 標記 '%2' 中屬性 '%1' 的網址協定 '%3:' 無效。
修正 變更為有效的協定,例如,http 可能需要改為 https

當標記具有 hrefsrc,但必須設定為特定協定時,就會發生這個錯誤。舉例來說,許多標記都需要 https

屬性中缺少必要屬性

程式碼 MANDATORY_PROPERTY_MISSING_FROM_ATTR_VALUE
格式 「標記 '%3' 中屬性 '%2' 缺少屬性 '%1'。」
修正 新增缺少的屬性。

目前,如果缺少下列必要屬性,就會發生這個錯誤

  • content="...ie=..."
  • content="...width=..."
  • content="...minimum-scale=..."

它們指的是預期的標記

  • <meta http-equiv="X-UA-Compatible" content="ie=edge">
  • <meta name=viewport content="width=device-width;minimum-scale=1">

互斥屬性

程式碼 MUTUALLY_EXCLUSIVE_ATTRS
格式 「在標記 '%1' 中遇到互斥屬性 - 從 %2 中挑選一個。」
修正 移除其中一個互斥屬性。

當標記同時具有互斥屬性時,就會發生這個錯誤。舉例來說,下列標記只允許其中一個

清單中缺少必要屬性

程式碼 MANDATORY_ONEOF_ATTR_MISSING
格式 「標記 '%1' 缺少必要屬性 - 從 %2 中挑選一個。」
修正 從提供的屬性選項中新增缺少的必要屬性。

當標記從多個選項中缺少一個必要屬性時,就會發生這個錯誤。舉例來說,下列標記需要從兩個可能的選項中選取一個屬性

父標記錯誤

程式碼 WRONG_PARENT_TAG
格式 「標記 '%1' 的父標記是 '%2',但只能是 '%3'。」
修正 將標記設為必要父項的直接子項。

特定標記需要直接父項 (而非遠房祖先)。以下列出特定標記的必要父項 (標記、父項)

  • !doctype 需要父標記 root
  • html 需要父標記 !doctype
  • head 需要父標記 html
  • body 需要父標記 html
  • link 需要父標記 head
  • meta 需要父標記 head
  • style amp-custom 需要父標記 head
  • style 需要父標記 boilerplate (noscript)
  • noscript 需要父標記 head
  • script 需要父標記 head
  • source 需要媒體標記 (amp-audioamp-video 等)。

不允許的標記祖先

程式碼 DISALLOWED_TAG_ANCESTOR
格式 「標記 '%1' 不得顯示為標記 '%2' 的子項。」
修正 移除 (或移動) 不允許的巢狀標記。

當標記是不驗證的另一個標記的子項時,就會發生這個錯誤。目前,唯一的範例是 template 標記,不得巢狀在另一個 template 標記下。

必要標記祖先

程式碼 MANDATORY_TAG_ANCESTOR
格式 「標記 '%1' 只能顯示為標記 '%2' 的子項。」
修正 移除標記,或將其設為特定標記的子項。

必要子項在 AMP 驗證器規格中定義為 mandatory_ancestor

當下列標記缺少其 mandatory_ancestor 時,就會發生錯誤 (標記、祖先)

  • img 必須是 noscript 的子項。
  • video 必須是 noscript 的子項。
  • audio 必須是 noscript 的子項。
  • noscript 必須是 body 的子項。

具有提示的必要標記祖先

程式碼 MANDATORY_TAG_ANCESTOR_WITH_HINT
格式 「標記 '%1' 只能顯示為標記 '%2' 的子項。您是否要使用 '%3'?」
修正 移除標記,將其設為特定標記的子項,或將標記取代為提示的標記。

當在 AMP 文件中找到下列其中一個標記,但未正確巢狀在其必要父項中時,就會發生錯誤

  • img 不在 noscript 父項內。
  • video 不在 noscript 父項內。
  • audio 不在 noscript 父項內。
  • noscript 不在 body 父項內。

重複的唯一標記

程式碼 DUPLICATE_UNIQUE_TAG
格式 「標記 '%1' 在文件中出現多次。」
修正 從 AMP 文件中移除其中一個重複的標記。

當只允許一個標記執行個體,但找到重複項目時,就會發生這個錯誤。

已知唯一標記的完整清單

  • <doctype html>
  • <html amp>
  • <head>
  • <link rel=canonical href=...>
  • <link rel=amphtml href=...>
  • <meta charset="utf-8">

  • <meta viewport>

* <style amp-custom> * <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript> * <body> * <script src="https://cdn.ampproject.org/v0.js">

樣式和版面配置錯誤

在深入探討樣式和版面配置錯誤之前,值得瞭解 樣式設定版面配置在 AMP 中的運作方式。由於 AMP 網頁是 HTML 網頁,因此樣式設定與任何 HTML 網頁都非常相似。但是,為了確保網頁快速載入,有一些限制,而 AMP 驗證器會強制執行這些限制。

版面配置在 AMP 網頁中受到更多控制。在網頁上顯示的任何標記都需要預先定義的高度和寬度,這可大幅減少轉譯和捲動延遲。這並不表示您必須手動加入這些屬性。對於某些版面配置類型,AMP 驗證器不會擲回錯誤,因為會假設預設值。

每個 AMP 標記都有一個 supported_layouts 清單,如 AMP 驗證器規格中所定義。驗證器會針對不支援的版面配置擲回錯誤,並且會檢查預先定義版面配置的驗證規則。

樣式表過長

程式碼 STYLESHEET_TOO_LONG
格式 「在標記 'style' 中指定的作者樣式表過長 - 我們看到 %1 個位元組,而限制為 %2 個位元組。」
修正 縮減樣式表的大小,使其低於 75,000 個位元組。

當 AMP 驗證器測量 <style amp-custom> 內樣式內容的大小超過 75,000 個位元組的限制時,就會擲回這個錯誤。

CSS 語法錯誤

程式碼 CSS_SYNTAX
格式 「標記 '%1' 中的 CSS 語法錯誤 - %2。」
修正 修正 CSS 語法錯誤。

當您在指定的標記中有 CSS 語法錯誤時,就會發生這個錯誤。如果您不確定造成錯誤的原因,請嘗試透過線上 CSS 驗證器 (例如 csslint) 執行 CSS。

特定規則的 CSS 語法錯誤

程式碼 CSS_SYNTAX_INVALID_AT_RULE
格式 「標記 '%1' 中的 CSS 語法錯誤 - 看到無效的 @ 規則 '%2'。」
修正 修正指定的 CSS 語法錯誤。

這個錯誤指的是 CSS 中的 @ 規則,AMP 只允許少數規則。(另請參閱 AMP 規格)。舉例來說,不允許 @import。驗證錯誤會明確告知您無效的規則,讓您更容易修正該規則。

AMP 標記不支援隱含版面配置

程式碼 IMPLIED_LAYOUT_INVALID
格式 「標記 '%2' 不支援隱含版面配置 '%1'。」
修正 為標記提供有效的版面配置屬性。

當您未指定 AMP 標記的版面配置,且不支援隱含版面配置 (根據寬度、高度和尺寸) 時,就會發生這個錯誤。請在 AMP 驗證器規格中檢查標記的 supported_layout 值。

實際版面配置行為取決於 layout 屬性。如需版面配置運作方式的詳細資訊,請參閱如何控制版面配置AMP HTML 版面配置系統規格

注意 – 如果您未指定版面配置,且未加入 widthheight 值,則版面配置會預設為 CONTAINER。由於任何 AMP 標記都不支援 CONTAINER,因此驗證器會擲回錯誤。指定 CONTAINER 以外的版面配置,或加入 width 和/或 height 值,錯誤就會消失。

隱含版面配置不允許的屬性

程式碼 ATTR_DISALLOWED_BY_IMPLIED_LAYOUT
格式 「隱含版面配置 '%3' 不允許標記 '%2' 中的屬性 '%1'。」
修正 從標記中移除不允許的屬性,或者指定允許該屬性的版面配置。

當您未指定 AMP 標記的版面配置,且隱含版面配置包含不允許的屬性時,就會發生這個錯誤。版面配置類型不允許的屬性在 AMP HTML 版面配置系統規格中說明。

AMP 標記不支援指定的版面配置

程式碼 SPECIFIED_LAYOUT_INVALID
格式 「標記 '%2' 不支援指定的版面配置 '%1'。」
修正 指定標記支援的版面配置。

當標記的指定版面配置不受支援時,就會發生這個錯誤。請在 AMP 驗證器規格中檢查標記的 supported_layout 值。

實際版面配置行為取決於 layout 屬性。如需版面配置運作方式的詳細資訊,請參閱如何控制版面配置AMP HTML 版面配置系統規格

指定版面配置不允許的屬性

程式碼 ATTR_DISALLOWED_BY_SPECIFIED_LAYOUT
格式 「隱含版面配置 '%3' 不允許標記 '%2' 中的屬性 '%1'。」
修正 從標記中移除不允許的屬性,或者指定允許該屬性的版面配置。

當您為 AMP 標記指定版面配置,且版面配置包含不允許的屬性時,就會發生這個錯誤。版面配置類型不允許的屬性在 AMP HTML 版面配置系統規格中說明。

版面配置要求的屬性值無效

程式碼 ATTR_VALUE_REQUIRED_BY_LAYOUT
格式 「標記 '%3' 中屬性 '%2' 的值 '%1' 無效 - 對於版面配置 '%4',將屬性 '%2' 設定為值 '%5'。」
修正 將屬性設定為指定的值。

當屬性值對於指定的版面配置無效時,就會發生這個錯誤。如要瞭解是什麼觸發這個錯誤,您需要熟悉版面配置的不同行為

假設您將版面配置設定為 fixed-height,並且在 heightwidth 中都加入數值。fixed-height 版面配置採用 height 值。width 屬性不得存在,否則必須設定為 auto。驗證器會擲回 ATTR_VALUE_REQUIRED_BY_LAYOUT。

寬度和高度的單位不一致

程式碼 INCONSISTENT_UNITS_FOR_WIDTH_AND_HEIGHT
格式 「標記 '%1' 中寬度和高度的單位不一致 - 寬度以 '%2' 指定,而高度以 '%3' 指定。」
修正 提供一致的單位寬度和高度。

除了 layout=fixed 之外,寬度和高度屬性需要以相同的單位表示。當它們不相同時,就會觸發這個錯誤。

舉例來說,<amp-img src="" layout="responsive" width="42px" height="42rem"> 會產生這個錯誤訊息

「標記 'amp-img' 中寬度和高度的單位不一致 - 寬度以 'px' 指定,而高度以 'rem' 指定。」

範本錯誤

AMP 網頁不能包含範本語法,除非該語法位於專門設計為包含範本的 AMP 標記內,例如 amp-mustache

在來源檔案中加入範本是可以的,只要這些檔案產生的輸出不包含範本即可 (另請參閱 使用 CSS 預處理器)。

屬性包含範本語法

程式碼 TEMPLATE_IN_ATTR_NAME
格式 「標記 '%2' 中屬性名稱 '%1' 中的 Mustache 範本語法。」
修正 從屬性中移除 Mustache 範本語法。

每當驗證器在屬性值中找到 Mustache 範本語法時,就會發生這個錯誤。

屬性包含未逸出的範本語法

程式碼 UNESCAPED_TEMPLATE_IN_ATTR_VALUE
格式 「標記 '%2' 中的屬性 '%1' 設定為 '%3',其中包含未逸出的 Mustache 範本語法。」
修正 逸出 mustache 範本。

每當驗證器在屬性值中找到 未逸出的 Mustache 範本語法時,就會發生這個錯誤。

屬性包含範本局部

程式碼 TEMPLATE_PARTIAL_IN_ATTR_VALUE
格式 「標記 '%2' 中的屬性 '%1' 設定為 '%3',其中包含 Mustache 範本局部。」
修正 移除 mustache 局部。

每當驗證器在屬性值中找到 Mustache 局部時,就會發生這個錯誤。

已淘汰錯誤

已淘汰的標記

程式碼 DEPRECATED_TAG
格式 尚未定義錯誤訊息 (沒有已淘汰的標記)。
修正 移除已淘汰的標記。

當在 AMP 文件中找到先前有效的 AMP 標記時,就會發生這個警告。這只是一個警告;具有警告的 AMP 文件仍然有效。目前沒有已淘汰的標記;此警告保留供未來淘汰使用。

已淘汰的屬性

程式碼 DEPRECATED_ATTR
格式 「標記 '%2' 中的屬性 '%1' 已淘汰 - 請改用 '%3'。」
修正 根據良好實務做法,移除已淘汰的屬性。

當在 AMP 文件中找到先前有效的 AMP 屬性時,就會發生這個警告。這只是一個警告;具有警告的 AMP 文件仍然有效。

透過在 AMP 驗證器規格中搜尋 deprecation,找出每個 AMP 標記的已淘汰屬性。