現在網頁有桌機板、手機版還有 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">
相關網頁
- Prepare your page for discovery and distribution - amp.dev
- Separate URLs | Google Developers
- 行動版網址必備的 rel="canonical" 標記仍應加到行動版網頁的 HTML 中