モバイルフレンドリーとは｜
店舗サイトが離脱される理由

スマホ片手に「◯◯ △△（エリア名）」と検索し、出てきたサイトを開く。文字が小さいので指で広げ、はみ出した料金表を横にずらし、電話しようと番号を押しても何も起きない——ここで多くの人が戻るボタンを押します。滞在はほんの一瞬です。店側は「サイトはちゃんとある」と思っていて、実際パソコンで開けば何の問題もありません。この落差を埋めるための考え方が「モバイルフレンドリー」です。言葉としてはよく耳にするのに中身が曖昧なまま使われがちなので、店舗サイトの視点で分解していきます。

モバイルフレンドリーという言葉が指す範囲

この用語は、何かの検査に合格した状態を指すものではありません。スマートフォンの画面サイズと指での操作を前提に、拡大や横スクロールをしなくても内容が読め、目的の操作ができる状態——それがモバイルフレンドリーです。合否ではなく、程度の話だと捉えてください。

もともとはGoogleの評価基準の呼び名として広まった言葉ですが、その後に判定用の単体ツールは提供が終了しています。ですから現在は「テストに通ったから大丈夫」という線の引き方ができません。合否を出してくれる道具がなくなったぶん、状態を見極める側の目が問われる、というのが今の前提です。

この用語は、画面の表示、指での操作、読み込みの速度といった層にまたがって語られます。この記事では前の2つを中心に扱います。速度は独立したテーマなので、関連記事のほうを参照してください。

レスポンシブとは何が違うのか

混同されやすいので、はっきり分けます。レスポンシブは実装の手法、モバイルフレンドリーは結果として得られる状態です。

レスポンシブとは、同じHTMLをCSSで画面幅に応じて組み替える作り方を指します。スマホ用に別のURLを用意する方式や、同じURLで端末ごとに違うHTMLを返す方式もあり、レスポンシブはその選択肢のひとつにすぎません。

ここが肝心なのですが、レスポンシブで作ってあってもモバイルフレンドリーでないサイトは珍しくありません。たとえば、料金表だけが画面の右へはみ出していて、価格を確かめられないまま客が戻っていく。テーマは画面幅に合わせて組み替わっているのに、店があとから貼った表や画像がその仕組みの外に残っている、という形です。

つまり「レスポンシブテーマを入れたから対応済み」とは言い切れません。手法を採用したことと、使える状態になっていることは別の話です。しかも崩れは、同時に複数起きていても被害の大きさが揃いません。電話が主導線の業種で番号が押せないのと、料金表がはみ出しているのとでは、失っているものの大きさが違う。どれが効いているかの判断は、その店がどこで成約しているかによって変わります。

モバイルファーストインデックスとの関係

モバイルファーストインデックス（MFI）は、検索エンジンがサイトを評価する際の基準を、パソコン版ではなくスマートフォン版のページに置く仕組みです。移行はすでに完了しており、現在はスマートフォン用のクローラーで巡回されるのが前提になっています。

店舗サイトにとっての実務的な意味は、ひとつに集約されます。スマホ版に載っていない情報は、評価の材料にならない可能性があるということです。

ありがちなのが、「スマホでは長すぎるから」という理由でサービス説明を削り、見出しを減らし、構造化データを外してしまっているパターン。パソコンで見れば情報が揃っているのに、評価の基準になる側が痩せている状態です。

スマホで離脱を招く条件

ここからは具体です。店舗サイトで離脱を招いている崩れは、どれも作った側の端末では起きにくいという共通点を持っています。

たとえば、リンクやボタンが指の腹に対して小さい、あるいは近すぎる状態。指はマウスカーソルより太いので、詰まった場所では誤タップが起きます。厄介なのは、作った本人は迷わず押せてしまうことです。どこにボタンがあるか知っている人の操作では、この問題は再現しません。

店舗サイトで致命的な部類に入るのが、押しても何も起きない電話番号です。もっとも成約に近い動作がそこで空振りし、客は番号を書き写したりはせず、検索結果に戻って次の店に電話をかけます。

ほかにも崩れ方はいくつもあります。ただ、どの崩れが効いているかは、その店がどこで成約しているかで変わります。電話で予約が入る店と、フォームで問い合わせが入る店とでは、同じ崩れでも失っているものの大きさが違います。

なぜ店側からは崩れに気づけないのか

前述のとおり、合否を一発で出してくれる専用ツールは現在提供されていません。確認の手段そのものはブラウザやSearch Consoleの中にいくつか残っていますが、どれも「どこが崩れているか」の一部を映すだけで、「その崩れでいくら取りこぼしているか」までは示してくれません。

しかも、店側の目はいちばん崩れを見落としやすい位置にあります。作った人はボタンの場所を知っているので迷わず押せる。普段使っている端末と回線では表示が速い。パソコンで更新作業をしているので、スマホで開くのは公開した直後の一度きり。写真を1枚差し替えただけでレイアウトが崩れることもあり、そうした崩れは気づかれないまま残りやすく、残っている間ずっと予約を取りこぼします。

※当社FACTORがこの点検を引き受けるとき、見ているのは自店のサイト単体ではありません。同じ地域・同じ業種で客が比較している競合のページがスマホでどう見えているか、そして検索から来た客がどの入口から入ってどこで離れているかまで並べて、どの崩れから手を入れるかを決めています。比較される相手の側の見え方は、自店の管理画面にもアクセス解析にも一行も残りません。店側で組み立てにくいのは手間の問題ではなく、その記録を取る手段が店の中に最初から無いからです。

自サイトのどの崩れが実際に予約の取りこぼしにつながっているのかは、ページの構成と流入の入り方を突き合わせないと決められません。とくにGoogleマップから来た客が最初に着地するページで崩れていれば、マップでどれだけ選ばれても予約は残りません。入口になっているマップ側で自店がどう見えているかは、無料のAI診断にGoogleマップのURLを貼ると要点がその場で表示されます。

直す順番はなぜ店ごとに違うのか

手を入れる箇所が同じでも、ページ全体の土台と成約の導線のどちらから入るかで、同じ工数の成果が反転します。電話が主導線の店とフォームが主導線の店でも、打ち手がそもそも逆を向きます。一律の順番があるように見えて、実際には自店のどこで成約が起きているかを知らないと決められません。

「スマホ対応のためにサイトを作り直す」という話にもなりがちですが、原因が分からないまま作り直すと、同じ問題を新しいデザインで再現することになります。作り直すにしても、どこで離脱が起きているかを数字で押さえたうえで進めたほうが、投資が無駄になりません。原因を掴んでから作り直せば、次のデザインで何を守るべきかが決まります。崩れたまま過ごす一日ごとに、検索から来た客の一部が隣の店に流れていることも忘れないでください。

よくある質問

まとめ

モバイルフレンドリーは合否のラベルではなく、スマホの画面と指の操作で内容が読めて操作できるか、という状態を指す言葉です。レスポンシブで作ってあっても、料金表がはみ出し、電話番号が押せないなら、その状態には届いていません。評価の基準がスマホ版に置かれている今、スマホ版から抜け落ちた情報はそのまま評価から抜け落ちます。そして本当に効いてくるのは、崩れのどれが売上に触れているのかの見極めです。崩れの数を数えても優先順位は出ませんし、作った側の端末からは崩れそのものが見えにくい。比較されている競合の見え方と自店の離脱の位置は店の中からは再現できないので、それを持っている側に出してもらうほうが早く、取りこぼしが続く期間も短くて済みます。