Googleの公式ブログの投稿検索結果をもっとモバイル フレンドリーにで公式発表があったことで、焦りを感じているサイト担当者様は結構いるのではないでしょうか?
2015年4月21日(前後)から、スマホ対応させていないサイトは、スマートフォンでの検索順位がガクッと落ちてしまう可能性があります。
当社で調べたところ、業種によっては、主要キーワード上位に来ているサイトのほとんどがスマホ対応をしていない業種もありました。
ということは、逆に言えば、検索順位で勝てなかった競合サイトを出し抜けるチャンスでもあるということです。
簡単に言ってしまうと、スマホに最適化されたサイトに改装することで、競合よりも検索順位をあげることができるのです。
もちろん、パソコンでの検索順位はいままで通りですが、ユーザーのスマホ需要は年々増えてきており、すでにパソコンからよりもスマホからの流入が多くなっているサイトはどんどん増えてきています。
世の中がスマホ対応で進む中、未対応のままだと時代に取り残されてしまうという恐ろしい事態にもなりかねません。
とはいえ、何をしたらスマホ対応になるのかわからない!という声もかなり聞いています。
確かに、サイトによってなにをすればスマホ対応ができるのかはそれぞれ違ってきます。
まずは現状を把握して、どのような施策をすればいいのかを見極めることが大切です。
ホワイトベアー株式会社では、無料お見積りと同時に、なにが現状問題なのかを診断いたしますので、お気軽にお問い合わせください!
問い合わせの前に、一体どんなことができるのかある程度理解しておきたい、というご担当者様のために、スマホ対応の基礎を書いていきたいと思います。
スマートフォン非対応サイトへの警告
Googleは、2015年1月からスマートフォン対応していないサイトに対して、ウェブマスターツール宛に以下のような警告文を送ってくるようになりました。その中に『ランク付け』という言葉があり、順位に関わることを示唆しています。
Google のシステムは、貴サイトの◯ページをテストし、そのうちの◯%に重大なモバイル ユーザビリティ上の問題を検出しました。
この◯ ページの問題の影響で、モバイル ユーザーは貴サイトを十分に表示して楽しむことができません。これらのページは Google 検索でモバイル フレンドリーとは見なされないため、スマートフォン ユーザーにはそのように表示、ランク付けされます。
しかしながら、現時点では、スマートフォン対応していないサイトであっても、順位に差異が見られないサイトも数多くあるため、今後徐々に順位へ反映されていくと考えられます。
Googleのジョン・ミューラー氏もSNS上でコメントしており、現状は実験している途中であると言及しています。
警告の対処方法
まだ、スマートフォンの順位に影響しないようですが、対策を早めに進めておくにこしたことはありません。以下は、警告メールの原因と対処方法になります。
- ビューポートが設定されていない
meta viewportタグを設置します。
参考サイト:ビューポートを設定する
- フォントサイズが小さすぎる
フォントサイズを読みやすい大きさに設定します。Googleは16CSSピクセルを推奨しています。
参考サイト:読みやすいフォント サイズを使用する
- タップ要素同士が近すぎる
リンクやボタンが小さかったり、近すぎる状態です。ユーザーが別のボタン等を誤って押さないように、ボタンは大きく、十分間隔を取ることが必要です。
参考サイト:タップ ターゲットのサイズを適切に調整する
- コンテンツのサイズがビューポートに対応していない
meta viewportタグを設定する場合、指定されたビューポートに合わないページを誤って作成してしまった状態です。 以下に気をつけるように設定します。
- 大きな固定幅の要素を使用しない
- 特定のビューポートの幅に依存しないようにする
- CSS メディア クエリを使用して、小さい画面と大きい画面で異なるスタイルを適用する
参考サイト:コンテンツのサイズをビューポートに合わせる
警告メール以外で注意する要素
また、今回の警告メールと関係はありませんが、以前からスマートフォンの順位に影響するとGoogleから発表されている要素が以下になります。もし、現時点でPCとスマートフォンの検索順位が異なる場合は、まず以下の要素を調べてみることをおすすめします。
- リダイレクト設定
別URLでスマートフォンページを作成している場合、ユーザーエージェントの振り分けを行います。この振り分けは、PCページと対になるスマートフォンページにリダイレクトさせますが、設定を間違えて全てスマートフォンのトップページへリダイレクトしてしまった場合順位に影響が出る可能性があります。
- ページスピード
PCにも導入されているアルゴリズムですが、スマートフォンにもページの読み込みスピードに関するアルゴリズムがあり、遅いと順位に影響が出る可能性があります。
- 相互リンク
スマートフォンページからPC向けページ(PCにからスマートフォンにも)にリンクを設定する場合があります。例えば、スマートフォンページの全てのページからPCページのトップページへのリンクを設置すると順位に影響が出る可能性があります。
- スマートフォンだけに404エラーを返す
PCからスマートフォンページへリダイレクトを行う際に、スマートフォンページだけに404エラーを返している状態です。スマートフォンページが404にならないようにページを用意する等の修正が必要になります。
- 再生できないコンテンツ
Flashなど一般的にスマートフォンが再生出来ないページがあります。スマートフォンページにはHTML5を等スマートフォンでも表示出来るコンテンtルを用意する必要があります。
詳細はよくあるミスを回避するを参照して下さい。
スマートフォンSEOチェックツール
スマートフォンの順位が低い理由がいまいち分からない場合は、Googleの出している以下2つのツールを利用すると原因が分かるかもしれません。
ページの設計がモバイル フレンドリーかどうか判定できます。
※モバイルフレンドリーの対策と解説はこちらを御覧ください。
ページスピードやユーザーエクスペリエンスについて確認出来ます。
スマートフォンデザイン別の対策
スマートフォンには3種類のデザインがあります。ここでは、スマートフォンのデザイン別の対策について紹介したいと思います。
- レスポンシブウェブデザイン(RWD)
Googleが推奨しているデザインです。どの端末に対しても同じHTMLコードを配信(URLは1つ)しているため、他の方法に比べて技術的な敷居が低い為です。
- 動的な配信(ダイナミックサービング)
ページをリクエストするユーザーエージェント(UA)に対して、異なるHTMLコードを配信(URLは1つ)します。
このタイプを選ぶ場合には、以下の記述を.htaccessに記載する必要があります。Googleのクローラーに対して『このページはユーザーエージェントによって内容が変わります』という情報を通知する為の記述です。
Header set Vary User-Agent
- 別々のURL
PCページとモバイルページでHTMLが異なり、URLも異なります。
PCとスマートフォンが独立しているため、リダイレクトとアノテーションの設置(PC側にrel="alternate"、スマートフォン側にrel="canonical"を設置)が必要になります。
まとめ
モバイルフレンドリーについては、今のところ順位への影響は見られませんが、今後ユーザー体験を順位の指標に入れることはかなり可能性としては高いと思われます。
お早めにスマホの最適化することをおすすめします。