2018年からGoogleでもモバイルファーストインデックスが正式にスタートし、モバイルファーストという言葉の存在感がさらに高まりました。
モバイルファーストの考え方が一般的に広まったのが、モバイルファーストインデックスの登場です。
Googleが発表したモバイルファーストインデックス(Mobile First Index)とは、これまで検索エンジンがパソコンサイトの内容をもとにインデックスしてコンテンツの質を評価していたのを一変させ、スマートフォンサイトを評価の主軸にしてインデックスするという方針転換のことです。
これまでPC向けページがインデックスやランキングの評価対象として使われてきましたが、スマートフォン向けのモバイル版ページがメインの評価対象として扱われるようになりました。
現在(2020年2月時点)におけるデスクトップPCとスマートフォンとタブレットのシェアは、60%:37%:3%となっています。
今やUIデザインの観点だけでなく、SEO対策の観点でもモバイルファーストの重要性が高まってきました。
レスポンシブデザインが基本
モバイルファーストを意識してデザインを作成する場合には、レスポンシブデザインを使うのが基本です。
モバイルファーストでデザインされたページをPCでそのまま表示してしまうと、文字が大きく余白の空いたページになってしまい、逆にPC版ページをそのままスマホで表示すると文字が小さくて読みづらいページになってしまいます。
スマホで閲覧しようと思ってタップしてみたところPCページが表示され、その瞬間に検索結果ページに戻るユーザーも多いので機会損失となります。
レスポンシブWebデザインとは、どんな大きさの画面でも見やすく、使いやすいWebサイトにするために必要なものです。
Webページを一枚のhtmlファイルで配信し、CSS(文字・画像の大きさや位置など表示についての指定)を読み込んで、デバイスごとに用意して表示を変えさせます。
内容は全て同じですが、見せ方が違うということです。
レスポンシブWebデザインのメリットとデメリット
レスポンシブWebデザインのメリットとして「管理が楽」なことが上げられます。
Htmlファイルが1枚なのでWebサイトに載せる情報を修正や更新する時に作業が1回で済みます。
デバイスごとにhtmlを作成すると、修正や更新の作業をhtmlの数だけしなくてはなりません。
URLが1つなのでWebサイトを見るユーザーにシェアされやすくなります。
スマホ用のモバイルサイトとパソコン用のPCサイトがあった場合、見せたいユーザーのデバイスに合わせた複数のURLとなりアクセスが分散されてしまいます。
スマートフォンに対応したWebサイトが検索結果の上位に表示されやすくなる「モバイルフレンドリー」や、スマートフォン用のページが順位の決め手になる「モバイルファーストインデックス」に対応できます。
デメリットとしては、PCと同じhtmlファイルをスマートフォンにも読み込ませるため、スマートフォンでは非表示とされたデータまでも読むことになり、表示に時間がかかってしまいます。
またPCとスマートフォンで大幅に構成を変えることが難しくなり、画面デザインに制約が多くなります。
レスポンシブにする場合は、PCで見た場合、スマートフォンで見た場合など、各デバイスごとのコンテンツ精査が必要です。
表示させるデバイスごとにレスポンシブ対応のデザインを用意するには、コーディングの構築が複雑になっているため、Webサイト構築コストがレスポンシブサイトの方が高くなってしまう場合もあります。
CMSを使ったレスポンシブ対応
最近はWordPressなどオープンソースのブログソフトウェアも、単なるブログではなくCMS(コンテンツ・マネジメント・システム) として利用されて来るようになりました。
商用CMSとしてはNORENなどがあり、これまでの手作業による運用コスト、外注コストを削減し、Webサイト運用を内製化することができます。
CMSはレスポンシブデザインとの相性が抜群で、テキストと画像を原稿に用意して投稿すれば、PC・スマートフォン・タブレット版のWebページを自動的に作成してくれます。
効率的なWEbサイト運用のためのに、ビジネスの規模に合わせたCMS導入を考えてみてはいかがでしょうか。
お気軽にヒューマンデジタルコンサルタンツへお問い合わせください!