同一サイトで、PCとスマートフォンが異なるURLの場合に、設定するrel属性

2013年11月29日

同一サイトだけど、レスポンシブデザインではなく、PC(パソコン)とSP(スマートフォン)で異なるURLの場合に設定しておくrel属性についてのメモ

パソコン版とスマートフォン版で異なるURLの場合は、ユーザーエージェントで該当するデバイスにリダイレクトはマストで行なっていると思います。rel属性(canonical,alternate,media)も設定しましょうよということで、下記に簡単にまとめてみました。

rel=canonical

スマートフォン版に、rel=canonical属性を利用する。
インデックスおよびランク付けのシグナル(外部のリンク等)を統合して、重複コンテンツと判断されないようにするため

<link rel=”canonical" href="対応するPC用ページのURL">

rel=alternate media

この属性を利用すると、パソコン版とスマートフォン版のURLをマッピングすることが出来るようになる。
パソコン版のページのみにこのタグを使って、スマートフォン版を特定する。
※max-widthは下記は640pxをいれているが、対応する値に変更可能

<link rel="alternate" media="only screen and (max-width: 640px)" href="対応するSP用ページのURL">

サイトマップに追加することも可能です。

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
  xmlns:xhtml="http://www.w3.org/1999/xhtml">
<url>
<loc>http://対応するPC用ページのURL</loc>
<xhtml:link
    rel="alternate"
    media="only screen and (max-width: 640px)"
    href="http://対応するSP用ページのURL" />
</url>
</urlset>

詳細は、推奨事項の詳細 – Webmasters — Google Developersをご確認ください。