モバイルファーストなサイトの考え方とは?基本的な事からサイトの高速化表示について解説!
本記事ではモバイルファーストの基本的なことについての解説になります。
また、AMPについての解説やサイトを高速表示するためにはどうすればいいのかという部分に注視した解説になっています。
そもそもモバイルファーストって何?
モバイルファーストというのは「スマホ向けに最適化されたサイト」ということです。
普段スマートフォンでサイトを見た時とPCでサイトを見た時はサイト自体のデザインや雰囲気が変わっていると感じたことがあると思います。
それはスマートフォン向けのユーザーに向けてサイトが工夫をしているからです。
スマートフォン向けのサイトではPCとは違い画面のサイズが大きく異なります。そのため小さい画面に収まるように、かつ必要な機能が残っているサイトが望ましいです。
スマートフォン向けのサイトだからといって機能を削り過ぎてしまっても使いにくくなってしまう場合もあります。
今回はスマホに限った話を行いましたが、ユーザーの中にはPCやスマホ以外にも、タブレットやガラケーでサイトを利用しているユーザーも居ます。また、今後出てくる新しいデバイスが流行る可能性もあります。そういったユーザーに向けて幅広い視野を持っている事が大切になってきます。
モバイルファーストの考えはGoogleが提唱した!
モバイルファーストはGoogleが2018年3月27日に移行を開始した事を発表しました。
これは従来のデスクトップPCを前提とした検索表示の基準から、スマートフォンなどの端末に適した検索表示へと移行したという事です。
つまりはモバイルファーストなサイト作りを意識することはSEO対策としても非常に重要になってきます。
Googleが何故このような検索表示にしたのかというとデスクトップバンのサイトを検索表示で上位に表示してしまうとモバイル版のサイトで上手く表示出来なくなってしまい、そもそもサイト自体の閲覧が難しいという状態になってしまっていたからです。
サイト自体がいくら良い物であってもスマートフォンなどの端末で見ることが出来ないならば、そのユーザーから見たらそのサイトは評価出来るものではないからです。
以上のことからGoogleはモバイル版のページのインデックスに使用する移行を開始しました。
これによりモバイルユーザーからの利便性の向上も行う事も出来ます。
どんなサイトはモバイルファーストにするべき?
モバイルファーストの考え方は、スマートフォンなどの端末でページを閲覧した時にストレスにならないようなサイト作りになっているのかどうかということです。
つまり、スマホ向けのユーザーが多いコンテンツを扱っているサイトの場合はモバイルファーストのサイトを用意するべきです。
モバイル版のサイトがあまり重視されない例は対企業でビジネスを行うBtoB(Business to Business)の会社のWebサイトです。このようなサイトの場合はスマートフォンからの閲覧は増加傾向が見られますが、未だにPCからのアクセスが多くを占めています。
なのでBtoBではないサイトの場合はモバイルファーストを意識したサイト作りをするのが好ましいでしょう。
勿論BtoBのサイトであってもモバイル版のサイトに対応出来るのであればその方が良い事には変わりありません。
モバイルファーストはどんなデザインにすればいい?
モバイルファーストのサイトデザインとはいっても元々のPC向けのサイトのデザインを崩したくないと思います。
スマートフォンとPC向けの両方を意識してデザインをするのであれば「レスポンシブWebデザイン」がおすすめです。
「レスポンシブWebデザイン」ではユーザー側の利用している環境に合わせて表示のレイアウトが変更されます。
そのためPC向けサイトとスマートフォン向けのサイトを別々に制作し、毎回それぞれを更新する必要が無くなります。
そのためそれぞれのサイトのデザインを用意する手間を必要最小限に抑えることが出来ます。
また、先程述べたようなタブレットのような閲覧環境にも合わせられるのも魅力です。
モバイルファーストの基準ってなんなの?
Googleはモバイルファーストであると判断する基準の1つは「サイトを高速に読み込むことが出来る」かどうかです。
これはスマートフォン向けのサイトで不要なjavaScriptやCSSを排除して、画像やHTMLがスマートフォン向けのサイトで最適化されているページのことです。
モバイル向けのサイトとして最適化されているページとしてAMPに対応しているサイトかどうかが挙げられます。
AMPとは以下のようなものです。
AMPとは「Accelerated Mobile Pages」の略称で、GoogleとTwitterで共同開発されているモバイルサイトでサイトを高速表示するためのプロジェクト、フレームワークのことです。
このAMPはオープンソースになっていて、誰でも実装することが出来ます。
そのため仕様に沿ったモバイルサイトを作ることでサイトを高速表示することが可能になっています。
以上がAMPの解説です。
このAMPに対応したサイトは多くあり、検索キーワード次第では上位に表示されているサイトの殆どがAMPに対応したページということもよくあります。
そのためAMPに対応することで高速表示することが出来、SEO対策にもなるので是非導入したいですね。
また、AMPに対応したサイトであっても検索上位に表示するためには多くの要素から判断されます。そのためサイト内にモバイル対応していないコンテンツや読み込みが遅いコンテンツがサイト内に含まれた場合は表示が遅くなってしまいます。
他にもGoogleの見解では、AMP対応のサイトと非AMPのサイトで全く同じ内容の場合は、優先的にインデックスされるのは「非AMP」のページになってしまいますのでお気をつけ下さい。
※インデックスは、検索エンジン内のシステムのロボットがサイトを巡回する際、WEBページのデータを検索エンジンデータベースに格納するということ。
スマホサイトとPCサイトでURLが違う場合の注意事項
今回開設したレスポンシブデザインのサイトでSEO対策をした場合は問題がありませんが、スマホでサイトにアクセスした際にスマホ用のアドレスにリダイレクトされるような仕組みのサイトの場合は注意をしましょう。
これは5年以上前に、モバイルファーストインデックスが行われな
と考えられていた時に作られていたサイトによく見られます。
このようなサイトでの問題点はリダイレクト自体が問題ではなく、モバイル版のサイトがメインページだと判断されてしまうことが問題になります。
リダイレクトされるという事はURLからテキスト、HTMLの構造が違うので、本来のPC版のサイトと違うSEO評価にされてしまいます。
なのでPC版のサイトでいくらSEO対策をしても意味がないという事になってしまいます。
以上のことからリダイレクトされるサイトを持っている方はお気をつけください。
まとめ
今回の記事ではモバイルファーストについて解説しました。
モバイルファーストはレスポンシブデザインのサイトにすることで対応出来ます。
また、サイト内でデバイスに最適化されていないコンテンツを多く扱う際は特に気を付けましょう。
ユーザーのモバイル端末でのサイトの利用は今後も増加していきますので早いうちにモバイル版対応のサイトを作ってみてはいかがでしょうか。