最新記事 by スガツヨ (全て見る)
- 最近の職場環境を紹介！ブラックフライデーで新型ノートPCを購入 - 2024年12月15日
- 激動の時代に若い人は遊んでる暇はない｜若いうちに一生分を稼ぎきろう - 2024年11月18日
- 自分のビートを刻め！僕が日々行う仕事のモチベーションを上げる方法 - 2024年11月11日
- 過去に興味は無い。未来にも興味は無い。あるのはこの1分、兵隊の1分。 - 2024年10月6日
- 月500万円以上の利益を達成｜綺麗な花を花壇いっぱいに咲かせるために生き急ぐ - 2024年9月30日
1.Webサイトのモバイル対応は必須
Webサイトの「使いやすさ」は、Googleの表示順位に影響する要素です。すでに検索におけるモバイルユーザーの比率うはパソコンを上回っているため、今後はパソコンではなくスマートフォンをメインに「使いやすさ」を考慮する必要があります。
モバイルユーザーの使いやすさ
モバイルユーザーの増加によって、Webサイトのモバイル対応は必須の要素です。すでに検索では半数以上がスマートフォンユーザーとなっており、ユーザーの利用環境によって、Googleも検索アルゴリズムを愛良しています。
近い将来モバイルファーストインデックスに切り替わる
2015年にGoogle派モバイルフレンドリー（モバイルに対応した）コンテンツを、ランキングシグナルに加えることを発表しました。詳細は後ほどお伝えしますが、スマートフォンで使いやすいかどうかが、モバイル検索結果の順位に影響します。
マラ、2016年11月には「モバイルファーストインデックス」に向けた実験を開始すると発表しており、実現すると、今後のモバイルコンテんつをメインに評価するようになります。
現在のWebサイトの状態を確認する
今後、モバイル対応が必須になるにしても、まずは自身のWebサイトの状況を把握しておくことが大切です。
一般消費者向けのビジネスのWebサイトでは、モバイルユーザーが圧倒的に多いケースもあります。
逆に企業向けのビジネスの場合は、パソコンユーザーが圧倒的に多い傾向もおあります。自身のwebサイトのユーザー傾向を調べるには、 Googleアナリティクスで確認することができます。
あわせて読みたい
2.モバイルフレンドリーを優遇するアルゴリズム
検索の半分以上がスマートフォンユーザーであるという現状を考えると、Webサイトのモバイル対応は必要不可欠になりつつあります。ここでは、表示順位への影響と、モバイルフレンドリーのチェック要素について後述します。
モバイルフレンドリーアップデートとは？
2015年4月にモバイルアップグレードが開始されました。それにより、モバイル検索においてはモバイルフレンドリーでなWebページの表示順位が向上し、逆にモバイル対応になっていないWebページは表示順位が下がりました。
2016年3月には、モバイルフレンドリーなWebサイトを優遇するアルゴリズムを、段階的に強めていくことを公式にアナウンスしています。
このアルゴリズムは、ページ単位で影響し、仮に「モバイルフレンドリーではない」と認識され順位が下がっても、そのページをモバイルフレンドリーにすれば、本来の評価に戻ります。
また、質の高いコンテンツであれば、モバイル対応でなくとも上位表示される場合もあります。
モバイルフレンドリーのチェック要素
モバイルフレンドリーの要素としては、以下のような点をチェックしましょう。
- Flashを使用しない
- 固定幅のビューポートを避ける
- ビューポートを設定する
- コンテンツのサイズをビューポートに合わせる
- 読みやすいフォントサイズを指定する
- タップ要素のサイズを適切にする
- インタースティシャル広告を避ける
ビューポートとは、モバイル端末での表示方法を指定するための記述で、ビューポートの指定がない場合は、ブラウザーはパソコン画面の幅でページを表示します。
個々の詳細については、後述しますが、これからはGoogleが評価している要素であり、モバイルフレンドリーと認識されるためには少なくとも考慮しておかなければなりません。
なお、これらの項目のうち 「インタースティシャル広告を避ける」以外の要素は、
Search Consoleのモバイルユーザビリティで、 「ユーザービリティの問題」として表示されます。
今後はモバイル向けユーザーの内容をメインに評価するようになるでしょう。
モバイルフレンドリーかどうかの判断要素
Flashを使用しない
タップ要素のサイズ
フォントサイズ
3.スマートフォンとパソコンで表示順位が異なる
Googleアゴリズムは、ユーザーの環境や行動を考慮して、関連する検索結果を表示します。
同じキーワードでも表示順位が異なる
モバイル検索では、モバイルフレンドリーなWebサイトが優遇されます。
そのため、同じキーワードであっても、パソコンから検索する場合とスマートフォンから検索する場合とでは、検索結果に表示されるページの順位が異なります。
Search Consoleでは以下の手段で、モバイル検索とパソコン検索の平均順位傾向を確認することができます。
同じ1位でもモバイル検索の方がクリックされやすい
以下の画面は、実際に同じクエリでスマートフォンとパソコンから検索した場合の、検索結果画面のファーストビュー（スクロールなしで表示される部分）です。
パソコン検索では、上位4位までがファーストビューに表示されていますが、スマートフォンでは、2位までしかファーストビューに表示されません。
検索したユーザーはます、画面の上部に表示されているWebページに目を通すため、パソコン検索での1位とモバイル検索での1位とでは、クリックされる比率に差が生じます。
実際にSearch Consoleで平均掲載順位が１位のクエリをいくつか選んで、クリック率の違いを調べると、以下のような結果になります。
パソコン表示順位が１位の場合よりも、モバイル検索での表示順位が１位の場合の方が、CTR（クリック率）は高い傾向にあります。
このように、モバイル検索とパソコン検索では、傾向や特徴が異なることを認識しておきましょう。
4.モバイルファーストインデックスに対応する
2016年11月に、Googleはモバイルファーストインデックスに向けた実験を開始することを発表しました。
今までは、パソコン版をメインに評価していましたが、今後はモバイル版コンテンツをメイン評価するようになります。
従来はパソコン版コンテンツをメインに評価
これまでは、モバイル検索の表示順位もパソコン版コンテンツの評価によって決まっており、モバイル版コンテンツ内容は考慮せず、モバイルフレンドリーかどうかを補助的にみているだけでした。
極端に言えば、パソコンばのコンテンツさえ充実していれば、モバイル版のコンテンツの大部分が省略されていても評価が下がることはありません。
しかし、近年のスマートフォンの普及により、モバイル検索のユーザーがパソコン検索のユーザーよりも多くなってくると、これまでの仕組みではユーザーにとって最適な体験を提供することができません。
今までのGoogleページ評価
パソコン版ページ
パソコン版の内容をメインに評価
モバイル版ページのURLを確認
パソコン版検索
パソコン版の内容をもとにランク付け
パソコン版ページが掲載される
モバイル版ページ
モバイルフレンドリーかどうかをチェック内容は見ていない
パソコン版ページのURLを確認
モバイル検索
パソコン版の内容をもとに評価し、モバイルフレンドリーかどうかもランク付けに影響
モバイル版ページが掲載される
今後はモバイルページをメインに評価
Googleは2016年11月に「モバイルファーストインデックス」の実験を開始すると発表しました。
モバイルファーストインデックスの実施後は、モバイル版コンテンツの評価をもとに、表示順位が決まるようになりました、
URLが同じで、モバイル版とパソコン版で主要なコンテンツやマークアップが同一（レスポンシブデザインや動的な配信）であれば問題ありませんが、別のURLで公開している場合は、いくつかの注意点があります。
構造化データのマークアップは両方のコンテンツに記述しておく
モバイル版コンテンツへのクローラーの巡回を確認する（クローラーは「Google bot」を選択し、robots.txtテスターでモバイル版ページをチェックします）
rel＝”canonical”の変更は不要
パソコン版とモバイル版で主要なコンテンツに差がある場合には、表示順位に影響が出るかもしれません。
ユーザーが必要とする情報や役に立つ情報を省略しすぎないように、注意しましょう。
今後のGoogleのページ評価
パソコン版ページ
パソコン版の内容は補助的に評価
モバイル版ページのURLを確認
パソコン検索
モバイル版ページの内容をもとにランク付け
パソコン版ページが掲載される
モバイル版ページ
モバイル版の内容をメインに評価
パソコン版ページのURLを確認
モバイル検索
モバイル版ページが掲載される
モバイル版ページをもとに評価
5.モバイルフレンドリーなWebサイトの実装方法
モバイル環境に最適化されたWebサイトを実装するには、HTMLやサーバーの知識などが必要です。
Web制作を外注している場合には、制作会社に依頼しましょう。
ここでは、
モバイルフレンドリーなWebサイトの実装方法を解説します。
モバイルフレンドリーサイトを実現する3つの方法
「モバイルフレンドリー」を実現するには、「レスポンシブWebデザイン」「動的な配信」「スマートフォン用とパソコン用で別々のURL」という３つの方法があります。
レスポンシブWebデザイン
１つのURLで１つのHTMLを配信し、デバイスによって適した表示に切り替える方法です。
ソースコードは同じでも、パソコンで表示した場合には、パソコン用のレイアウト、モバイル端末で表示した場合には、モバイル用のレイアウトに切り替わります。
検索エンジンに対して行う設定が最もシンプルなので、Googleが推奨している方法でもあります。
動的な配信
１つのURLを使用しますが、動的な配信では、サーバー側で把握したデバイス情報に応じて、異なるHTMLを生成します。
パソコンからアクセスした場合にはパソコン用の、モバイルでアクセスした場合には、モバイル用のHTMLが表示されます。
それぞれ別々のURL
モバイル用ページとパソコン用ページで別々のURLを用意し、デバイスによって振り分ける方法です。
例えば、パソコンからアクセスした場合には、「example.com/a.html」というパソコン用のURLにダイレクトされてパソコン用のコンテンツが表示され、モバイルでアクセスした場合には、「m.example.com/a.html」というモバイル用のURLにリダイレクトされるような設定です。
この方法では、パソコン用とスマートフォン用のページでそれぞれ別のURLを割り当て、別のhtmlを用意する必要があります。
基本的にはレスポンシブWebデザインでOK
WordPressなどのCMSを利用して、社内でWebサイトを構築している場合は、レスポンシブWebデザインに対応したテンプレートが利用できます。
モバイルファーストインデックスの実施後も、レスポンシブWebデザインであれば、大きな変更はありません。
一方で、動的な配信や別々のURLで提供するケースでは、デバイスごとに異なるHTMLを準備できるため、デザインやレイアウト上の制約がすくないというメリットがあります。
モバイルフレンドリーに関する情報は、Google Developers でも詳しく解説されているので確認しておきましょう。
モバイルフレンドリーサイトの３つの実現方法
レスポンシブWebデザイン
同一
1種類（CSSでレイアウト切り替え）
動的な配信
同一
2種類（パソコン用とモバイル用）
別々のURL
2種類
2種類（パソコン用とモバイル用）
6.インタースティシャルの使用は避ける
ページコンテンツを覆い隠すようなポップアップ広告などは、ユーザーにとってはわずらわしく感じるものです。Googleの順位評価にも影響するので、
例外のケースを除いて使用しないようにしましょう。
インタースティシャルとは？
「インタースティシャル」とは？ページコンテンツを覆い隠すようなポップアップ画面やや、目的のWebページが表示される前に別のページを表示させるしくみのことです。
主に広告を掲載したり、サイト内の特定のページ（アカウント登録しページなど）へ誘導したりする目的で使用されます。
Google社内のユーザー体験の調査では、インタースティシャルはユーザー行動の妨げになっていることがやかっています。
この結果を受けてGoogleは、2017年よりモバイル検索においてわずらわしいインタースティシャルが表示されるページの評価が下がるように、変更を加えています。
煩わしいインタースティシャルに該当するケースとしては、次のようなものが挙げられます。
ポップアップ表示
Webページの表示直後やページの閲覧中に、未来のコンテンツを覆い隠すようにポップアップが表示されるタイプです。Webサイトを離脱する直前に表示されるポップアップは、該当しません。
スタンドアロン
Webページを表示する前にインタースティシャルのページかま表示され、閉じないとWebページにアクセスできないタイプです。ユーザーによって、強制的に広告を見せられているという印象を受けるかもしれません。
インタースティシャルのようなレイアウト
Webページを表示した際に、最初に表示される部分が、インタースティシャルのようなレイアウトになっているタイプです。メインにコンテンツは、スクロールしないと閲覧できません。
インタースティシャルの評価対象さらページ単位であり、Webサイト全体の評価には影響しません。また、インタースティシャルかどうかについては、モバイルフレンドリーツールでは検知されません。
インタースティシャルを表示するツールなどを導入しているのであれば、少なくともモバイルページで表示されないようにしておきましょう。
今後の動向によっては、パソコンでの検索にも影響を及ぼす可能性があるあめ、できれば煩わしいインタースティシャルは表示しないようにするか、該当なサイズに極力抑えるようにしたほうがよいでしょう。
インタースティシャルが評価に影響しないケース
- 年齢確認など、法律上の必要に応じて表示する場合
- メールサービスのように個人的なコンテンツが含まれる場合や、インデックス登録できない有料のコンテンツなど
- 画面スペースに対して適した大きさで、簡単に閉じることができる
あわせて読みたい
7.Search Consoleでモバイルユーザビリティをチェックする
モバイルユーザービリティの問題箇所は、Webサイトをモバイルフレンドリーに改善する上で、最低限考慮しなければならない要素です。
ここでは、個々の項目につて具体的に解説します。
モバイルユーザビリティのエラーを確認する
Flashなどのスマートフォンサイトではあまり使われていないソフトウェアを使用していないこと
ページの大きさがスマートフォンの画面に最適化されており、横のスクロールしたりズームせずに読めること
リンクを指でタップした際に、近くにある別のリンクをタップしてしまうことないよう、リンク同士が離れていくこと
スマートフォン上でズームすることなく読める大きさのテキストを、使用していること
Search Consoleの「モバイルユーザビリティ」では、モバイルユーザビリティの問題点や、スマートフォン対応の条件をクリアしていない問題のあるページを一覧で抽出することができます。
Flashが使用されている
FlashはiPhoneやiPadなどのブラウザーでは再生できないため、スマートフォンでは一般的でないソフトウェアであり、使用していると「モバイルフレンドリーではない」とみなされます。
ビューポートが設定されていない
ビューポートはモバイル端末の表示方法を指定するための記述で、次のようにHTMLの<head>内に記述してビューポートを指定します。
<meta name=”viewport” content=”width=device-width, initial-scale=1″>
ビューポートこ指定がないと、モバイル端末でページを表示した際に、パソコン画面の幅でページが表示され、文字が小さくタップもしづらくなってしまいます。
固定幅のビューポート
各端末の画面サイズに合わせて表示を調整する場合は、デバイス幅に合わせてビューポートを指定します。
固定幅：<meta name=”viewport” content=”width=640″>
デバイス幅：<meta name=”viewport” content=”width=device-width”>
コンテンツ幅が画面の幅を超えている
画像や要素が画面からはみ出し、ユーザーが横にスクロールしたりズームしたりする必要がないように、コンテンツのサイズ画面のサイズと一致していなければなりません。
そのほか、フォントサイズが小さすぎる場合や、ボタンやリンクなどのタップする要素同士が近すぎてタップしにくい場合にも、エラー表示されます
今回は、「モバイルフレンドリーのための施策！」について詳しく説明していきます。
現在は、PCよりもスマートフォンの保持率が高くなっています。その中でSEO対策としてどのような施策をして、一人でも多くの方に見てもらえるかがポイントになります。
なので、ユーザーの方に対してわかりやくコンテンツの充実を図りましょう！
あわせて読みたい
最新記事 by スガツヨ (全て見る)
- 最近の職場環境を紹介！ブラックフライデーで新型ノートPCを購入 - 2024年12月15日
- 激動の時代に若い人は遊んでる暇はない｜若いうちに一生分を稼ぎきろう - 2024年11月18日
- 自分のビートを刻め！僕が日々行う仕事のモチベーションを上げる方法 - 2024年11月11日
- 過去に興味は無い。未来にも興味は無い。あるのはこの1分、兵隊の1分。 - 2024年10月6日
- 月500万円以上の利益を達成｜綺麗な花を花壇いっぱいに咲かせるために生き急ぐ - 2024年9月30日
前回は、「まずはこれだけはやっておきたいSEOの常識」について説明しました。
今回は、「モバイルフレンドリーのための施策！」について詳しく説明していきます。
現在は、PCよりもスマートフォンの保持率が高くなっています。その中でSEO対策としてどのような施策をしていくべきなのか見ていきましょう。