alternate属性を使ってモバイル最適化

サイトを作っていく上で、同一コンテンツでPC版とスマホ版のサイトが別々のURLで存在している場合、検索エンジンに対して適切に処理してあげることで、重複コンテンツと判断されることなく、PC版とスマホ版のサイトを知らせることができます。

alternate属性を使う

alternate属性を使用することで、検索エンジンにPC版とスマホ版サイトの存在を知らせることができます。このとき、canonical属性もセットにして使う必要があります。

検索エンジンにスマホ版サイトがることを知らせるためには、PC版サイト内にalternate属性を記述します。

<link rel="alternate" media="only screen and (max-width: 640px)" href="http://www.example.com/sp/">

これでこのページには、スマホ版のページが存在しますということを検索エンジンに認識させることができます。

今度は、canonical属性を使ってPC版サイトの存在を知らせます。

<link rel="canonical" href="http://www.example.com/">

このように、スマホ版ページ内に記述することで検索エンジンにPC版の存在を認識させることができます。あとは、301リダイレクトなどを使ってUA（ユーザーエージェント）ごとにページを振り分けてあげると良いでしょう。