目次
モバイルファーストとは？
モバイルファースト（Mobile First）とは、スマートフォンやタブレットなどのモバイル端末からウェブサイトを見るときにも、見やすいようにするための考え方やその実現方法といえます。最適化という言葉で表現されることがありますが、つまり、モバイル端末からのアクセスでも快適に見られるようにする（最適な状態にする）ことです。
中には、「スマートフォン向けのサイトをPCよりも先に制作すること」や「スマートフォン向けのサイトをPC向けのものよりも優先すること」などと説明しているケースもあるようです。しかし、この場合のファーストは物理的なものではありません。あらゆるデバイスで快適に表示されること、つまりマルチデバイス対応を取ることだともいえます。
モバイル端末からのアクセスを意識しなければならない理由は、インターネット利用率の高さです。特にスマートフォンは、年々高まる傾向にあります。PCの大きな画面で見ることを前提とした情報量では、スマートフォンの場合、どうも見にくいということが起こってしまいます。見にくいというのは、集客を目的とするウェブサイトにとって大きな問題です。
モバイルファーストの必要性－利用デバイスのトップはモバイル
ここで一旦、モバイルファーストの必要性を改めて数字で確認しておきましょう。令和3年版 情報通信白書によると、一世帯当たりのスマートフォン保有率がPCを超えたのは2017年です。そこからは徐々に差が開いてゆき、2020年にはPCの保有率が70.1％に減少した一方で、スマートフォンは86.8％にまで上昇しました。
インターネット利用端末も、スマートフォン（68.3％）がもっとも多く、パソコン（50.4％）、タブレット型端末（24.1％）と続きます。
（総務省「令和2（2020）年 情報利用動向調査の結果」（https://www.soumu.go.jp/johotsusintokei/whitepaper/ja/r03/pdf/01point.pdf）
保有率やインターネット利用端末だけではなく、検索数もスマートフォンのほうがPCを上回っているという調査もあります。ドイツのSEOツール制作会社SISTRIX社が2021年3月に発表した調査によると、日本でのインターネット検索の約75％がモバイル端末によるもので、残りの約25％がPCによるものだとしています。
（SISTRIX社「The proportion of mobile searches is more than you think – What you need to know」 https://www.sistrix.com/blog/the-proportion-of-mobile-searches-is-more-than-you-think-what-you-need-to-know/）
なお、コロナ禍でネットショッピング利用世帯の割合も増加、2020年1月には40％台前半だったものが、2021年3月には50％台前半へと、約10％もの伸びを示しました。
（総務省「令和3（2021）年版 情報通信白書」（https://www.soumu.go.jp/johotsusintokei/whitepaper/ja/r03/pdf/index.html）
このほかにも令和3年版 情報通信白書では、60歳以上であっても8割以上がスマートフォンを利用していることや、タブレットの利用率は年齢による差がなく、いずれの世代でも2～3割程度であることなどを明らかにしています。つまり、インターネット利用の現状はモバイル端末が中心なのです。
スマートフォンとPCとで異なる利用
モバイル端末の中でも、特に保有率やインターネット利用率が高いのはスマートフォンです。そこで、スマートフォンとPCとの違いを考えてみましょう。この違いがわかっていれば、モバイルファーストでサイトをリニューアルする際に役立ちます。
スマートフォンとPCの主な違いは、本体の大きさと画面、操作、ユーザー層、利用目的の5つに集約されるといえるでしょう。
■スマートフォンとPCとの違い
・本体の大きさ
・画面とスクロールの仕方
・操作
・ユーザー層
・利用目的
スマートフォンとPCとのもっとも大きな違いのひとつはサイズです。スマートフォンはPCに比べて圧倒的に持ち運びがしやすく、シーンを選ぶことなく日常的に使われているものだといえます。本体に防水加工や衝撃耐性が加えられていることから、PCでは考えにくい浴室や水辺、アウトドアでも使われているでしょう。
PCの画面は基本的に横長の据え置きですが、スマートフォンの場合は縦長です。しかも、向きによって縦横を入れ替えたり固定したりすることもできます。ＰＣはスクロールバーで縦横の移動が簡単ですが、スマホは上下のスクロールが基本です。
操作面でも違う点が多々あります。PCの場合はキーボードとマウスで、基本的に両手を使います。スマートフォンはフリック入力やタップ、スワイプ、ピンチイン、ピンチアウトなどがあり、片手で操作できることが前提といえます。
ユーザー層については、PCの利用率は年齢が上がるほど高い傾向にあります。しかし、年々保有率が下がっていることから、60歳以上でも利用率は60.0％となっています。スマートフォンの利用率は年代による差があまりなく、20～60歳以上のどの年代でも80％以上で20～59歳までの平均は91.5％です。
利用目的として多いのはショッピング（73.4％）で、支払い・決済（66.9％）、地図・ナビゲーション（61.4％）、情報検索・ニュース（57.9％）、動画閲覧（55.6％）と続きます。スマートフォンでのショッピングは女性の割合が高いというデータもあります。
（総務省「令和3（2021）年版 情報通信白書」（https://www.soumu.go.jp/johotsusintokei/whitepaper/ja/r03/pdf/index.html）
モバイルファーストのサイトデザイン
スマートフォンとPCとの違いを踏まえた上で、実際にどのようにしてモバイルファーストを実現するのかという方法論に移りましょう。ここで取り上げるのは、モバイルファーストを実現する2つの方法とモバイルを意識したサイトデザイン上の工夫です。
■モバイルファーストを実現する方法
・レスポンシブデザインにする
・デバイスごとにサイトを構築する
まずは、レスポンシブデザインです。レスポンシブデザインとは、アクセスしてきた端末に応じて文字の大きさや位置、画面幅を変えるという方法です。PC用に制作されたウェブサイトに切り替え指示を加えます。
すでにウェブサイトがある場合には、この方法がもっともコストを低く抑えることができますが、その一方で既存のウェブサイトからスマートフォン向けにデザインを大きく変更することはできません。
もうひとつは、デバイスごとにサイトを構築する方法です。ＰＣ用のサイトはそのままとし、新たにスマートフォン用のサイトを立ち上げることになります。スマートフォン用のサイトという案内を実際にウェブ上で見たことがある方もいらっしゃるでしょう。
立ち上げの費用や製作期間などのコストに加えて、完成してからの管理や運用というコストもかかりますが、その一方でデバイスごとに自社商品またはサービスのターゲットを想定し、きめ細やかに対応することが可能です。
どちらが正解ということではなく、どちらを選択するかは、それぞれの企業によって異なります。
■モバイルを意識したサイトデザイン上の工夫
モバイルを意識したサイトデザイン上の工夫をご紹介します。ＰＣ用に制作したサイトでも活用できる工夫がありますので、できるだけ費用を抑えたい場合にはご参考になさってください。
・フォントサイズと行間
・ボタンやリンクをタップしやすいように離す
・目次とアンカーリンク
・ページトップに戻るボタンの設置
・ページネーション
・表示速度
モバイルファーストの場合、フォントサイズと行間に注意しましょう。ＰＣの画面では数行でも、スマートフォンの場合には画面が文字情報でいっぱいになるということが起こります。
ボタンやリンクを集中させないことも不可欠です。スマートフォンの画面はPCに比べて小さいため、タップする際に狙ったところとは違うところをタップしてしまうことがユーザーのストレスになります。
目次とアンカーリンクも知りたい情報にいち早く辿り着くための工夫のひとつです。スマートフォンはＰＣよりも短時間、隙間時間に利用される傾向にあります。言い換えるならば、PCのほうが腰を据えて長い時間がかかる作業に使われる傾向にあるということです。
スマートフォンの場合、ページトップに戻る際に専用のボタンがあると便利です。どこからでもトップに戻ることができるようになっていると、いちいちスクロールせずに済むので便利です。一般的に画面右下に配置されていることが多いといえます。
ページネーションも活用しましょう。スマートフォンの場合、画面内に表示できる情報量が限られていますので、文字情報が多い場合にはページを細かく分割して全文を読ませる工夫が必要です。
表示速度も大切な要素です。PC用として構築したサイトの場合、画像や動画データのクオリティが高く、モバイルの場合には表示に時間がかかると感じさせてしまう可能性があります。表示速度が遅いと離脱率が上がってしまうため、注意が必要です。
■モバイルファーストインデックス
去る2016年11月5日、Google社はモバイルファーストインデックス（Mobile First Index）の導入を発表しました。これは、ウェブサイトの検索順位の評価基準がPCからモバイルへとシフトしたことを意味します。このことも、モバイルファーストへの対応を求められる理由のひとつです。
なお、Ｇｏｏｇｌｅ公式のモバイルフレンドリーテストがありますので、ご紹介しておきます。自社サイトがどれくらいモバイルファーストに対応できているかを判定するものです。ご参考までに試されてみてはいかがでしょうか。
モバイルフレンドリーテスト（Google公式）
https://search.google.com/test/mobile-friendly?hl=ja
自社商品やサービスのターゲットは誰なのか
時代はモバイルファーストだからとモバイル対応をしたところで、自社商品やサービスのターゲットを見失ったままでは事業の成果につながりません。必要なのは、自社商品やサービスを求めているターゲットに対してモバイルファーストという対応を取ることです。
モバイルユーザーとPCユーザーは、必ずしも別人とは限りません。時と場合に応じてモバイルとＰＣを行ったり来たりする一人の人という場合もあります。そこで大切になってくるのが、どのような場合にどちらを使うのかを丁寧に追うことです。
前々回のコラムで取り上げたカスタマーエクスペリエンスでもお伝えしていますが、自社商品やサービスのターゲットとなる顧客をより具体的にしたペルソナを設定し、カスタマージャーニーマップを作ります。その中でモバイルとＰＣとの使い分け、またはモバイルのみの場合を考えていくとよいでしょう。実際にペルソナに近い人をピックアップし、調査するという方法もあります。
どのデバイスでアクセスしてもいいようマルチデバイス対応をしておけば、ＰＣ向けウェブサイトよりも幅広いユーザーに見てもらえる可能性が高くなるといえます。
まとめ
モバイルファーストは、もはや現在のスタンダードといっても過言ではないでしょう。もしPC向けのウェブサイトになっているのであれば、できるだけ早くモバイルファーストに対応することをおすすめします。
これまでにいくつかのコラムでお伝えしていますが、ウェブサイトは構築することがゴールではなく、そこからが運用のスタートです。アクセス解析でユーザーニーズを把握し、それに応じて事業の成果につながるよう、サイトに調整を加えていくことがセットになっています。
モバイルファーストとは、スマートフォン利用者が増加したことを受けて、モバイル端末でのアクセスでもウェブサイトの見やすさを実現する対応です。しかし、もともとはユーザーファースト（お客様本位）という考え方に含まれるものといえます。お客様にとって有益であることを基本とする、ビジネス上の本質を見失わないことでもあるといえるでしょう。
デバイスに関係なく、お客様が求める情報をストレスなく提供する。
接客の基本ともいえることをウェブサイトで実現することで、ビジネスチャンスが広がります。コロナ禍で消費者向けのショッピングに商機があるからこそ、取り組んでおきたい課題のひとつではないでしょうか。
