AMP
  • websites

Internationalization

Introduction

How to support hreflang and internationalization with AMP. Internationalization and localization of content is an important feature that websites often embrace to provide maximum reach for their content or services.

For static websites, a common site structure technique for addressing this is known as 'hreflang'. Hreflang is a part of the meta data of a website and is used to annotate a page such that crawlers can discover alternative translations of a particular article. Search engines such as Google recognise websites that use hreflang. The hreflang notation is used with the link tag to refer to another document:

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

AMP documents can also use the hreflang notation to point crawlers towards other versions of themselves in other languages.

It's important, however, to set up the hreflang relationships among all AMP documents correctly - especially the existing metadata relationships between canonical documents and AMP documents. Below are two examples of how websites might structure their hreflang relationships for canonical and AMP documents across an article.

Example 1: Canonical + AMP

A common site structure pattern is pairing non-AMP canonical documents with AMP documents. The following diagram illustrates how to provide translations for this structure:

In this diagram, there is an English canonical desktop document and a corresponding AMP document. As per the official AMP Project documentation for discovery and distribution the English AMP document must include a link tag to the canonical document. Similarly, the canonical document includes a corresponding link tag to the AMP document.

Additionally, this diagram includes French translations of both the canonical document and the AMP document. Therefore the documents must include link tags with hreflang attributes to connect the various alternative language versions of the canonical and AMP documents. The following rules apply: * Every canonical document must have a link tag with rel=amphtml pointing to its matching AMP document in the same language. * Every AMP document must have a link tag with rel=canonical pointing to its matching canonical desktop document, again, in the same language. * Every canonical document must have a link tag with rel=alternate and an hreflang attribute for each alternative language version of the canonical document. * Every AMP document must have a link tag with rel=alternate and an hreflang attribute for each alternative language version of the AMP document.

Therefore, given an article with X language versions of itself (including English) each canonical document would include: * 1 link tag with rel=amphtml * And X link tags with rel=alternate and the hreflang attribute

View the Example

Example 2: Canonical + Alternate + AMP

The next example is an expanded version of the first example. This example includes 3 versions of any given document in a given language: * A canonical desktop document * An alternate mobile site document * An AMP document

The following diagram illustrates how to provide translations for this structure:

The same rules from the previous example apply in this example with the addition of the following rules: * Every canonical document must have a link tag with rel=alternate and no hreflang attribute pointing to its matching alternate mobile document in the same language. * Every alternate mobile document must have a link tag with rel=canonical pointing to its matching canonical desktop document, again, in the same language. * Every alternate mobile document must have a link tag with rel=alternate and an hreflang attribute for each alternative language version of the alternate mobile document.

View the Example

Bạn cần được giải thích thêm?

Nếu bạn vẫn còn thắc mắc sau khi đọc hướng dẫn trên trang này, hãy liên hệ với những người dùng AMP khác để thảo luận về trường hợp sử dụng cụ thể của bạn.

Truy cập Stack Overflow
Một tính năng chưa được giải thích?

Dự án AMP đặc biệt khuyến khích sự tham gia và đóng góp của bạn! Chúng tôi hi vọng bạn sẽ trở thành một người tham gia tích cực trong cộng đồng mã nguồn mở của chúng tôi, nhưng chúng tôi cũng chào mừng các đóng góp đơn lẻ về vấn đề mà bạn đặc biệt quan tâm.

Chỉnh sửa mẫu trên GitHub