國際化
簡介
如何透過 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 文件都必須針對 Canonical 文件的每個其他語言版本,有一個帶有 rel=alternate
和 hreflang
屬性的 link 標記。 * 每個 AMP 文件都必須針對 AMP 文件的每個其他語言版本,有一個帶有 rel=alternate
和 hreflang
屬性的 link 標記。
因此,如果一篇文章有 X 個語言版本(包括英文),則每個 Canonical 文件都會包含:* 1 個帶有 rel=amphtml
的 link 標記 * 以及 X 個帶有 rel=alternate
和 hreflang
屬性的 link 標記
範例 2:Canonical + Alternate + AMP
下一個範例是第一個範例的擴展版本。此範例包含任何給定語言文件中 3 個版本:* Canonical 桌面文件 * Alternate 行動網站文件 * AMP 文件
下圖說明如何為此結構提供翻譯。
前一個範例中的相同規則適用於此範例,並加上以下規則:* 每個 Canonical 文件都必須有一個帶有 rel=alternate
但沒有 hreflang
屬性的 link 標記,指向同語言中與其相符的 Alternate 行動文件。* 每個 Alternate 行動文件都必須有一個 rel=canonical
link 標記,指向同語言中與其相符的 Canonical 桌面文件。* 每個 Alternate 行動文件都必須針對 Alternate 行動文件的每個其他語言版本,有一個帶有 rel=alternate
和 hreflang
屬性的 link 標記。
如果此頁面上的說明未能涵蓋您的所有問題,請隨時與其他 AMP 使用者聯繫,討論您的確切使用案例。
前往 Stack Overflow 功能未說明?AMP 專案強烈鼓勵您的參與和貢獻!我們希望您能成為我們開放原始碼社群的長期參與者,同時也歡迎您針對您特別感興趣的問題提供一次性貢獻。
在 GitHub 上編輯範例-
由 @tcmg 撰寫