ホームページのスマホ対応！確認方法と直すか作り直すかの判断基準

自社のホームページがいつまで経ってもスマホ対応されない。
お客様からしたら見づらいだろうな。。。
こんな状態でずっと自社ホームページを放置していませんか？

直したほうがいいのは分かっていても、いくらかかるのか、そもそも何をすればいいのかが分からず、そのままになっている方が多いように感じます。

この記事では、まず自分のホームページがスマホ対応になっているかを確かめる方法から始めて、対応する4つの方法、費用、そして直すか作り直すかの判断基準までをまとめました。読み終えたときに、次に何をすればいいかが決まっている状態になると思います！

何から手をつければいいか決められない、という方は、制作から公開後の更新までまとめてお任せいただけるサービスもあります。ホームページできるくんもあわせてご覧ください。

サブスク型ホームページ制作
月額2,500円〜
制作から更新まで対応します！

ホームページのスマホ対応とは？自分のホームページを4つで確かめる

スマホ対応という言葉は、なんとなく「スマホで見られること」だと思われがちです。
まず言葉の意味をそろえてから、自分のホームページを確かめる手順に進みます。特別なツールは要りません。

スマホ対応とは「拡大せずに読めて、そのまま操作できる」状態

スマホ対応とは、スマホの画面で拡大や横スクロールをしなくても内容が読めて、ボタンやメニューをそのまま操作できる状態のことです。

ここで大事なのは、画面に表示されること自体は、対応しているという意味ではないという点です。

パソコン向けに作られたホームページも、スマホのブラウザで開けば一応表示はされます。ただし、パソコンの画面をそのまま縮めた形で表示されるので、文字は小さく、リンクは押しにくくなります。見えてはいるけれど読めない、という状態です。

自分のスマホで開いて、4つ見る

確かめ方はとても単純です。自分のスマホで自社のホームページを開いて、次の4つを見てください。

見るところ	対応できていないホームページの症状
文字	指で拡大しないと本文が読めない
横幅	横にスクロールしないと全体が見えない
ボタン・メニュー	小さくて押し間違える
電話番号	タップしても発信できない

1つでも当てはまれば、そのホームページはスマホ対応になっていないと考えていいでしょう。

とくに見落とされやすいのが4つ目の電話番号です。パソコン向けのホームページでは電話番号が文字や画像で置かれているだけのことが多く、スマホでタップしても何も起きません。問い合わせの多くが電話という業種だと、これだけで機会を逃していることになります。

表がはみ出して右側が切れている、写真が画面いっぱいに広がって文章が下に押し出されている、といった崩れもあわせて確認しておくと、あとで制作会社に相談するときに話が早くなります。

スマホ対応にしていないと何が起きるか

スマホ対応は「そのほうが親切だから」という話に留まりません。放置していると、問い合わせの数そのものに影響します。

ここでは起きることを3つに分けて説明します。

読む前に閉じられる

スマホで開いて文字が小さかったとき、わざわざ指で拡大して読んでくれる人は多くありません。多くの方は数秒で戻ってしまいます。

つまり、内容がどれだけ良くても読まれないまま終わります。せっかく費用をかけて作ったサイトなのに、いちばん人数の多いスマホからの訪問者に届いていない、という状態になります。

検索で不利になる

Googleは、スマホで見たときのページを基準にホームページを評価しています。

パソコンでの見え方が整っていても、スマホで崩れていれば、その崩れた状態が評価の対象になります。検索から人を集めたいと考えているのなら、スマホ対応は前提条件に近いといえます。

検索順位を上げる観点でやるべきことは他にもあります。あわせてSEOに強いホームページの特徴もご覧ください。

問い合わせにたどり着けない

読んでもらえたとしても、最後の一歩でつまずくことがあります。

入力欄が小さくて名前を打ち間違える、送信ボタンが画面の外にあって押せない、電話番号がタップできない。問い合わせフォームまで進んだ方が離脱するのは、いちばん惜しい失い方です。

ホームページの入口ではなく、出口で起きている問題なので気づきにくい点にも注意が必要です。

ホームページをスマホ対応にする4つの方法

ここからが本題です。スマホ対応にする方法は、大きく4つに分けられます。

どれが向いているかは、今のホームページの作りと予算で変わります。まず全体を見比べてから、それぞれを説明します。

方法	費用の目安	期間	向いているホームページ
レスポンシブデザインにする	中〜高	数週間〜	幅の変化を考えて作られたホームページ
変換ツールを使う	低	数日〜	とりあえず急いで整えたいホームページ
作り直す	中〜高	1ヶ月〜	パソコン専用に作られた古いホームページ
スマホ専用ページを別に作る	高	数週間〜	（今はあまり選ばれません）

レスポンシブデザインにする（今の標準）

レスポンシブデザインとは、1つのページが画面の幅に合わせて形を変える方式のことです。パソコンでは横に3つ並んでいた要素が、スマホでは縦に1列で並ぶ、というような動きをします。

今のホームページ制作では、この方式が標準です。Googleもこの方式を推奨しています。URLがパソコンとスマホで同じままなので、管理する場所が増えないのも利点です。

今あるホームページをこの方式に変えられるかどうかは、その作りによって変わります。手直しで済む場合もありますし、作り直しに近い作業になる場合もあります。その見分け方は次の章でまとめました。

変換ツールを使う

今のホームページを読み取って、スマホ用の表示に自動で変換してくれるサービスもあります。

早くて安いのが利点です。元のサイトに手を入れずに始められるので、まず見た目を整えたいという場合には現実的な選択になります。

一方で、デザインの自由度は低くなります。用意された形に当てはめる仕組みなので、元のサイトの作りによっては崩れたままになることもあります。あくまで応急処置として考えて、後で作り直す前提で使うのが安全だと私は考えています。

作り直す

今のホームページを土台にせず、新しく作る方法です。

遠回りに聞こえるかもしれませんが、古いホームページの場合はこれがいちばん早くて安いことがあります。手直しの費用が積み上がって、結果的に新しく作るのと変わらない金額になるケースがあるためです。

どういうサイトがそれに当たるのかは、次の章で詳しく説明します。

スマホ専用のページを別に作る（今はあまり選ばれません）

パソコン用とスマホ用で別々のページを用意して、見ている端末によって表示を切り替える方式です。スマホが普及し始めた時期には、よく採られていました。

ただ、今から選ぶ理由はほとんどありません。

理由は3つあります。1つ目は管理する対象が2倍になること。2つ目は片方だけ更新して内容がずれる、という事故が起きやすいこと。3つ目はURLが分かれるため、ホームページ全体の評価がまとまりにくくなることです。

他社の解説記事では、レスポンシブデザインと並べて2つの選択肢として紹介されていることがあります。ですが実務では、特別な事情がないかぎりレスポンシブデザインを選ぶことになると思います。

直すか、作り直すか。判断が分かれるところ

ここがこの記事でいちばんお伝えしたいところです。

「スマホ対応にしたい」というご相談をいただいたとき、私たちが最初に見るのは今のホームページの作りです。というのも、手直しで直るものと、作り直したほうが早いものがはっきり分かれるからです。

分かれ目は「作られた当時、スマホが想定されていたか」

手直しで直るのは、もともと画面幅の変化を考えて作られたホームページだけです。

一方で、パソコンだけを想定して作られたホームページは、要素の並べ方そのものを組み替えることになります。作業量は新しく作るのに近づいていきます。

もう1つお伝えしておきたいことがあります。「デザインが古い」は見た目の話ではなく、作りがパソコン専用である症状です。
見た目が古いホームページは、たいてい中身の作りも当時のままです。だから「デザインはこのままでいいのでスマホだけ対応させたい」というご要望は、実は難しい注文になります。見た目を変えずにスマホ対応にする、という形にはなりにくいのです。

作り直したほうが早いホームページの見分け方

専門知識がなくても確かめられる目印を挙げます。

目印	何を意味するか
パソコンでウィンドウの幅を狭めても、並びが変わらない	幅の変化が想定されていない
見出しやバナーの文字が画像になっている	スマホで読めるサイズにできない
表が多く、横に長い	スマホの幅に収まらない
作ってから10年以上、作りを触っていない	当時の前提が今と違う

1つ目は今すぐ試せます。パソコンでホームページを開いて、ブラウザの右端を左に引っぱって幅を狭めてみてください。文字の折り返しや要素の並びが変わっていくなら、幅の変化を考えて作られています。何も変わらずに横スクロールが出てくるなら、幅が固定されています。

複数当てはまる場合は、手直しの見積もりを取ったうえで、新しく作る場合の見積もりも並べて比べることをおすすめします。比べてみて初めて、手直しが割高だと分かることがあります。

見積もりが妥当か分からない、という場合はホームページ制作のセカンドオピニオンも参考になるかと思います。

スマホ対応にかかる費用

費用は方法によって幅があります。ここでは考え方を整理します。

金額は今のホームページの作りとページ数で変わるため、一律の相場としてお伝えするのは難しいところです。そのうえで、目安の立て方をまとめました。

やり方	費用の考え方
変換ツールを使う	ツールの利用料（多くは月額）
一部のページだけ直す	ページ単位の改修費
ホームページ全体を直す	ページ数と作りの複雑さによる
作り直す	新しく作るのと同じ

作り直しになる場合、費用は新規制作とほぼ同じと考えて構いません。

新規制作の相場はホームページ制作の費用相場でまとめているので、作り直しの予算を立てるときはこちらをご覧ください。手直しの費用を判断するときの基準にもなります。

公開後の更新や修正にかかる費用はホームページの更新費用で扱っています。

費用を考えるときのコツを1つ挙げておきます。改修費や制作費は、月額に割って考えると判断しやすくなります。

ホームページは一度作れば数年使うものです。仮に5年使うとして総額を60で割れば、月あたりいくらの投資かが出ます。数十万円という金額だけを見ると高く感じますが、月額に置き換えると他の販促費と比べられるようになります。社内で説明するときにも使える考え方です。

なお、これから新しく作るのであれば、スマホ対応が最初から含まれているかどうかを確認しておくと安心です。今のホームページ制作ではほぼ標準になっていますが、念のため見積もりの段階で聞いておくとよいでしょう。

作り直すことになった場合、新しく作るホームページが最初からスマホ対応になっていれば、同じ問題は起きません。素材づくりから公開後の更新までまとめてお任せいただけるホームページできるくんもご検討ください。

サブスク型ホームページ制作
月額2,500円〜
制作から更新まで対応します！

自分でスマホ対応にする方法

外注せずに自分で対応したい、という方もいるかと思います。条件によっては可能です。
ここでは自分で進める場合の方法と、つまずきやすいところをまとめます。

WordPressならスマホ対応のデザインに変える

今のホームページがWordPressで作られている場合は、デザインの型（テーマと呼ばれます）を、スマホ対応のものに入れ替える方法があります。

作業自体は難しくありません。ただし見た目が変わります。 今のレイアウトをそのまま引き継ぐことはできないので、「デザインは変えずにスマホ対応だけしたい」という場合には向きません。

自社のホームページがWordPressで作られているかどうかが分からない場合は、作った会社に聞くのが早いです。

ノーコードのツールで作り直す

WixやSTUDIOのように、専門知識がなくてもホームページを作れるサービスもあります。これらは最初からスマホ表示が用意されているので、作り直しの手段としては現実的です。

無料で試せるものも多いので、まず触ってみて自分でできそうか確かめる、という進め方もできます。

ただし、ページ数が多いサイトや、業種特有の機能が必要なものを自分で作りきるのは、思ったより時間がかかります。本業の合間に進めることを考えると、外注と比べて「安いかどうか」ではなく「自分の時間をどれだけ使えるか」で判断したほうがよいと思います。

自分でやると詰まりやすいところ

実際にご相談をいただくなかで、つまずきやすいのは次の3つです。

1つ目は画像です。パソコン向けに用意した大きな写真をそのまま使うと、スマホでの表示が重くなります。見た目は整っているのに、読み込みが遅くて離脱される、という形で表れます。

2つ目は表です。料金表や仕様表をスマホで読める形に直すのは手間がかかります。

3つ目はドメインです。作り直す場合、今のホームページのアドレス（ドメイン）を引き継げるかどうかを先に確認してください。ここが分からないまま進めると、公開直前に止まります。

スマホ対応はどこに相談して、何を伝えるか

外注する場合、どの会社に相談すればいいのかが分かりにくいところです。今のホームページを作った会社なのか、新しい会社なのか。ここを整理しておきます。

結論から言うと、まずは今のホームページを作った会社に聞くのが早いです。 ただし連絡が取れない場合は話が変わります。

まずは今のホームページを作った会社に聞く

今のホームページを作った会社は、その中身を知っています。だから手直しで直るのか、作り直しになるのかの判断がいちばん早く出ます。

見積もりが出てきたら、前の章の見分け方と照らしてみてください。手直しの見積もりが新しく作る金額に近づいているなら、作り直しも選択肢に入ります。

そのときに「作り直したほうがいいですか」と率直に聞いてみるのもよいと思います。自社の売上が下がる提案でも正直に伝えてくれる会社は、その後も付き合いやすい相手です。

連絡が取れないなら、作り直しを前提に新しい会社を探す

作った会社と連絡が取れない、廃業している、当時の担当者がいない。これは珍しい話ではありません。

この場合、他社が作ったホームページの中身を引き継いで手直しするより、新しく作り直すほうが早いことがほとんどです。 そのサイトを調べて手を入れるには、まず中身を読み解く作業が必要になり、その手間が費用に乗ります。

ですので、連絡が取れないと分かった時点で、作り直しを前提に新しい制作会社を探すほうが話が早く進みます。

このとき最初に確認したいのが、今使っているアドレス（ドメイン）とサーバーの契約がどこにあるかです。基本は自社で管理するのがおすすめです。ただ、知識や時間がなくて難しいという場合は、制作会社に任せるのもありです。

制作会社を変えるときの流れはホームページ制作会社の乗り換えでまとめています。

ホームページ制作会社に相談するときに伝える3つのこと

どこに相談する場合でも、伝える内容は同じです。次の3つを最初に渡せば、初回のやりとりで概算が出てきます。

1. 今のホームページのURL
2. スマホで確認した結果（どのページの、どこがどう崩れているか）
3. 手直しをしたいのか、作り直してもいいのか

2つ目は、この記事の最初に確認した内容がそのまま使えます。「文字が小さくて読めない」「メニューが押せない」といった言葉で構いません。専門用語に直す必要はありません。

3つ目を伝えておくと、提案の幅が変わります。「手直しでお願いします」と限定してしまうと、作り直したほうが安いケースでもその提案が出てこないことがあるためです。予算の上限も一緒に伝えると、その範囲での現実的な案が返ってきます。

まとめ

この記事では、ホームページのスマホ対応について、確認の方法から費用、直すか作り直すかの判断までを解説しました。

• スマホ対応とは、拡大せずに読めてそのまま操作できる状態のこと
• 確認は自分のスマホで開いて、文字・横幅・ボタン・電話番号の4つを見る
• Googleのモバイルフレンドリーテストは終了しているので、ツールを探す必要はない
• 対応の方法は4つ。今の標準はレスポンシブデザイン
• 手直しで直るか作り直しになるかは、作られた当時にスマホが想定されていたかで分かれる
• 作り直しの費用は新規制作と同じと考える
• 相談するときは、確認した結果と「作り直してもいいか」を最初に伝える

いちばんお伝えしたいのは、手直しが必ず安いわけではないということです。パソコン専用に作られた古いホームページは、部分的に直すより新しく作ったほうが早くて安く済むことがあります。見積もりを1つだけ見て判断せず、両方を並べて比べてみてください。

何から手をつければいいか決められない、公開後の更新まで任せたいという方には、専任担当がまとめて対応するホームページできるくんが向いています。今のホームページの状態を見たうえで、手直しと作り直しのどちらがよいかからご相談いただけます。

サブスク型ホームページ制作
月額2,500円〜
制作から更新まで対応します！