• 網站

國際化

簡介

如何在 AMP 中支援 hreflang 和國際化。內容的國際化和在地化是網站經常採用的重要功能，旨在最大程度地擴展其內容或服務的影響範圍。

對於靜態網站，解決此問題的常見網站結構技術稱為「hreflang」。Hreflang 是網站中繼資料的一部分，用於註解頁面，以便檢索器可以發現特定文章的替代翻譯版本。Google 等搜尋引擎可以識別使用 hreflang 的網站。hreflang 標記與 link 標籤一起使用，以引用另一個文件

<link rel="alternate" hreflang="fr" href="https://www.example.com/path/to/french.html" />

AMP 文件也可以使用 hreflang 標記，將檢索器指向其他語言版本的自身。

然而，務必正確設定所有 AMP 文件之間的 hreflang 關係，尤其是 canonical 文件和 AMP 文件之間現有的中繼資料關係。以下是兩個範例，說明網站如何在文章中建構其 canonical 文件和 AMP 文件的 hreflang 關係。

範例 1：Canonical + AMP

常見的網站結構模式是將非 AMP canonical 文件與 AMP 文件配對。下圖說明如何為此結構提供翻譯版本

在此圖中，有一個英文 canonical 桌機版文件和一個對應的 AMP 文件。根據 AMP 專案官方文件中關於探索和散佈的說明，英文 AMP 文件必須包含指向 canonical 文件的 link 標籤。同樣地，canonical 文件也包含指向 AMP 文件的對應 link 標籤。

此外，此圖還包含 canonical 文件和 AMP 文件的法文翻譯版本。因此，文件必須包含具有 hreflang 屬性的 link 標籤，以連結 canonical 文件和 AMP 文件的各種替代語言版本。以下規則適用： * 每個 canonical 文件都必須有一個 rel=amphtml link 標籤，指向相同語言的相符 AMP 文件。 * 每個 AMP 文件都必須有一個 rel=canonical link 標籤，指向相同語言的相符 canonical 桌機版文件。 * 每個 canonical 文件都必須有一個 rel=alternate link 標籤和一個 hreflang 屬性，用於 canonical 文件的每個替代語言版本。 * 每個 AMP 文件都必須有一個 rel=alternate link 標籤和一個 hreflang 屬性，用於 AMP 文件的每個替代語言版本。

因此，假設一篇文章有 X 個語言版本（包括英文），則每個 canonical 文件都將包含： * 1 個 rel=amphtml link 標籤 * 以及 X 個具有 rel=alternate 和 hreflang 屬性的 link 標籤

查看範例

範例 2：Canonical + Alternate + AMP

下一個範例是第一個範例的擴展版本。此範例包含任何給定語言的任何給定文件的 3 個版本： * canonical 桌機版文件 * alternate 行動版網站文件 * AMP 文件

下圖說明如何為此結構提供翻譯版本

前一個範例中的相同規則適用於此範例，並新增以下規則： * 每個 canonical 文件都必須有一個 rel=alternate link 標籤，且沒有 hreflang 屬性，指向相同語言的相符 alternate 行動版文件。 * 每個 alternate 行動版文件都必須有一個 rel=canonical link 標籤，指向相同語言的相符 canonical 桌機版文件。 * 每個 alternate 行動版文件都必須有一個 rel=alternate link 標籤和一個 hreflang 屬性，用於 alternate 行動版文件的每個替代語言版本。

查看範例

• 作者 @tcmg