在 HTML Meta Tags 攻略一文中，我們介紹到了 Hreflang Tag 是向搜尋引擎說明不同語種、地區的網頁版本之間的關係。對於經營多語系網站、經營跨國 SEO 的 SEOer 來說，這是個相當重要的 Meta 標籤！以下為大家整理 Hreflang 全資訊，從觀念、實際撰寫到多語系網站的應用一次帶你看！
若網站在不同地區經營，會有對應語種的版本。但你是否想過，搜尋引擎是如何根據搜尋用戶的所在地區，給予對應語言的網頁呢？以 Apple 官方網站為例，若用戶在台灣進行搜尋「Apple」，會得到台灣版本的結果（參下圖）：
如果是德國的用戶在 Google 搜尋「Apple」則會得到德國版本的結果（參下圖）：
在台灣進行搜尋，Google 並不會給予德國版的網站，這除了搜尋引擎預設的語言影響外，Hreflang 標籤也發揮了很大的作用。Hreflang 會協助搜尋引擎判斷網頁對應的國家地區以及語系，以提供給該語系的使用者相符結果頁面、滿足其搜尋需求。
而為什麼 Hreflang 對於 SEO 很重要呢？最直覺來說，提供使用者他們看得懂的內容會直接影響網頁的點擊率、停留時間、跳出率等排名要素。另外還有一個很常被忽略的因素：避免被視為重複內容。
➤ 了解更多 SEO 影響要素：SEO 是什麼？2023 SEO 搜尋引擎優化指南，5分鐘了解 SEO 行銷！
同樣以 Apple 的網站舉例來說，法國與加拿大法語區的用戶搜尋分別會得到「法國法語」以及「加拿大法語」的搜尋結果。以語種來看，兩邊網站內容大致會是一樣的（都以法語撰寫），但仍有部分內容根據當地狀況而不同（例如：商品計價的貨幣、當地銷售據點）。若沒有針對這兩種版本設定 Hreflang，搜尋引擎很可能會因為大部分內容相同而判定其為重複內容，在使用法語用戶進行搜尋時只給予其一的搜尋結果；Hreflang 則可以向搜尋引擎宣告不同語系、不同地區網站的關係，並建立關聯性。
➤ 了解重複內容對 SEO 的影響：善用 Canonical 語法，避免網站重複內容影響 SEO 排名
網站什麼時候需要設定 Hreflang 標籤呢？主要可以分為三種情境：
如政府單位或國際組織，向不同語種的使用者提供資訊。
如跨國電商平台，在不同地區提供服務。
多為航空公司或大型跨國公司，如上面提到的 Apple。
從 Apple 的例子可以看到，Hreflang 屬性由兩個參數所組成：語言與地區，兩者之間以「-（連字號）」進行分隔。以中文版網站為例，「zh」代表的是中文、「TW」代表台灣、「HK」代表香港。透過兩種不同參數便可以組成對應語種的 Hreflang 標籤。目前語言代碼採用 ISO 639-1 格式；地區代碼採用 ISO 3166-1 Alpha 2 格式。
介紹完 Hreflang 使用的情境與組成之後，接下來跟大家分享 Google 官方文件建議的三種設定 Hreflang 方式。請注意，官方文件有特別說明這三種方式取其一進行就好，三個方式都設定並不會讓效果特別好喔！
第一個方式是在 HTML <head> 區塊新增 Meta Hreflang 標籤。實際語法為：
<head>
…
<link rel=”alternate” href=”網頁 URL” hreflang=”語言代碼”>
…
</head>
以 Ranking 為例，若要宣告網站主要提供給台灣使用中文的用戶，可以撰寫以下語法：
<head>
…
<link rel=”alternate” href=”https://ranking.works/” hreflang=”zh-TW”>
…
</head>
設定於 HTTP 標頭，當使用者送出了 GET 的請求給網頁時，網頁能根據其請求的語種回傳對應的版本。此種方法適用於非 HTML 的檔案類型（如 PDF），寫法如下：
Link: <檔案 URL (語種1)>；rel=”alternate”； hreflang=”語種1”,
<檔案 URL (語種2)>；rel=”alternate”； hreflang=”語種2”,
<檔案 URL (語種3)>；rel=”alternate”； hreflang=”語種3”
若 Ranking 提供了一份 SEO 白皮書（.pdf），分別有中文（台灣）、英文（不指定地區）、日文（不指定地區）三種版本，就可以設定下語法：
Link: <http://ranking.works/tw/file.pdf>；rel=”alternate”； hreflang=zh-TW”,
<http://ranking.works/en/file.pdf>；rel=”alternate”； hreflang=”en”,
<http://ranking.works/jp/file.pdf>；rel=”alternate”； hreflang=”jp”
最後一個方式，是可以使用 XML Sitemap 告知搜尋引擎網站語言和地區的版本變化。其作法是在 Sitemap 中新增 <loc> 元素來指定網址，並列出每個版本的 <xhtml> 子元素。
➤ Sitemap 基本概念：Sitemap是什麼？一次掌握Sitemap網站地圖製作與提交流程！
以下以 Google 官方文件的網站示意為例：假設有一個網站向英文使用者提供英文內容、向德文使用者、瑞士地區的德文使用者提供兩種德文版網頁，且三者內容相同。
那麼這三個網頁的 Sitemap 寫法會如下：
<?xml version=”1.0″ encoding=”UTF-8″?>
<urlset xmlns=”http://www.sitemaps.org/schemas/sitemap/0.9″
xmlns:xhtml=”http://www.w3.org/1999/xhtml”>
<url>
<loc>https://www.example.com/english/page.html</loc>
<xhtml:link
rel=”alternate“
hreflang=”de“
href=”https://www.example.de/deutsch/page.html“/>
<xhtml:link
rel=”alternate“
hreflang=”de-ch“
href=”https://www.example.de/schweiz-deutsch/page.html“/>
<xhtml:link
rel=”alternate“
hreflang=”en“
href=”https://www.example.com/english/page.html“/>
</url>
<url>
<loc>https://www.example.de/deutsch/page.html</loc>
＃同上 <xhtml> 區塊寫法
</url>
<url>
<loc>https://www.example.de/schweiz-deutsch/page.html</loc>
＃同上 <xhtml> 區塊寫法
</url>
</urlset>
說明完了實際語法，另有 3 個很常被忽略的眉角需要注意。這些細節會對 Hreflang 的影響很大，請務必注意！
Hreflang 的標籤是互相指向的，什麼意思呢？如果網站有三個語種的版本，在這三個語種的 Hreflang 設定中，都要設定三個網址的 Hreflang。若忽略任何一條指向，Hreflang 是不會發會作用的。
舉例來說，若 Ranking 提供三個語種版本，分別為中英日文，在三個網站中都應該設定如下語法：
<link rel=”alternate” href=”https://ranking.works/tw/” hreflang=”zh-TW”>
<link rel=”alternate” href=”https://ranking.works/en/” hreflang=”en”>
<link rel=”alternate” href=”https://ranking.works/jp/” hreflang=”jp”>
❌錯誤示範：若中文少設定了自己的網址，只設定英文與日文
<link rel=”alternate” href=”https://ranking.works/en/” hreflang=”en”>
<link rel=”alternate” href=”https://ranking.works/jp/” hreflang=”jp”>
就算英文版與日文版有設定 hreflang=”zh-TW” ，也會因為中文版沒有設定能夠被指向的 Hreflang 標籤，而無法發揮效果。
語言與地區代碼切記要依循規範，若輸入錯誤（把中文輸入成「zg」等不存在的代碼）可不會有人提醒你喔！另外，一個網址只能對應一種語種，才不會導致搜尋引擎判斷失效
❌錯誤示範：中文版網址對應到了兩個語種
<link rel=”alternate” href=”https://ranking.works/tw/” hreflang=”zh-TW”>
<link rel=”alternate” href=”https://ranking.works/tw/” hreflang=”jp”>
設定 x-default 屬性會讓網頁在沒有使用者搜尋的語種版本時，被導向對應設定的網頁。沒有設定 x-default 並不影響已設定的 Hreflang 標籤發揮作用，但 Google 官方文件是建議要設定此屬性喔！
舉例今天若有俄文使用者搜尋 Ranking，因為 Ranking 沒有提供俄文的版本，若我們設定 x-default 對應的網站是英文版的，則俄文搜尋的用戶就會被導向英文版。
<link rel=”alternate” href=”https://ranking.works/tw/” hreflang=”x-default”>
介紹完 Hreflang 後，我們也整理了多語系網站的應用給讀者們參考，包含了網址不同設定的方式與其特點，最後也有兩間企業網站的實際案例，看完就能更理解多語系網站是如何運作的！
直接透過網址參數進行區分，延續上方 Ranking 網站中英日的假設：
此方式貌似滿清楚的，但缺點是會和其他參數混雜，如 utm、fbcid 等。若進行網站資料分析容易受到影響。
同一組網址開不同資料夾，即不同語種網頁實際上是在一樣的網址：
所有語種建立在同樣的網址上，等於 SEO 成效能被共享，因此是操作 SEO 建議的方式！
子網域可以指向不同主機，便於技術人員管理，且能獲得不同的技術資料以便分析。
ccTLD 全稱「國家和地區頂級域，country code top-level domain」，字面上便知是以國家作為分界的域名。可以參考這邊的國家頂級域名單。
使用 ccTD 對當地 SEO 操作很有利，不過建議在開始建置網站時就得先規劃好、買好網域。若後期才想以此方式，可能會有架構不合或是網域被買走的狀況。
從上圖可以看出，Apple 網址設定上是採用不同資料夾的方式，便於累積 SEO 成效。且排序明確、設定清楚，高達上百個語種設定卻不會讓人混亂，不妨可以參考！
* The website and the photos credited to Pinkoi
Pinkoi 採取的則是子網域的做法，使用者也能主動在網頁上選擇想要瀏覽的語言進行切換。不同語種的內容呈現上也所不同，利於不同地區的在地化經營。
以上是關於 Hreflang 與多語系網站的相關內容。可以發現，不管在 Hreflang 的標籤設置上，或是在網址架構的安排上都有許多細節要注意，一有忽略便可能影響 SEO 甚至整個網站架構！
若對於跨國 SEO 有操作上的需求，Ranking 提供了網站建置與跨境 SEO 操作，由專業的團隊與技術同仁打造完整服務，協助你建置最完整的多語系網站服務，點此預約諮詢：SEO 服務專案＆網站建置。
期許用深入淺出的方式帶你進入 SEO 世界，提供實用性高的優質文章，簡化 SEO 複雜流程及技術，讓每個人都能快速理解 SEO 行銷，一起登上 Ranking 火箭讓排名再創高峰！※若有行銷相關問題或者業務合作歡迎隨時與我們聯繫！
想透過 SEO 提升品牌曝光度及網站流量，並獲得更多商機嗎？
SEO 專家｜Ranking 提供全方位解決方案，讓你排名一飛沖天！
