こんにちは、キノトロープアカデミーです。

「キノトロープアカデミー」は、Web業界のトップランナーである株式会社キノトロープの社員が講師を務めるオンラインアカデミーです。リモートワーク時代に不可欠な「個のスキル」を高め、職人のような「匠」を目指す人を増やしたい。そんな願いを込め、基礎から経営判断、業務フローまで、一生モノのナレッジを惜しみなく公開していきます。

＜Web担当者に喝！！編 第8回＞
“モバイルファースト”とはスマホサイトを最初に作ること？
本来の意味を正しく理解すべし！
についてお伝えします。

担当は生田です。

本記事では、うわべだけの「スマホ向けサイトを先に作る手順」がモバイルファーストであるという誤解を解き、本当に大切なのは「ユーザーの状況やコンテンツを中心にした最適化」であると解説しています。

スマートフォンがあらゆる世代に普及し、複数のデバイスを使い分けるマルチデバイス時代だからこそ、画面の見た目だけでなくユーザーの利用シーンに寄り添った設計が必要になります。

変化の激しい時代の中で、Webサイトの本来の目的である「お客様の問題解決」を実践するための本質的なアプローチについて、分かりやすく解き明かす内容となっています。

「モバイルファースト」という言葉を耳にするようになって久しいですし、やっとその重要性や必要性が認知されるようになりました。皮肉なことに、フィーチャーフォン（ガラケー）が廃れてスマートフォンの台頭がその引き金になったわけですが、今の状況を考えると、トレンドワードとしては「スマートフォンファースト」や「コンテンツファースト」と呼ぶほうがしっくりくるかもしれません。

SEO業界でも「外部リンクSEO」から「コンテンツSEO」へとトレンドが大きく変化していますが、実はこれこそがモバイルファーストで成し得なければいけない施策なのです。

モバイルファーストというのは、スマートフォン向けのサイトから先に作るという「作業手順」の話ではありません。スマートフォンからのアクセスも含めたユーザーのニーズや状況に合わせ、必要なコンテンツを必要なテンプレートで表示することです。

そのためにユーザー視点に立ち、ユーザーの導線や、何よりも大事な「シチュエーション」ごとにコンテンツを考えていく必要があります。これがWebサイト構築のベースとなると同時に、マルチデバイス対応の基本的な考え方であると言えます。

いわば、モバイルファーストは一つの「概念」です。これから将来、時計やテレビなど、インターネットが見られる様々なデバイスがさらに登場してくるでしょう。どのようなデバイスが現れようとも、「ユーザーにとって本当に必要な情報や機能は何なのか？」「それをどのデバイスで利用するのが最適なのか？」と、常にユーザー視点で考えながらWebサイトを構築すること。これこそがモバイルファーストの本当の意味です。

本来、モバイルファーストというのはガラケーが出た時代に、「PCで見るときとモバイルで見るときではシチュエーションが違うよね」というところから始まりました。モバイルは外で使い、PCは会社や家で使うという状況があったわけです。つまり「外出時なのか、家の中なのかというお客様のシチュエーションに合わせよう」という話でした。

ですから、言葉が出た当時のベストな対応としては、PC用サイトとスマートフォン用サイトを別々に用意し、それぞれのシチュエーションに合わせて最適化して作っていました。これは結構大変な作業です。

例えばホテルのサイトであれば、モバイルで見るときは「今日泊まれる部屋」といった情報が一番上にくるようにする、といった具合に「シチュエーションの違い」が重要なキーだったのです。

ところが今、スマートフォンの普及によって、ほとんどの方がスマートフォンでサイトを閲覧するようになり、利用シチュエーションによる違いはあまりなくなってきました。

だからといって、モバイルファーストという考え方をなくしていいわけではありません。スマートフォンファーストと呼んでもいいですし、私たちは「コンテンツファースト」と呼んでいますが、お客様が見ているデバイスにおいて一番使い勝手が良く、一番見たいものを最初に出して最適化するという本質は変わっていません。

つまり、モバイルファーストという言葉の意味と、スマートフォンファースト、コンテンツファーストは、概念としては全く同じものであると考えていただいて構いません。

ただ、やるべきこと（To Do）は当時と比べてだいぶ変わってきています。昔は本当に外で使うときと中で使うときで使い勝手が全然違ったため、全く別個のものを作らなければならなかったのですが、今はみんなスマートフォン一択なので、基本的にはスマートフォンに合わせて作ればよくなりました。そのため、作る側としては個人的には昔より楽になったと感じています。

よく制作を頼まれるときに、「今回はモバイルファーストでやりたいので、最初にスマートフォンサイトから作ってもらえませんか？」と言われたり、「スマホ用のサイトだけあれば十分ですよ！」「スマートフォン向けのサイトは特に力を入れて格好よくしてください」と言われたりします。制作会社のほうも「いまはスマートフォンサイトが肝心ですから、モバイルファーストでいっちゃいましょう！」なんて話をしています。

だけど、これが本当に本質的なことを分かって言っているのかという話です。私たちの動画で一貫してお伝えしている通り、Webサイトでやらなければならないことは「お客様のニーズへの最適化」です。

これはモバイルファーストでもスマートフォンファーストでもコンテンツファーストでも、一番重要なことです。ぜひこれを肝に銘じておいてください。マルチデバイス時代の到来は、より深くお客様を知る「チャンス」だと捉えてほしいのです。

スマートフォンが台頭してからはレスポンシブWebデザインが注目され、「スマートフォンに対応するためにはレスポンシブにしておけばいい」という話がよく出ます。確かに、スマートフォンに対応するためのレスポンシブは重要な対応策の一つですし、私たちも当然レスポンシブでサイトを制作しています。

ですから、レスポンシブという手法がダメだと言っているわけではありません。だけど、それだけでは本質的な問題を解決していないということを知らなければなりません。PCサイトを作って、それをただレスポンシブ化すればマルチデバイス対応やスマートフォン対応ができている、という作業の話ではないのです。

かつては別々のソースやコンテンツを作らなければならなかったものが、1つのソースでレスポンシブに対応できるようになったというのは、制作会社にとっては非常に楽になったと言えます。

しかし、本質的な問題はそこではありません。PCを使う人とスマートフォンを使う人では、それぞれの使い勝手が変わります。それを考慮しながらWebサイトを構築しなければ、お客様ニーズへの最適化、つまり本当のモバイルファーストは実現できません。

ここで、モバイルファースト実現のために重要な3つの要素をお話しします。

これらすべてのお客様ニーズに最適化することがベースになります。

これらは、かつてのPCサイト構築時と比べて大きく違う点が3つあります。

1つ目は、利用デバイスがシチュエーションのヒントを与えてくれる点です。GPSなどを活用すれば、お客様が現在置かれている状況や位置情報が分かります。
2つ目は、デバイスごとのコンテンツの有効性のヒントを与えてくれる点です。「PCで見る場合はこのコンテンツが有効だよね」「スマートフォンで見る場合はこのコンテンツが必要だよね」という判断ができ、これはこれから増える新しいデバイスに対しても同じことが言えます。
3つ目は、単なる閲覧回数だけでなく、ユーザーのライフスタイル情報も与えてくれる点です。「1回目はスマートフォンでアクセスし、2回目はPCサイトでアクセスした」という動きから、どのタイミングでの告知が有効なのかが見えてきます。

このように、お客様の情報によって最適化していくアプローチがいわゆる「One To One」対応であり、マルチデバイス対応やスマートフォンファースト、コンテンツファーストを掲げる上では、これがないと難しい時代になってきています。将来的にスマートフォン以外のゲーム機やテレビといった様々な端末が増えていくため、企業の担当者にとっては非常に難しい時代だと言えるでしょう。

だけど視点を変えれば、PCサイトだけでは取れなかったお客様のニーズが、スマートフォンを通じてより直接的かつ短絡的に動くようになったことで、これまでよりも多くの情報を提供してもらえるチャンスでもあります。お客様が何をしてほしいのか、何が欲しいのかがより深く分かるというのは、本当にありがたいことです。

暗に、お客様から情報がより多く得られる時代だからこそ、その情報を使ってこれまで以上のサービスを提供しなければならない時代になっているのです。周りの企業もみんな、その情報を利用して最適な情報を提供しようと動き出しています。

このマルチデバイス時代の変化は、お客様により良いサービスを提供しようと考えている企業や制作者にとっては、理想的な追い風です。私たちの会社はずいぶん前から「CMSを基盤にしてOne To Oneをやろう」という話をしてきましたが、以前はなかなか踏み越えられない壁がありました。

だけどスマートフォンの普及によって、ありがたいことに、どの企業も「そうしなければならないね」と考えてくれるようになりました。実際に導入するかどうかは別としても、それがやらねばならないミッションだと捉えてもらえるようになったのは、ものすごくありがたい変化だと感じています。

ここで、モバイルファースト実現の鍵となる「4つのキーワード」を挙げます。

この4つを成し得なければなりません。

PCの時代であれば、PCを使っているという時点で、ある程度のルールやリテラシーを持っている人たちを大前提としてサイトを作ることができました。

だけど、スマートフォンやゲーム機、テレビといった端末になった途端、そうしたベーシックなインターネットのリテラシーを持たない人たちもどんどん使うようになります。そうした知識がない人たちでも問題なく使える、使いやすさが必要になるのです。

お客様に使い勝手のリテラシーを期待してはいけませんし、インターネットの知識や常識を強要してもいけません。これが大前提になります。制作する側も企業も、まずはここを考えなければなりません。普通の人たちが普通に使える、自動販売機や駅の券売機のようなレベルの話なのです。

また、お客様がサイトを探してくる経路もどんどん変わっており、InstagramやTwitterといったSNSからの「ソーシャルサーチ」なども当たり前に起こっています。

そのため、様々サイトやSNSから自然に流入してくるような、より簡便で分かりやすい、シンプルな導線による連動が必要になってきます。ユーザーの利用シーンに合わせて情報を最適化し、必要なものを出していくことが重要です。

現在、驚くべきことにインターネットユーザーの90％以上の人がスマートフォンからアクセスをしています。企業のWebサイト担当者の方であれば、「自社のデータを見るとスマホが60％、PCが40％くらいだから、9割にはなっていないよ」と言うかもしれません。

ですが、ここにはトリックがあります。スマホユーザーとPCユーザーが固定されていないため、重複している部分が見えにくく、別々の人として捉えられてしまうのです。

この点について、LINEさんが非常に分かりやすいデータを出してくれています。全年齢層を対象としたデータなので企業によって違いはありますが、全体の93〜94％の人がスマートフォンでアクセスしており、そのうち約5割の人は「スマートフォンのみ」でアクセスしています。

そして、PCでもアクセスしている人は4割ほどという実態がよく分かります。これは劇的に変化していますので、自社のWebサイトにおいて、全体としてどういう使い方をされていて、どれくらい重複しているのかをしっかり把握し、想像していかなければなりません。

現時点でどう考えるべきかというと、やはりスマートフォンを中心に考えるべきです。根本的な考え方のベースには「ユーザーニーズに最適化する」ことがあり、様々なデバイスが出てきても対応できるように、コンテンツをCMSで一元管理してテンプレートから吐き出す構造を作っておく必要があります。

その上で現状を考えれば、まずはスマートフォンのコンテンツを最適化し、一番使い勝手が良くなるように設計するのが最適です。そしてスマートフォンのサイトをレスポンシブで制作し、PCでも閲覧できるようにする。これが、現時点で制作者にとって最も合理的でシンプルな作り方です。

ただ怖いのは、来年にはこの常識が変わっているかもしれないということです。現時点では、スマートフォンのユーザーのシチュエーションに合わせてコンテンツを絞り、レスポンシブでPCやタブレットでも見られるように作るのが最適解ですが、この状況は常に変化します。

もちろん、BtoBビジネスを展開されていて「うちは8割方PCでアクセスが来るからPCサイトが中心だ」というクライアントもおられます。そうした場合でも、私たちはスマートフォンのユーザーの動きやUI・UXの使い勝手を加味したPCサイトを提供しています。

なぜなら、仕事中は9割方PCからアクセスしている人たちも、普段は必ずスマートフォンを使っており、スマートフォンの使い勝手に慣れているからです。そのため、PCで見るときも画面をシャッと縦にスクロールして移動しますし、グローバルナビゲーションをわざわざクリックしないといったスマートフォン特有の動きをします。

つまり、スマートフォンで最適だと思われるレイアウトや使い勝手が、そのままPCサイトにも求められるのが今の現状なのです。

ですから今この瞬間を切り取って言えば、PCサイトであってもスマートフォンの UI・UXを意識した使い勝手を考えることが、一番お客様にとって最適化されると言えます。この状況はタイミングごとに変わりますので、自社やインターネット全体のアクセス動向を常に把握し、2年後、3年後にどうなるかを予測しながら「こう作っておけばいいよね」という設計を考えていただければと思います。

本日のまとめになります。

時代によって手法は変わりますので、常に「お客様」に目を向けていてください。
すべてはお客様の問題解決のためにあるのだということをご理解いただければと思います。