ホームページをスマホ対応させる必要性とは？方法や費用も解説

「モバイルファーストインデックス」という言葉を聞いたことはありませんか。

いままで、Googleはパソコン用ページのコンテンツを元に評価していましたが、これからはモバイル用ページを元に評価するという取り組みです。スマホ対応ページがなければ評価できず検索結果に表示されない…という時代がやってくると予想されています。

つまり結論からいってしまえば、今やスマホ対応のモバイルページはどの業種にも必須なのです。

そこでこの記事では、今のホームページがスマホ対応できていない方や、これからホームページを作りたいと思っている方へ、Web制作のプロであるTRASPがスマホ対応の方法や重要性などについて初心者にもわかりやすく説明していきたいと思います。

ホームページのスマホ対応とは？

ホームページのスマホ対応とは、「レスポンシブデザイン」ともいい、文字どおりWebサイトをスマートフォンから閲覧できるようにすることです。

しかし、ただ「スマホから見られる」というだけでは、スマホ対応とはいえません。
なぜならスマートフォンでは、パソコン用サイトも見えてしまうためです。もしスマホ対応していないパソコン用サイトをスマートフォンから見たら、どのようなことが起きるでしょうか。

• マウスオーバーなど、マウスをのせることで変化する情報を見られない
• ボタンやリンクが小さすぎて押し間違える
• 文字が小さくて読めない

ホームページの横幅をスマホ画面に合わせると文字が小さくなってしまい読みにくく、文字が読めるよう拡大すると横にスクロールをしなくては見れないようになってしまいます。

つまり、スマホ対応していないホームページは、スマートフォンでは非常に見づらいといえます。

スマホ対応は単に「スマホで表示できる」だけでなく、スマートフォンで見やすいように設計（＝最適化）されたWebサイトということになるのです。

ホームページをスマホ対応していないとどうなる？

でも、スマホでも見られないことはないパソコン用サイト、スマホ対応しないといったいどのようなデメリットがあるのか、考えてみたいと思います。

モバイルファーストインデックスとは？

まず知っておきたいのが「モバイル・ファースト・インデックス」について。

前述したとおり、数年前からスマートフォンからの検索がパソコンよりも多くなっていることから、Googleではモバイル用ページの評価を検索結果の順位に反映させることを発表しました。これを「モバイル・ファースト・インデックス」といいます。

今までは主にパソコン用ページをインデックス（Googleサーチエンジンに登録）し、順位を決定していましたが、これからはモバイル用ページを元に決定されることになります。

まだ詳細な評価基準は明らかにされていませんが、もしスマホ対応のサイトがないホームページ、スマホからの使い勝手が悪いWebサイトは評価が下がり、検索結果に表示される順位が下がってしまうことが考えられます。

検索エンジンのシェアのほとんどを占めているGoogleからの評価を下げないためにも、既存のホームページがスマホ対応になっていない方、そしてこれからホームページを作ろうと考えている方は、レスポンシブデザインにしておくべきだといえるでしょう。

サイトが見づらく、離脱率が上がる

スマホ対応されていないパソコン用サイトをスマホで見るためには、一画面にはおさまりきらず拡大したり、横にスクロールしたりする必要があります。Webサイトが見づらいということは、訪問ユーザーにストレスを与えてしまうことになります。

見づらく、ストレスのたまるWebサイトはすぐに「戻るボタン」で離脱されてしまう可能性が高まります。

一般的に、Webサイトはアクセスして3秒で続きを見るか、それとも離脱するかが決まるといわれています。つまり、最初から見づらいホームページではどこもクリックされることなく、訪問ユーザーが回れ右をしてしまいます。ユーザーからの評価が低ければ、Googleからの評価も下がってしまうといえます。

訪問ユーザーが長くとどまり、その先までアクセスしてもらうにもスマホ対応が必須だといえるでしょう。

ホームページをスマホ対応するには2つの方法がある

ひと口にスマホ対応といっても、大きく分けて次の2つの方法があります。

この2つの方法は似ていますが、まったく違うものだと覚えておきましょう。

スマホ専用の別ページを作る

まず一つ目としては、パソコン用とスマホ用ホームページを別々のURLで作り、デバイスごとに切り替えるということです。

たとえば下記のようにホームページURLが異なります。

パソコンとスマホで別々の画面サイズを想定し作成していくため、デザインやレイアウトを細かく調整することが可能です。制約もなく自由度が高いので、UIに優れたホームページのができる、ユーザーの離脱率も抑えることができます。

しかし、2つ分のホームページを作成、管理するので、デザインは2種類作り、修正があった場合にもそれぞれを修正することになります。制作会社に依頼した場合は、費用が2サイト分かかることになるでしょう。

レスポンシブデザイン

そして二つ目としては、レスポンシブデザイン。

こちらはパソコン用とスマホ用で画像やテキスト、HTMLファイルなどは同じものを使用しますが、それぞれのデバイスの画面幅に合わせてデザインを変化させることができます。使用するのはCSSのみで、画面幅を指定し、デバイスに合った文字サイズやレイアウトを書き換えます。

デザインの自由度はなくスマホ用もパソコン用も同じになりますが、1つのHTMLファイルとCSSの管理だけなので、1か所の更新を行うとパソコン用もモバイル用もともに修正が反映される点はメリットだといえるでしょう。

そして現在のホームページ制作の主流としてGoogleが推奨しているのが、レスポンシブデザインです。レスポンシブデザインではない別々のURLになってしまうことで、ユーザー側・企業側・Google側とそれぞれの視点でのデメリットは次のとおり。

したがって既存のホームページをスマホ対応させる場合にも、スマホ対応したホームページを新規制作する場合でも、レスポンシブデザインが良い選択といえるでしょう。

重複コンテンツについて詳しく知りたい方はこちらの記事をご覧ください。

SEOの重複コンテンツとは？事例と避ける理由・対処法をプロが解説

 どんなに質の高いコンテンツを制作しても、SEOに悪影響を及ぼす原因となる要素が重複コンテンツです。 自社サイト内の重複コンテンツは検索順位やページ評価への影響、外部サイトとの重複コンテンツで...

ホームページをレスポンシブ化する方法3つ

スマホ対応＝レスポンシブデザインだということがわかったところで、具体的にどのようにしたら良いのか、解説していきます。

方法は、次の3つ。

新規作成する

既存のホームページが古いもので、ほとんど手つかずであればレスポンシブデザインで新規作成するのもひとつの方法です。ただコストがかかるため、リニューアルするのか新規作成するのか、慎重に判断しましょう。

変換ツールを使う

「flamingo （フラミンゴ）」はプログラミングレスでサイト改善を実現することができるため、UI・パフォーマンス・SEO改善、モバイル ファースト インデックス対応などに向いています。

こちらのような変換ツールを使うと、プログラミングの知識がなくても自社でスマホ対応させることが可能。ただ月間PV数によって数万円～数十万円と料金に幅があり、チュートリアルを見ながら自力行う必要があります。自社のリソースが足りていないなど、忙しく人手不足の企業には不向きかもしれません。

制作会社に依頼する

プロのホームページ制作会社に依頼することで、確実にレスポンシブデザインにすることが可能です。

レスポンシブデザインに対応していない制作会社はないと思いますが、料金や制作内容は制作会社によって大きく違います。次のような点に気をつけて、自社に合った制作会社を選びましょう。

• 自社の業界で実績があるか
• 見積もりに不明な点はないか
• サポートは充実しているか

TRASPは建設・鉄鋼・塗装・エステ・サロン・整体/整骨院・美容室・士業・飲食店・など日本にあるほとんどの業種のサポートを行ってきた豊富な実績があります。専属ディレクターが細かくヒアリングしながら、お客さまに合った6プランから提案させていただきます。⼩規模事業者持続化補助⾦を利⽤することも可能です。詳しくはお問い合わせください。

まとめ

スマホ対応には次のような理由から現在のホームページ運営においては必須ともいえます。

• ユーザーが使いづらく、離脱率が上がる
• Googleの検索順位が下がる可能性がある
• 検索流入数はスマートフォンが主流になりつつある

レスポンシブデザインにはメリットが多く、これからホームページつくるのであれば、モバイルユーザーを意識したホームページ制作をするようにしましょう。

TRASPはさまざまな業種のホームページをリニューアル・新規作成しております。無料相談も行っておりますのでお気軽にお問い合わせください。