多國語標籤 hreflang 設定方式

2017-03-28
1. 透過link標籤直接嵌入網頁中
 
我是用sublime text來做的,不過其他編輯器應該也有一樣的做法,可能要研究一下。
我的作法是尋找每一頁的
 
< head>
< link rel="alternate" href="英文版絕對路徑" hreflang="x-default" />
< link rel="alternate" href="英文版絕對路徑" hreflang="en" />
< link rel="alternate" href="繁中版絕對路徑" hreflang="zh-TW" />
< link rel="alternate" href="日文版絕對路徑" hreflang="ja" />
< link rel="alternate" href="越文版絕對路徑" hreflang="vi" />

先下載所有的html到自己的電腦中,以英文版頁面為主,然後搜尋相對應的語系頁面

取代about.html頁面的方法如下
 
搜尋條件:
本機HTML路徑資料夾(如: D:AppServwwwaecopack.comen),本機繁中版路徑資料夾(如: D:AppServwwwaecopack.com w),本機繁中版路徑資料夾(如: D:AppServwwwaecopack.comjp),本機繁中版路徑資料夾(如: D:AppServwwwaecopack.comvm),檔案名稱(如: about.html)
 
然後尋找標籤

< head>

取代為以下 (hreflang = '語言代碼-國家代碼') 如無國家代碼就直接寫語言代碼就好,底下有提供代碼查詢的wiki連結

< head>
< link rel="alternate" href="http://www.aecopack.com/en/about.html" hreflang="x-default" />
< link rel="alternate" href="http://www.aecopack.com/en/about.html" hreflang="en" />
< link rel="alternate" href="http://www.aecopack.com/tw/about.html" hreflang="zh-TW" />
< link rel="alternate" href="http://www.aecopack.com/jp/about.html" hreflang="ja" />
< link rel="alternate" href="http://www.aecopack.com/vm/about.html" hreflang="vi" />

此時sublime text會回饋尋找到併取代完成的頁面,如果三個語系都有相對應的about.html,則取代的數量就會是4個檔案
 
如果遇到檔案名稱沒有相對應這時候就看檔案名稱是什麼,在搜尋條件中置入檔案名稱即可,以下為取代實作的畫面
 

 
這種做法如果是在語系相對應頁面都有對應的狀況下,只要針對目標語系的頁面來做不會花太久時間,以集泉來說,每個語系都有97頁,這個取代工作就需要做97次,但只少不用到每個語系都要重複做

NOTE: 關於x-default需要注意的是,所有相對應頁面的值都應該是要一樣的,如果預設值為英文版,那不論有多少語系頁面,x-default的值全部都要設置為英文版路徑


 
2. sitemap索引
 
另外還可以透過sitemap.xml來做,如果頁面很多,又或者對應很混亂,可以考慮寫在sitemap.xml裡面
這邊有個線上工具可以參考
https://www.themediaflow.com/tool_hreflang
 
這是把相對應的路徑編輯到csv檔案中,第一行放語言代碼,之後每一行就是頁面路徑,以列來分開各語系路徑
上傳後就可以得到一個壓縮資料夾,裡面有combined.xml就是合併所有語系對應頁面的xml檔案,把這個丟給google search console去index就可以了
 
不過這個方始要注意的是,往後有新增或修改頁面名稱,都要記得更新sitemap.xml
 
附加檔案為範例檔案給您參考
 
然後集權已經有抓到hreflang的資料囉,你可以去看一下google search console

相關資源: 

CSV轉sitemap工具: https://www.themediaflow.com/tool_hreflang
測試hreflang工具: https://app.hreflang.org/
另一個CSV轉sitemap工具: http://www.aleydasolis.com/en/international-seo-tools/hreflang-tags-generator/
語言代碼ISO_639-1: https://zh.wikipedia.org/wiki/ISO_639-1
國家代碼ISO 3166-1: https://zh.wikipedia.org/wiki/ISO_3166-1

Contact

Github

Codepen

歡迎參觀我的賣場
© 2013 Copyright Digishot Web | Design Tools
Visitors【123286】
digishot webdesign studio