01はじめに|「スマホで見づらい」は、見た目だけの問題ではありません
要点: スマホ対応していないホームページは、検索評価と問い合わせの両方でつまずきます。いま見にくる人の多くはスマホからです。入口が詰まった状態なので、放置するほど損が積み上がります。
「パソコンでは問題ないのですが、スマホだと字が小さくて」。この一言から始まるご相談が増えています。
担当者の方はパソコンで確認するので、崩れに気づきにくいものです。一方、お客様は電車の中やお店の前で、片手のスマホから見ています。ここに大きなずれがあります。
そこでこの記事では、2000年創業のWeb制作会社ZenWeb Japanが相談を受けたときに見ている順番でお伝えします。「どこが崩れていて、いくらで直るのか」までたどり着ける進め方です。
- 扱うもの。 起きること、崩れる原因、自社サイトの確かめ方、直す方法3通りの費用と期間、直したあとの変化。
- 扱わないもの。 作り直すかどうかの判断。そこはホームページリニューアルとリニューアルのタイミングの記事にまとめています。
まず自社サイトの状態を知りたい、という段階の方へ。
URLをお知らせいただければ、スマホでどこが崩れているかを確認してお伝えします。リニューアルの相談内容を見る →
まずは考え方をおさらいします。次の動画が、方法の違いの整理に役立ちます。
ホームページ制作におけるスマホ対応の方法や考え方。レスポンシブかユーザーエージェントか徹底的に解説!
出典動画:ホームページ制作におけるスマホ対応の方法や考え方。レスポンシブかユーザーエージェントか徹底的に解説!(YouTube)
02ホームページ スマホ対応とは|モバイルフレンドリーの中身を整理します
要点: ホームページのスマホ対応とは、小さい画面でも読める・押せる・迷わない状態にすることです。モバイルフレンドリーという言葉も中身はほぼ同じで、デザインを新しくすることとは別の話です。
スマホ対応という言葉は広く使われますが、中身を分けると4つだけです。
- 読める。 拡大しなくても本文が読める大きさになっている。
- 押せる。 ボタンやメニューが指で押せる大きさと間隔になっている。
- はみ出さない。 横スクロールが出ず、画面の幅にきちんと収まっている。
- 待たされない。 通信環境がよくない場所でも、開くまでに時間がかからない。
この4つがそろっている状態を、一般にモバイルフレンドリーと呼びます。Googleも検索セントラルのモバイルファーストインデックスの解説で、モバイル向けの表示を基準にページを評価すると説明しています。つまり、パソコンでどれだけきれいに見えていても、評価の土台はスマホ側にあります。
ここで一つ分けておきたいことがあります。デザインの新しさと、スマホ対応は別物です。10年前の見た目でも、読めて押せていれば対応は成立します。逆に、新しく見えるのに横スクロールが出るサイトもあります。
03スマホ対応していないと、実際に何が起きるのか
要点: 起きることは3つです。検索で見つけてもらいにくくなること、来てもらっても読まれずに離脱すること、会社の印象が下がること。売上への影響は、この3つが重なった先に出てきます。
「順位が下がる」という説明はよく見かけますが、それだけでは打ち手につながりません。実際の影響を、起きる順番に並べます。
- 検索の入口が狭くなる。 Googleはスマホ向けの表示を基準にページを評価します。読みにくい状態がそのまま評価の材料になるため、同じ内容でも上位に出にくくなります。
- 来てもらっても、読まれない。 拡大しないと読めないページは、指を2回動かした時点で閉じられます。内容の良し悪しを判断される前に離脱が起きます。
- 会社の印象が下がる。 問い合わせ前に会社を確かめる場面で崩れたページが出ると、「いまも動いている会社か」という不安につながります。
3つ目は数字に出ませんが、影響は大きい部分です。BtoBでは、担当者が上司にサイトを見せる場面があります。そのときスマホで開かれ、崩れがそのまま印象になります。
検索順位より先に落ちるのは、読まれる確率と、信用してもらえる確率です。
スマホ対応の不備は、リニューアル相談で最も多い課題の一つです。ほかのつまずき方はリニューアルの失敗例にまとめています。
04スマホ 表示 崩れが起きる4つの原因
要点: スマホ 表示 崩れの原因は、ほとんどが4つです。画面幅の指定がない、固定幅で作られている、画像や表が大きすぎる、後から足したパーツが対応していない。原因ごとに直す手間が違います。
原因を分けておくと、見積りの読み方が変わります。全部を作り直さなくても直るものがあるからです。
- 画面幅の指定がない。 ページの先頭にある1行の設定が抜けていると、スマホがパソコン用の幅で表示しようとします。文字が一気に小さくなる、典型的な症状です。
- 固定幅で作られている。 「横は950px」という前提で組まれたサイトです。2010年代前半までのサイトに多く、画面幅に合わせて縮まないため横スクロールが出ます。
- 画像や表が画面より大きい。 全体は対応しているのに、料金表や大きな写真だけがはみ出すパターンです。1ページだけで起きることもあります。
- 後から足したパーツが未対応。 予約フォーム、地図、外部サービスの埋め込みなど。本体は問題なくても、追加部分だけ崩れます。
上の2つは土台そのものの話で、下の2つは該当ページだけで済むことが多くなります。見積りが数万円で収まるか数十万円になるかは、この境目で決まります。
どれに当てはまるかは、ページを1枚ずつ見ないと判断できません。手順はリニューアル前のサイト診断と同じです。仕分けまでいけば、見積りの材料になります。
05自社サイトが対応できているか、5分で確かめる方法
要点: 特別なツールは要りません。自分のスマホでサイトを開き、5つの動作を試せば判断できます。とくに料金ページと問い合わせフォームは、必ず自分の指で操作してみてください。
診断ツールの点数から入ると判断が鈍ります。手を動かすほうが早いです。
- 拡大せずに本文が読めるか。 指で広げないと読めないなら、その時点で対応できていません。
- 横スクロールが出ないか。 ページを左右に振ってみて、動くようなら幅がはみ出しています。
- メニューが開けるか。 パソコン用の細いメニューがそのまま並んでいる場合、指では押しにくくなります。
- 問い合わせフォームが最後まで入力できるか。 入力欄が画面外に出る、送信ボタンが押せないといった不具合が残りがちです。
- 電話番号がタップで発信できるか。 画像で作られた電話番号は押しても反応しません。取りこぼしが起きやすい箇所です。
とくに見落とされるのが4番と5番です。自社サイトから問い合わせをすることはないので、フォームが壊れていても何年も気づきません。公開後の点検項目は公開後にやることにまとめています。
06レスポンシブ 化と、スマホ専用サイト。どちらを選ぶか
要点: 中小企業のコーポレートサイトなら、レスポンシブ 化を選べば問題ありません。1つのページが画面幅に合わせて形を変える方式で、更新も1回で済みます。スマホ専用サイトは管理の手間が倍になります。
方式は大きく2通りです。違いは「ページを1つにするか、2つに分けるか」にあります。
- レスポンシブ 化。 URLもページも1つのまま、画面の幅に応じてレイアウトが変わります。更新は1回で両方に反映されます。
- スマホ専用サイト。 パソコン用とスマホ用を別々に用意し、端末を判別して振り分けます。画面ごとにまったく違う見せ方ができる代わりに、更新が2回になります。
Googleもレスポンシブ 化を推奨しています。同じURLに情報が集まり、評価が分散しないためです。実務上の理由もあります。更新が2倍になる仕組みは、だいたい片方が更新されなくなります。スマホ側だけ料金が古いまま、という状態はよく見かけます。
スマホ専用サイトが向くのは、会員向けの操作画面のように見せ方を大きく変えたい場合です。会社案内・サービス紹介・採用情報という構成なら、その必要はありません。新規制作の考え方はホームページ制作サービスにまとめています。
07部分的に直すか、作り直すか。判断の分かれ目
要点: 分かれ目は3つです。土台が固定幅か、ページ数が30を超えるか、中身も見直したいか。1つでも当てはまるなら、部分対応より作り直しのほうが結果的に安くつきます。
「とりあえずスマホだけ直せませんか」というご相談は多いのですが、答えはサイトの状態で変わります。判断材料は3つです。
- 土台が固定幅で組まれている。 この場合、部分的に直しても別の場所が崩れます。土台を入れ替えることになるので、実質的には作り直しに近い作業量です。
- ページ数が30を超える。 1ページずつ手当てすると枚数分の費用がかかります。ある枚数を超えると、作り直したほうが合計は安くなります。
- 掲載内容も古い。 サービス内容や実績が実態と合っていないなら、表示だけ直しても問い合わせは増えません。原稿から見直す価値があります。
逆に、土台がレスポンシブで崩れが数ページなら、部分対応で十分です。費用の考え方はリニューアル費用と内訳で項目ごとに解説しています。
部分対応で足りるのか、判断がつかないときは。
ページ数と現在の作りを拝見すれば、どちらが安く済むかをその場でお伝えできます。リニューアルの進め方を確認する →
08いま、サイトはどの端末から見られているか
要点: 業種差はありますが、コーポレートサイトの閲覧はすでにスマホが中心です。BtoCに近いほど傾向が強く、BtoBでも半分を超えます。社内の感覚とは別に、自社の実数を確認してください。
総務省の令和7年版情報通信白書によると、2024年の端末別インターネット利用率はスマートフォンが74.4%、パソコンが46.8%でした。ただ、これは全体の数字です。自社の業種ではどうかを知るために、当社が担当するサイトの閲覧比率を集計しました。
| 業種 | スマホ | パソコン | 閲覧が多い時間帯 |
|---|---|---|---|
| 飲食・小売 | 83% | 17% | 夕方〜夜 |
| 医療・クリニック | 79% | 21% | 朝・夜 |
| 建設・リフォーム | 71% | 29% | 昼休み・夜 |
| 士業・コンサルティング | 62% | 38% | 平日日中 |
| 製造・BtoB卸 | 54% | 46% | 平日日中 |
出典:ZenWeb Japanが制作・メンテナンスを担当するサイトの閲覧比率集計(日本国内、2024〜2026年)。タブレットは含みません。
いちばん低い製造・BtoB卸でも、スマホが半分を超えます。「法人向けだからパソコンで見られている」という前提は成り立ちません。取引先の担当者も、移動中にスマホで会社を確かめています。
09崩れているのは、どのページがいちばん多いか
要点: 崩れが集中しているのはトップページではありません。料金表・問い合わせフォーム・会社概要という、判断材料になるページです。いちばん見られたいページから取りこぼしています。
スマホ 表示 崩れがどのページで起きているのか、相談時の確認結果を集計しました。
| ページの種類 | 崩れの発生率 | 割合の目安 | 代表的な症状 |
|---|---|---|---|
| 料金・サービス一覧 | 68% | 表が画面からはみ出す | |
| 問い合わせフォーム | 54% | 送信ボタンが押しにくい | |
| 会社概要・アクセス | 47% | 地図と表が収まらない | |
| 実績・事例紹介 | 35% | 写真が大きすぎて重い | |
| トップページ | 22% | メニューが押しにくい |
出典:ZenWeb Japanがリニューアル相談時に実施した表示確認の集計(日本国内、2024〜2026年)。
トップページがいちばん低いのは偶然ではありません。手を入れる機会が多いページほど、崩れは早く直されます。料金表や会社概要は一度作ったら触らないので、古い作りのまま残ります。しかも上位3つは、お客様が発注を判断する直前に見るページです。
10対処法3通り。費用と期間はどれだけ違うか
要点: 対処法は、崩れたページだけ直す・土台をレスポンシブ 化する・作り直すの3通りです。費用の幅は大きいものの、選べる範囲はサイトの作りでほぼ決まります。安い順に検討して構いません。
20ページ前後のコーポレートサイトを想定した目安です。金額は現状の作りで動くため、幅を持たせたモデル試算になります。
| 対処法 | 費用の目安 | 期間の目安 | 向いているケース |
|---|---|---|---|
| 崩れたページだけ個別に修正 | 3万〜15万円 | 1〜2週間 | 土台はレスポンシブで、崩れが数ページ |
| 土台をレスポンシブ 化(見た目は維持) | 30万〜80万円 | 1〜2か月 | 固定幅だが、内容と構成は使える |
| 構成から作り直す | 80万〜250万円 | 2〜4か月 | 内容も古く、問い合わせも増やしたい |
出典:ZenWeb Japanによるモデル試算(日本国内、2026年時点、税別)。原稿・写真の準備状況により変動します。
気をつけたいのは真ん中です。「見た目はそのままでスマホだけ直す」は、思ったより安くありません。既存のデザインを崩さずに土台を入れ替える作業は、新しく作るより手間がかかることもあるためです。新規制作の相場と比べるなら、ホームページ制作の費用相場の規模別早見表が物差しになります。
11スマホ対応のあと、数字はどう動くか
要点: 変化はすぐには出ません。1か月目に動くのは滞在時間とフォーム完了率で、検索経由の流入は2〜3か月目からです。この順番を知っておくと、途中で不安になりません。
スマホ対応の効果を、公開直後の検索順位だけで判断してしまう方が多くいます。実際には順番があります。
| 指標 | 対応前 | 1か月後 | 2か月後 | 3か月後 |
|---|---|---|---|---|
| スマホでの平均滞在時間 | 100 | 131 | 138 | 142 |
| フォーム入力の完了率 | 100 | 124 | 129 | 133 |
| 検索経由の閲覧数 | 100 | 103 | 115 | 127 |
| 問い合わせ件数 | 100 | 108 | 122 | 140 |
出典:ZenWeb Japanが担当したスマホ対応案件の前後比較(日本国内、2024〜2026年)。対応前の3か月平均を100とした指数です。
見てほしいのは動く順番です。滞在時間とフォーム完了率は1か月目から動きます。読める、押せるという直接の効果だからです。一方、検索経由の閲覧数は2か月目からゆっくり上がります。Googleの再評価に時間がかかるためです。1か月目で順位が変わらないのは、失敗ではありません。
自社サイトでも同じ変化が見込めるか、確かめてみませんか。
現在の閲覧比率と崩れの状況を拝見して、直したときに動きそうな指標をお伝えします。リニューアルの相談内容を確認する →
12スマホ最適化では、表示速度も一緒に見直します
要点: スマホ最適化は、レイアウトを整えるだけでは半分です。通信環境が不安定な場所も多いため、開くまでの速さが体感に直結します。画像の重さを見直すだけでも変わります。
レイアウトを直したのに手応えが薄いときは、速度が原因のことがあります。よくあるのは次の3つです。
- 写真がパソコン用のまま。 一眼で撮った数MBの写真をそのまま載せているケースです。スマホでは表示に何秒もかかります。
- 使っていない機能が残っている。 過去に入れたスライドショーや解析タグが動き続け、読み込みを遅くします。
- 外部サービスの埋め込みが多い。 地図、SNS、動画を1ページに詰めるほど待ち時間が増えます。
写真の軽量化は費用対効果がいちばん高い作業で、見た目を変えずに数秒縮むこともあります。順位を落とさずに進める手順は移行チェックリストにまとめています。
13自社で直すか、制作会社に依頼するか
要点: 管理画面から文章や画像を差し替えられる範囲なら、自社で対応できます。テンプレートやプログラムに触る必要が出たら、制作会社に依頼したほうが安全です。境目は「元に戻せるか」です。
自社でどこまでやるかは、技術の有無より復旧のしやすさで決めてください。
- 自社でできること。 大きすぎる画像の差し替え、はみ出す表の作り直し、長い見出しの短縮。管理画面で完結し、間違えても戻せます。
- 依頼したほうがよいこと。 テンプレートの編集、CSSの追加、フォームの作り替え、土台のレスポンシブ 化。表示全体に影響し、途中で止まると戻せません。
気をつけたいのは、公開中のサイトを直接いじることです。作業中の崩れた状態を、そのままお客様に見られます。本番以外で確認できる環境を用意してから進めてください。依頼先の見方は制作会社の選び方にまとめています。
14まとめ|スマホ対応は、見た目ではなく入口の問題です
要点: ホームページ スマホ対応は、デザインの新しさではなく、入口が開いているかどうかの問題です。自分のスマホで料金・フォーム・会社概要の3枚を確認し、原因を分けてから範囲を決めてください。
ここまでの流れを、動ける形に並べ直します。
- 自分のスマホで開く。 料金ページ、問い合わせフォーム、会社概要の3枚を、実際に指で操作します。
- 原因を分ける。 土台側(固定幅・画面幅の指定なし)か、ページ側(画像・表・埋め込み)かを見分けます。
- 直す範囲を決める。 部分修正・レスポンシブ 化・作り直しの3通りで見積りを取り、金額を比べます。
- 3か月は数字を見る。 滞在時間とフォーム完了率から動きます。検索の反応はそのあとです。
当社は2000年の創業以来、PNHグループの一員として、ホームページ制作とWebシステム開発を専門にしてきました。作るところと直すところに集中している会社です。「日本品質を適正価格で」という考え方のまま、ホームページリニューアルのご相談をお受けしています。
15よくある質問
1. スマホ対応していないと、検索順位は必ず下がりますか
必ず下がるとは言い切れません。ただGoogleはスマホ向けの表示を基準に評価するため、同じ内容なら読みやすいページが有利になります。競合が対応済みで自社だけ未対応なら、差は開いていきます。
2. スマホ対応だけを部分的に依頼できますか
できます。崩れが数ページで土台がレスポンシブなら、3万〜15万円程度で収まることもあります。ただし土台が固定幅の場合は、直しても別の場所が崩れるため、範囲を広げる判断が必要です。
3. 古いサイトでも、見た目を変えずにスマホ対応できますか
技術的には可能ですが、費用は思ったほど安くなりません。デザインを保ったまま土台を入れ替える作業は手間がかかるためです。作り直しの見積りも並べて比べてください。
4. モバイルフレンドリーかどうかは、どこで確認できますか
いちばん確実なのは、自分のスマホで開いて操作することです。拡大せずに読めるか、横スクロールが出ないか、フォームを最後まで入力できるか。この3つが問題なければ対応できています。
5. レスポンシブ 化にはどのくらいの期間がかかりますか
20ページ前後のコーポレートサイトで1〜2か月が目安です。原稿や写真を差し替える場合は、その準備期間が加わります。公開日が決まっているなら、1か月ほど余裕を持って着手してください。
スマホでの見え方、一度確認してみませんか。
サイトのURLをお知らせいただければ、どのページが崩れていて、部分修正で足りるのか作り直しが必要なのかをお伝えします。2000年創業のZenWeb Japanが、日本品質を適正価格でお手伝いします。
無料で相談する →