alternateタグとcanonicalタグを正しく使ってスマホサイトの存在を伝えよう
ウェブサイトを運営していて、デクストップ用サイトURLとスマホ用サイトのURLを分けている場合あります。
この場合、きちんと検索エンジン向けに設定を行わないとスマホ用サイトの存在を認識してくれないケースがあります。
今回は、URLをデスクトップとスマホで分けて運用しているページの対策方法を解説していきます。
Googleがサポートするデスクトップ用サイトとスマホ用サイトの最適化方法は3種類ある
-レスポンシブデザイン
- 動的配信(UA別にHTML分けたりCSS分けたり)
- URLをわける
この3つの方法をGoogleはサポートしているのですが、レスポンシブデザインと動的配信はURLがデスクトップ用サイトとスマホ用サイトで変わらないので、現時点で特に何かする必要は(2015/5/15)はありません。
対策をしなければいけないのは、URLを分けた場合です。
URLを分けている場合の対策方法
URLを分けている場合というのは具体的には以下のようなURLの場合です。
-デスクトップ用URL:http://www.hogehoge.com/
-スマホ用URL:http://sp.hogehoge.com/
UA(ユーザーエージェント)でURLを出し分けると上記のような実装が可能です。
こういった場合、それぞれを適切に設定することで正しくgooglebotに認識してもらうことができます。適切な設定をしていない場合、スマホ用サイトのインデックスが遅れたり、重複ページと認識されることもあります。
1.alternateタグを使う
alternateタグというのは、googlebotにスマホ用サイトの存在を知らせるためのタグとなります。クローラーがデスクトップ用サイトを訪れたとき、このalternateタグが設定されていると、スマホ用サイトの存在を知ることができます。
link rel="alternate"タグはデスクトップ用サイトの該当ページのソースコードの中に、
<link rel="alternate" media="only screen and (max-width: 640px)" href="http://sp.hogehoge.com/" />
と、記述します。
2.canonicalタグを使う
そして、上記で指定したスマホ用ページのソースコードの中に、
<link rel="canonical" href="http://www.hogehoge.com/" />
と記述します。
これは、「このスマホ用ページはデスクトップページのスマホページです。」とgooglebotに伝えることになります。
リダイレクト設定をする
デスクトップ用トップページとスマホ用トップページ、デスクトップ用記事ページとスマホ用記事ページなど、それぞれをUA別にリダイレクト設定しましょう。
デスクトップ用ページだけあって、スマホ用ページを持っていないURLの場合は、リダイレクトするページがないわけですからしないほうがいいです。
全てをトップページにリダイレクトするなどの対処法は、「間違ったリダイレクト」として、Googleはランキングでマイナス影響を与えると明言しています。
レスポンシブデザインの実装を検討しよう
上記色々と設定方法を解説しましたが、リダイレクトやcanonicalなどはミスをすると全く検索結果に表示されなくなることもあるなど、リスクもある方法です。
こういったミスを減らすためにも、Googleはレスポンシブデザインを推奨しています。
ケーススタディ
Q.デスクトップ用サイトにはあるが、スマホ用サイトには無いページがあります。この場合のalternateタグはどうしたらいいですか?
A.alternateタグは、canonicalと1対1の構成で使うため、スマホページがない場合は無理して使う必要はありません。
まとめ
いかがでしたでしょうか。
今回はスマホ用ページとデスクトップ用ページでURLが分かれている場合の対処法についてご紹介しました。
スマホサイトへのアクセスを集めるためにも、canonicalタグとalternateタグを正しく設定をしましょう。
このニュースを読んだあなたにおすすめ
SEO対策に関するカリキュラム
SEOはURLの正規化が重要
コンテンツSEOにおける魅力的なコンテンツの作り方