rel=canonical 的 5 大常見錯誤

2013 年 4 月 8 日，星期一

在您的網頁中加上 rel=canonical 連結，可以明顯提示搜尋引擎，讓系統瞭解在網路上出現重複網頁時，您偏好編入索引的版本。它支援多個搜尋引擎，包括 Yahoo!、Bing 和 Google。rel=canonical 連結可整合重複內容 (例如內部連結) 的索引資源，也可以指定要在搜尋結果中顯示的網址。不過，如果 rel=canonical 設定不當就無法明確提示搜尋引擎，因此狀況會有點棘手。

範例：網頁及其 rel-canonical 的 HTML 標記。

網站管理員在瀏覽器中看到的是「red velvet」頁面 (左圖)，但搜尋引擎卻發現網站管理員不想顯示的「blue velvet」rel=canonical (右圖)。建議您使用 rel=canonical 時採取下列最佳做法：

  • 重複網頁的大部分內容應該出現在標準版本中。
  • 仔細檢查您的 rel=canonical 目標是否存在 (並非錯誤或「soft 404」)。
  • 確認 rel=canonical 目標不含 noindex robots meta 標記。
  • 確認您希望在搜尋結果中顯示 rel=canonical 網址，而非重複網址。
  • 在網頁的 <head> 或 HTTP 標頭中加入 rel=canonical 連結。
  • 請勿在單一網頁上指定多個 rel=canonical。如果指定多個 rel=canonical 連結，系統會全數忽略。

錯誤 1：將 rel=canonical 指向一系列分頁的第一頁

假設您有一篇文章跨多個頁面顯示：

  • example.com/article?story=cupcake-news&page=1
  • example.com/article?story=cupcake-news&page=2
  • 以此類推

將第 2 頁 (或任何後續的頁面) 中的 rel=canonical 指向第 1 頁，並不是正確使用 rel=canonical 的方式，因為這些頁面並非重複網頁。在這個例子中，使用 rel=canonical 會導致第 2 頁之後的內容完全無法建立索引。

範例：錯誤的 rel-canonical 標記。
如果從元件頁面中將 rel=canonical 指向一系列分頁的第一頁，那麼網頁中的一些實用內容 (例如「cookies are superior nutrition」和「to vegetables」) 將會遺失。
範例：使用 rel-canonical 為一系列網頁加上註解，指向單一網頁與該系列的所有內容。
將元件頁面中的 rel=canonical 指向「查看全部」頁面
範例：使用 rel-canonical 和已淘汰的 rel-prev-next 為網頁加上註解。
如果 rel=canonical 沒有指向「查看全部」頁面，分頁內容可以使用 rel="prev" 和 rel="next" 標記。

錯誤 2：將絕對網址誤寫成相對網址

範例：rel-canonical 標記有誤 - 錯誤的相對網址

<link> 標記就跟許多 HTML 標記一樣，可接受相對網址和絕對網址。相對網址包含的是「相對」於目前網頁的路徑。例如，images/cupcake.png 表示「從目前的目錄前往 images 子目錄，然後再前往 cupcake.png」。絕對網址則會指定完整路徑，包括 https:// 等架構。

指定 <link rel=canonical href="example.com/cupcake.html" /> (沒有 https://，因此是相對網址) 表示偏好的標準網址是 https://example.com/example.com/cupcake.html，但我們幾乎可以確定這不是想顯示的網址。在這種情況下，我們的演算法可能會忽略指定的 rel=canonical。也就是說，無論您希望使用此 rel=canonical 達成什麼目標，都無法實現。

錯誤 3：非預期或多次宣告 rel=canonical

我們有時會看到非預期的 rel=canonical 標示。在極少數情況下，我們發現這只是單純的拼寫錯誤，但多數情況是因為忙碌的網站擁有者會自行複製網頁範本，而忘記變更 rel=canonical 目標所致。現在，網站擁有者的網頁都會指定 rel=canonical，指向範本作者的網站。

範例：rel-canonical 標記有誤 - 網址不正確

如果您使用範本，請確認沒有一併複製 rel=canonical 規格。

另一個問題是，如果網頁包含多個指向不同網址的 rel=canonical 連結，就會時常發生這種情形。這通常與搜尋引擎最佳化的外掛程式有關，這類外掛程式經常插入預設的 rel=canonical 連結，安裝外掛程式的網站管理員可能也不清楚這個情況。如果多次宣告 rel=canonical，Google 可能會忽略所有 rel=canonical 提示。這樣一來，就無法享有合理使用 rel=canonical 所帶來的種種好處。

在上述兩種情況下，仔細檢查網頁的原始碼將有助於修正問題。rel=canonical 連結可能會分散出現，因此請務必查看整個 <head> 部分。

範例：rel-canonical 標記有誤 - 多個 rel-canonical 註解。

查看網頁的原始碼，藉此檢查外掛程式的行為。

錯誤 4：在類別或到達網頁上讓 rel=canonical 指向精選文章

假設您經營一個甜點網站，甜點網站具有實用的類別頁面，例如「pastry」和「gelato」。類別頁面每天都會主打專屬文章。舉例來說，pastry 的到達網頁可能主打「red velvet cupcakes」。「pastry」類別頁面的內容幾乎與「red velvet cupcake」頁面幾乎完全相同，因此您在類別頁面中新增 rel=canonical，並指向精選的個別文章。

如果我們接受這個 rel=canonical，您的 pastry 類別頁面就不會顯示在搜尋結果中。這是因為 rel=canonical 指出您偏好搜尋引擎顯示標準網址，而非重複網址。不過，如果您希望使用者能夠同時找到類別頁面和精選文章，建議只在類別頁面上新增自我參照的 rel=canonical，或是完全不新增。

範例：rel-canonical 標記有誤 - 網頁的非授權網址

提醒您，標準標示也會隱含偏好的顯示網址。請避免將類別或到達網頁中的 rel=canonical 加入精選文章。

錯誤 5：<body> 中的 rel=canonical

rel=canonical 連結標記只能出現在 HTML 文件的 <head> 中。此外，為避免 HTML 剖析問題，建議您盡早在 <head> 中加入 rel=canonical。當 <body> 中遇到 rel=canonical 標示時，系統會忽略該標示。

這項錯誤很容易修正，只要盡早仔細確認 rel=canonical 連結一律位於網頁的 <head> 中即可。

範例：rel-canonical 標記有誤 - HTML 內文元素中的 rel-canonical 註解。

系統會處理 <head> 中的 rel=canonical 標示，而非 <body>。

結論

如要建立有價值的 rel=canonical 標示，請注意下列事項：

  • 確認重複網頁的主要文字內容也出現在標準網頁。
  • 確認 rel=canonical 只有指定一次 (如果有指定)，且位於網頁的 <head> 部分。
  • 檢查 rel=canonical 是否指向包含實用內容的現有網址 (即非 404，或更糟的 soft 404)。
  • 避免在到達網頁、類別頁面和精選文章中指定 rel=canonical，因為這會讓搜尋結果優先顯示精選文章。

如有其他問題，歡迎隨時前往網站管理員說明論壇提出。

作者：索引團隊軟體工程師 Allan Scott