Hreflang 是一種 HTML 屬性，主要用於指示搜尋引擎特定網頁內容的語言和地區版本。例如，如果您的網站針對不同的語言（如英文和中文）或地區（如台灣與香港）提供多個版本，您可以使用 hreflang 標籤來幫助搜尋引擎正確地顯示符合用戶需求的版本。
這對於多語系或多地區網站來說非常重要，因為它可以：
- 避免重複內容問題：搜尋引擎不會將不同語言或地區的內容視為重複內容。
- 提升用戶體驗：用戶可以直接看到適合他們語言和地區的版本。
Hreflang 的用法
Hreflang 可以通過三種方式實現：
- HTML
<link>標籤 - HTTP 標頭
- XML 網站地圖
1. HTML <link> 標籤
通常用於網頁的 <head> 區域。以下是用法範例：
<link rel="alternate" hreflang="zh-HK" href="https://example.com/hk/" />
<link rel="alternate" hreflang="zh-TW" href="https://example.com/tw/" />
<link rel="alternate" hreflang="en-US" href="https://example.com/us/" />
<link rel="alternate" hreflang="x-default" href="https://example.com/" />
-
hreflang的值zh-TW：表示繁體中文（台灣）。zh-HK：表示繁體中文（香港）。en-US：表示美式英文。x-default：表示預設語言或未指定語言的版本。
-
href的值 指向該語言或地區版本的網址。
2. HTTP 標頭
對於非 HTML 文件（如 PDF）特別有用，可以在 HTTP 回應中包含 hreflang：
Link: <https://example.com/tw/>; rel="alternate"; hreflang="zh-TW"
Link: <https://example.com/us/>; rel="alternate"; hreflang="en-US"
3. XML 網站地圖
如果您使用 XML 網站地圖來管理多語系網站，可以這樣設置：
<url>
<loc>https://example.com/tw/</loc>
<xhtml:link rel="alternate" hreflang="zh-TW" href="https://example.com/tw/" />
<xhtml:link rel="alternate" hreflang="zh-HK" href="https://example.com/hk/" />
<xhtml:link rel="alternate" hreflang="en-US" href="https://example.com/us/" />
</url>注意事項
- 互相指向：每個語言版本都需要指向其他語言版本。例如，
zh-TW頁面需要包含對zh-HK和en-US的hreflang標籤，反之亦然。 - x-default：建議為預設語言提供一個版本，通常是主頁。
- 正確的 ISO 代碼：使用正確的語言（如
en）和地區代碼（如US），並用連字符-分隔。
適用範例場景
- 多語系網站：提供中文（台灣）、英文、日文的版本。
- 地區差異：同語言但針對不同地區（如台灣和香港）的版本。
- 電商網站：根據用戶地區顯示不同貨幣價格。
這樣設置可以提升您的 SEO 表現，確保搜尋引擎將正確的頁面呈現給適當的用戶。
![[VS Code 擴充套件] Auto Rename Tag- 變更標籤名稱時自動幫你設定前(後)標籤的內容](/assets/upload/1661686281233_0.jpg)
