Canonical 在桌機、手機、AMP 要怎麼設定

現在網頁有桌機板、手機版還有 AMP 版,這些版本要設定 Canonical (for SEO)的話,應該要怎麼設定呢?

Canonical 在桌機、手機、AMP 要怎麼設定

以下是桌機為主,手機版為輔的情況,未來若 Google 推行 Mobile First 後(註:Google delays mobile-first indexing deadline to March 2021),直接叫大家都把桌機、手機使用 RWD 整合起來,若還要分三種版本,就在看看有沒有更新的建議作法了~

這邊先講簡單的結論:

  • 桌機:
    • <link rel="amphtml"> 到 AMP
    • <link rel="alternate"> 到 Mobile
  • 手機:
    • <link rel="canonical”> 到桌機
    • <link rel="amphtml"> 到 AMP
  • AMP:
    • <link rel="canonical”> 到桌機
  • 下面有更完整的範例

Google 的 Webmaster 討論區有幾篇討論可以參考:

下述摘錄自此篇:AMP Indexing FAQs - Search Console Help

If for some reason, all three of desktop, mobile, and AMP exist:

  • Desktop: point to AMP with <link rel="amphtml"> and to mobile with rel=alternate
  • Mobile: point to desktop with <link rel="canonical”> and to AMP with rel=amphtml (mobile should be equivalent in content to desktop)
  • AMP: point to desktop with <link rel="canonical”>

下述摘錄自此篇:AMP project issue: how to put canonical for website and mobile site,這篇有直接完整的範例:

  • https://www.example.com/desktop/page.html (this is the desktop version of the page) has:
    • <link rel="alternate" media="only screen and (max-width: 640px)" href="https://m.example.com/mobile/page.html">
    • <link rel="amphtml" href="https://a.example.com/amp/page.html">
    • <link rel="canonical" href="https://www.example.com/desktop/page.html">
  • https://m.example.com/mobile/page.html (this is the smartphone version of the page) has:
    • <link rel="canonical" href="https://www.example.com/desktop/page.html">
  • https://a.example.com/amp/page.html (this is the AMP version of the page) has:
    • <link rel="canonical" href="https://www.example.com/desktop/page.html">

相關網頁

作者: Tsung

對新奇的事物都很有興趣, 喜歡簡單的東西, 過簡單的生活.

在〈Canonical 在桌機、手機、AMP 要怎麼設定〉中有 1 則留言

發表迴響

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料