【Canonical URL簡介】如何避免重複內容影響SEO?

【Canonical URL簡介】如何避免重複內容影響SEO?
Welly SEO 編輯部

Welly SEO 編輯部

2022-03-01發佈

SEO優化

# 技術SEO

# SEO做法

# SEO優化

Canonical url可說是SEO人必學的知識!這篇文章包含Canonical url定義、使用情境、設定教學與注意事項,並比較Canonical url與301轉址差異,幫助你更快、更全面掌握重複內容的處理!

Canonical URL是什麼?

學習SEO的過程中,大家勢必得面臨學習許多專業用語與程式語法,其中「Canonical」是不少人會遇到的困難點,究竟Canonical URL是什麼?

Canonical url 中文:標準網址定義

Canonical URL(標準網址)又稱Canonical Tag,是一種HTML語法標籤,Canonical可以設定在搜尋結果(SERP)上呈現哪個版本的URL,以解決重複內容的網頁問題。

單看Canonical這個字就有典範、模範、標準的意思,簡單來說,Canonical Tag主要是告訴Google搜尋引擎某個網址才是原創、標準。

canonical tag是一種HTML語法標籤,寫在網頁原始碼的Head區塊:「link rel="canonical"」

圖片:canonical tag是一種HTML語法標籤,寫在網頁原始碼的Head區塊:「link rel="canonical"」

Canonical通常寫在網頁原始碼的Head區塊,提供搜尋引擎識別,主要會長「link rel="canonical"」這樣。

設定完成後,搜尋引擎將對Canonical URL版本進行檢索,並將其他網址判定為重複網址而降低檢索頻率。

所以Canonical URL有3大作用:

canonical url的用途

  • 指定SERP中要顯示的網址
  • 整合重複內容、降低負面影響
  • 避免爬蟲耗時檢索重複網頁

這麼說你可能還是有點模糊、搞不清楚,別擔心,接著跟我們往下看,就會慢慢理解了!

什麼情況需要用Canonical URL?

在實際看到Canonical URL的語法和設定教學之前,先讓我們從使用層面來了解:為什麼需要使用Canonical URL呢?

關鍵就是利用rel canonical 解決重複內容!

其實答案很簡單:因為Google不愛「重複內容」。

你可能會想說我認真遵守白帽SEO的手法在操作,我的網站怎麼會有重複內容呢?事實上,網頁存在重複頁面的情況還真不罕見!

怎麼說呢?接下來讓我們舉例來說明,假設我們可以透過以下這些網址進入同一網站的首頁:

  • https://welly.tw(https版本)
  • http://welly.tw(http版本)
  • https://www.welly.tw(https + www版本)
  • http://www.welly.tw(http + www版本)
  • https://m.welly.tw(行動裝置版)
  • http://welly.tw/?utm_source…(添加參數版,比如UTM)

對人類來說,我們大腦會自動將這些網址歸類為同一個概念,也就是Welly的首頁。

但對Google搜尋引擎來說,這些都是完全獨立的單一網址。而在Google的眼裡就會覺得很奇怪啦!怎麼從這麼多不同的網址進來,結果都是一樣的內容?

這就像菜單上有10個名稱不同的菜名,結果不管你點啥,最後上菜都是一樣的飯菜,你會不會生氣?

同理,身為以提供使用者最佳體驗自詡的Google可不樂見這種情況發生,所以勢必要針對這情況做出處置。

當搜尋引擎資料庫中出現太多重複、類似的內容時,如果沒有手動設定Canonical,Google就會自行選擇標準網址,可能導致顯示在SERP上的不是業主期望的網頁。

註:不過其實Canonical效力也非100%,只能說僅供Google參考,最終決定權還是在Google身上,這部分我們後頭再說。

更嚴重的是,如果同一時間有大量重複內容,且網址參考權重相同,這很可能讓Google認為有惡意操作的情況存在(比如抄襲),影響網頁在SERP中的曝光與排名。

Canonical URL使用情境有這些

那麼什麼情況下可能會出現重複內容網址呢?以下我們整理出幾個常見的情境:

1.產品有不同顏色、價錢、或規格

在電子商務中,我們常常遇到同一個產品因為不同顏色、價錢、規格而產生了眾多獨立網址,比如說

  • welly.tw/products/美鞋-黑色
  • welly.tw/products/美鞋-紅色

這時候每一個網頁還是有其存在必要、不能下架,就很適合用Canonical來指定標準網址,降低重複內容的負面影響,並讓Google優先顯示標準網址,比如說因業務轉換考量,你想要SERP優先顯示黑色低價版,Canonical也能同時起到作用。

2.聯合發布文章、被抄襲、文章放在不同版面下

有時候我們會與媒體業、異業合作(或是被內容農場抄襲),而導致同一時間發布同一篇文章:

  • https: //news.example.com/黑鞋-155672.html (聯合發布文章)
  • https: //blog.example.com/新款/黑鞋/3245/ (原始文章)

或是文章放在不同版面底下的時候,系統自動儲存多個網址:

  • https: //blog.example.com/所有顏色/黑鞋真好看/
  • https: //blog.example.com/黑色系/黑鞋真好看/

這時候為了不要讓原始文章的權重被分散出去,就可以透過Canonical來優先顯示主推文章。

3.為了支援多種裝置類型(如AMP、行動裝置)

因應不同裝置的顯示,有時候網址會有許多不同版本,例如AMP、行動裝置,最著名應該就是Facebook了:

  • https: //www. facebook.com/
  • https: //m. facebook.com/

這種因裝置相異而導致的多個網址,十分適合用Canonical來設定標準網址。

4.為了支援其他參數

有時候搜尋資料庫需要採用動態網址,也會導致重複內容的出現,比如:https: //www.example.com/products?category=dresses&color=green

這時候為了避免增加Google爬蟲的負擔,就可以藉由Canonical來確認哪個網頁最重要,節省爬蟲時間、提升檢索效率。

(延伸閱讀:SEO是什麼?SEO優化怎做?SEO搜尋引擎最佳化完整教學

Canonical V.S 301轉址

說到這裡,有些人可能要問了:用301轉址不行嗎?301轉址跟Canonical有什麼差異?簡單來說:

canonical vs 301轉址概念比較

301轉址處理後,原本的網頁會失效,並自動導流到新網址;Canonical URL處理後,原本的網頁不會失效,用戶依然可以查看。

另外301轉址屬於強制設定,效力十足,但Canonical則不一定,比較像是給Google參考的訊號,最終決定權還是在Google身上,所以也有可能出現Google自行判斷的可能。

總之,301轉址建議用在舊網址確認不堪用、要下架的情境,而Canonical URL則是在網頁同時都想保留時,可以運用。

更多301轉址說明,推薦閱讀:轉址是什麼?301、302轉址教學和免費工具分享!

SEO Canonical設定教學

HTML Canonical Tag語法範例

那麼Canonical URL長怎麼樣?其實Canonical URL的HTML語法相當簡單,只有一行程式碼,以Welly的《SEO公司》這篇文章為例:

<link rel="canonical" href="https://welly.tw/serp-rank-optimization/how-to-choose-seo-agency">
  • rel="canonical" 就是Canonical Tag的語法
  • href=" 後方則是填寫你要作為標準的網址

而如果你是使用Wordpress的用戶,可以透過Yoast SEO工具來設定,只要在「標準網址」欄位中填入要作為標準被收錄的網址即可。

特別注意Canonical語法的4個基本規範

canonical url的基本規範

  • 必須放在<Head></Head>區塊中
  • 1個網頁只能有1個Canonical Tag
  • 請使用Https網址而非Http網址(這是因為Google偏好Https)
  • 標準網址務必使用完整網址(包含通訊協定、網域、路徑)

電腦、移動裝置設定說明

如果是要設定電腦和行動裝置,需要使用 rel="canonical" 和 rel="alternate" 標記指明兩個網址間的關係:

電腦、移動裝置上,canonical的設定說明

  • 電腦版:加入rel="alternate" 標記,指向對應的行動版網址
  • 手機板:加入 rel="canonical" 標記,指向對應的電腦版網址

更多詳細步驟請參考Google官方說明

AMP網頁設定說明

另外AMP的設定也有類似情況,非AMP網頁和AMP網頁需要分別設定:

  • 非AMP網頁:加入rel = "amphtml"標記
  • AMP網頁:加入rel="canonical" 標記

特別留意!即使只有1頁AMP網頁也需要添加rel="canonical" 標記並指向自己,更多說明可以參考AMP官方說明

如果不認識AMP,請先參考:認識AMP網頁技術!SEO排名降低?AMP來拯救!

Canonical SEO設定注意事項

Canonical Tag檢查方法和工具

Canonical Tag設定完成後,別忘了檢查設定是否成功,這裡我們提供3種檢查方法:

1.右鍵查看網頁原始碼

查看網頁原始碼以檢查canonical tag

電腦可以右鍵選擇「檢查」>「Elements」,使用Ctrl+F(Mac版本用command+F)叫出搜尋工具,並輸入「Canonical」即可查看。

2.使用線上免費檢查工具-Canonical Tag Test

使用線上免費檢查工具Canonical Tag Test來檢查canonical設定

Canonical Tag Test是國外開發的SEO工具,只要貼上網址即可檢查語法設定。

開啟Canonical Tag Test

3.藉由Google Search Console定時檢視

最後,由於Canonical Tag並非強制效力,所以你也可以透過Google Search Console的「涵蓋範圍」>「排除」>「這是重複網頁;Google 選擇的標準網頁和使用者的選擇不同」來確認網站上有沒有發生Google認定與我們設定不同的情況。

(延伸閱讀:Google Search Console教學,掌握4點快速安裝與使用!

請小心避免SEO Canonical常犯錯誤

1.Canonical邏輯混亂

canonical 錯誤邏輯示範

如果出現網頁A標準網址指向網頁B,B又指回A,或網頁A連到網頁B,網頁B連到網頁C,這樣會形成迴圈和邏輯混亂,導致Google難以判斷哪一個才是真正的標準網址。

建議應該選定好一個標準網址後,將其他含有類似內容的網頁都指向該標準網址。

2.不要所有網頁標準網址都指向同一個網頁

Canonical Tag設定會影響爬蟲檢索頻率,當你把官網底下所有網頁都指向同一個標準網址,其他被認定為重複的網頁檢索頻率會下降,導致其他網頁排名受影響喔!

3.避免robots.txt 、noindex誤用

請勿將robots.txt和noindex用於標準網址和相關重複網頁,這會導致網頁排除在選擇範圍之外,產生指令矛盾。

(延伸閱讀:robots.txt免費教學!傻瓜都懂的撰寫與檢測範例!

以上我們將Canonical url的定義、使用情境、設定教學到注意事項的各項重點教給大家。

如果你遇到更艱澀的問題且找不到答案,我們Welly團隊內建專業工程師,不妨透過下方按鈕與Welly團隊聯繫洽詢!

最值得擁有的專業行銷團隊!現在就與Welly一起透過SEO優化提升業績吧!

熱門文章

編輯精選

最新文章

hello@welly.tw

02-77305901

台北市復興北路150號10樓-6

welly logo vertical

Copyright © 2022 偉利科技股份有限公司 All rights reserved.