ホームページをスマホ対応するメリットと外注費用の目安
- ［更新日］2021/11/08
- ［公開日］2019/04/24
- 2106 view
目次
ホームページをスマホ対応するメリットと外注費用の目安
本記事では、ホームページをスマホ対応させる方法の説明と、スマホ対応を外注する際の費用目安や外注先選定のポイントについて説明します。
リカイゼンでは、ホームページ制作実績を多数持つ会社の中から、ご要望に合う会社を厳選して無料でご紹介します。
お電話でのご相談は
03-6427-5422
ホームページのスマートフォン対応と聞いても、いまいちピンと来ない担当者の方もいるのではないでしょうか？
スマホ対応とは、スマートフォンで閲覧したときにホームページのデザインがスマホ画面に最適化して表示されることを指します（スマホ最適化表示）。
ここ数年のモバイル端末の普及によって、国民の9割近くの人がスマートフォンを利用する時代へと変化しました。それとともにスマートフォン専用のホームページも日々公開されている状況です。スマートフォン専用サイト（スマホ専用サイト）とは小さな画面サイズでも快適に見えるように作られたホームページを指します。
スマホ専用サイトの作り方としては、レスポンシブデザインにする方法と、スマホ専用にサイトデザインを設計する方法の2通りあります。制作する際に迷われるケースもあるようですが、最近ではスマホでもそれ以外のデバイスでも、そのデバイスに応じたデザイン表示ができるレスポンシブデザインが一般的です。
企画段階からのご相談も受付中！気軽に相談できるプロをご紹介いたします。
受付時間：平日10:00～18:30
1. ホームページのスマホ対応とは
スマホ対応されていないホームページといってもスマホで閲覧はできるため、なかなか理解し難い部分ではあります。よってここでは、まずスマホ対応の基本知識を紹介します。
スマホ最適化表示
例えば、以下のような表示はスマホに最適化されたホームページといえるでしょう。
スマホでネットサーフィンをしていると、表や画像が画面からはみ出していたり、文字サイズが非常に小さく表示されていたりするホームページを見かけないでしょうか？
このような表示崩れは、PC画面用に作られたホームページをスマホで閲覧したときによく発生します。スマホで表示が崩れるホームページは、たとえスマホから閲覧できていたとしても、スマホに最適化されているとは言えません。
ホームページをスマホ対応させるメリット
ホームページをスマホ対応させるメリットは以下の通りです。
- スマホから閲覧しやすい
- きちんと更新されているホームページの印象を与えられる
- SNSなどの他媒体と連携しやすい
つまりスマホ対応していないホームページは、それだけで多くのサイト訪問者を取りこぼすことにつながるのです。
またtoC向けに限らず、最近はtoBの現場においても、外出時や移動中などでスマホから取引先のコーポレートサイトへアクセスすることが増えました。ホームページがスマホ対応していないままだと、会社にも古い印象がついてしまう可能性があります。
これからもホームページを運営し続けるならば、”対応しないデメリット”も考慮して、スマホ対応しておいたほうが無難だといえるでしょう。
ホームページのスマホについてお考えなら、リカイゼンにお任せください！
リカイゼンでは、熟練のマッチングスタッフが、希望条件に応じて適した方法、また対応可能な制作会社候補を選定し、無料紹介いたします。
まずはご相談からでもお気軽にご連絡ください。
お電話でのご相談は
03-6427-5422
受付時間：平日10:00～18:30
2. ホームページのスマホ対応の方法-レスポンシブデザイン
ホームページのスマートフォン対応の方法として、現在主流はレスポンシブデザインを導入しての対応です。まずはレスポンシブデザインの概要や仕組み、メリットについて解説します。
レスポンシブデザインにする
レスポンシブデザインとは、パソコンやタブレット、スマートフォンなどの画面サイズが異なるどのデバイスからホームページを閲覧しても、デザインを崩すことなく表示させる手法です。
例えば、パソコンでアクセスした場合とスマートフォンでアクセスした場合で、アイコンの並びや画像の位置が異なって表示された経験がないでしょうか？同じURLにアクセスしても表示がデバイスで変更になるホームページは、レスポンシブデザインが使われています。
デバイスのウインドウ幅に「responsive(良く反応)」して、見やすい表示に自動で切り替える仕組みを持つデザインのため、レスポンシブデザインと呼ばれるわけですね。
検索エンジンのGoogleは、2015年4月にモバイルフレンドリーアップデートというものを行いました。このアップデートにより、ホームページがモバイル対応済みか否かが検索順位を決定する評価軸に加えられました。簡単にいうと、サイトやページの品質が同等レベルなら、モバイル対応されている”モバイルフレンドリー”なページが、より上位に表示されるようになったわけです。
モバイルフレンドリーの方法として、Googleはホームページのレスポンシブ化を推奨しています。よってSEOを意識したホームページの運営をしていくなら、レスポンシブデザインを導入しておいて損はないでしょう。
レスポンシブデザインの仕組み
レスポンシブデザインは1つのHTML、CSSによって制御されています。 具体的には、以下のような仕組みです。
- CSSをパソコン、タブレット、スマホの3種類に分けて記述する
- メディアクエリをHTML内に記述し、画面の横幅ごとに適用させるCSSを選択する
レスポンシブデザインではCSSの記述が長くなりやすいため、スマホ専用サイトよりはやや表示に時間がかかりやすいというデメリットはあります。しかし基本的にHTMLファイル1つですべてのデバイスに対応できます。HTMLファイルをデバイスごとに複数作成する必要がないため、ホームページの更新や管理がしやすい方法だといえるでしょう。
レスポンシブデザインのメリット
レスポンシブサイトは1つのHTMLで管理できるため、以下のようなメリットがあります。
- コンテンツの新規作成や編集、ページの削除といった作業が効率的に行える
- デバイスの表示端末の幅によって細かくデザインを設定できる
- すべてのデバイスで同一のURLを使えるため、検索エンジンからコピーサイトと疑われる心配がない
- 1つのサイトとして制作・運営できるため、スマホ専用サイトを別に作るよりもコストがおさえやすい
さらにWordPressのようなCMSを使ってホームページを運営している場合、デザインテンプレートの多くがすでにレスポンシブ対応されています。
完全にオリジナルデザインは別ですが、既存テンプレートのカスタマイズ程度でよければ、比較的簡単にレスポンシブ化ができる点もメリットでしょう。
レスポンシブ対応の相談ができる会社を探すなら、リカイゼンにお任せください！
リカイゼンでは、熟練のマッチングスタッフが、希望条件に応じて適した方法、また対応可能な制作会社候補を選定し、無料紹介いたします。
まずはご相談からでもお気軽にご連絡ください。
お電話でのご相談は
03-6427-5422
受付時間：平日10:00～18:30
3. ホームページのスマホ対応の方法-スマホ専用ページ
レスポンシブデザイン以外のスマホ対応方法としては、PC用ページとは別にスマホ専用のページを作成する方法があります。
スマホ専用ページを用意する
スマホ専用ページは、その名の通りスマホで閲覧することに特化したホームページになります。PCなどの横幅の広い画面向けレイアウトとは異なり、スマホ用に特化したデザイン設計になっているため、スマホで見る場合に限っては快適に閲覧できるでしょう。
ただし、スマホ以外のデバイスにも対応しようとすると、スマホ専用サイトとは別のHTMLファイルを作成して管理する必要があります。PC用、スマホ用と2つのホームページを運営・管理することと同じになるため、コンテンツの更新や追加を行う場合は単純に2倍の手間がかかる点に注意が必要です。
とはいえ、スマホ専用サイトに関しては古いブラウザに対応する必要がないため、HTMLやCSSの最新バージョンをふんだんに使用できる点はメリットです。レスポンシブ対応よりも軽くて見やすいホームページが作れます。よって大多数のサイト訪問者がスマホユーザーだとわかっている場合は、スマホ専用サイトの作成を検討するのも1つでしょう。
しかしスマホ専用サイトは、スマホ以外のデバイスで閲覧しようとするとレイアウトの崩れが発生してしまいます。さらに、スマホ専用サイトとほぼ同じ内容のものがPCサイトなどでも表示されるように作られますので、Googleなどの検索エンジンから見た際にコピーサイトとして誤認識を受けるリスクが高くなります。万が一の場合、ペナルティを受けて検索結果の上位から外される可能性があるのです。
重複サイトであるという認識を回避するためには、タグの埋込やパソコンユーザーへリダイレクト設定をする必要があります。結果として、2重にHTMLデータを用意する以上の工数がかかってしまうケースもあるのです。こうした実情から、スマホ専用サイトを、スマホ以外のデバイスでも見られるようにレスポンシブサイトへ移行するケースも出てきています。
ホームページのスマホ対応についてお考えなら、リカイゼンにお任せください！
リカイゼンでは、熟練のマッチングスタッフが、希望条件に応じて適した方法、また対応可能な制作会社候補を選定し、無料紹介いたします。
まずはご相談からでもお気軽にご連絡ください。
お電話でのご相談は
03-6427-5422
受付時間：平日10:00～18:30
4. ホームページのスマホ対応の外注依頼のポイント
現在運営しているホームページがスマホ対応でないのならば、ユーザービリティおよびSEOの観点から、早めにレスポンシブデザインなどの対策を取ることをおすすめします。
ここでは、ホームページのスマホ対応を外注依頼するときの費用目安と、外注先選びのポイントを紹介します。
費用目安
既存ホームページをレスポンシブデザインへ変更する場合、どれくらいの費用がかかるのでしょうか。制作会社の規模や、サイト構成によって費用は異なりますが、1ページあたり1〜2万円程度で見積もっておくのがよいでしょう。
必要ページ数分が加算される費用感になります。15ページくらいの小規模サイトなら15〜30万円です。
ただし「デザインを大幅に変更したい」「ホームページに使用する素材を一新したい」となると、その分が別途でかかってきます。複数社へ見積もり依頼して比較してみるとよいでしょう。
選定基準
では、レスポンシブ移行を依頼する制作会社はどのように選定すればよいのでしょうか。
レスポンシブデザインは、既存のPC向けデザインで使用しているコンテンツ（画像、テキストなど）と基本は同じコンテンツで制作しますが、下記のような細かい調整が入ります。
- どのように各コンテンツを配置するか
- コンテンツをすべて表示するか、スクロールに合わせて分けて出すか
- 操作性に違和感がないか など
外注先を選ぶときは、実績事例を見ながら、実際にPC画面とスマホ画面のサイズに切り替え、それぞれのデザインレイアウトを確認しましょう。
また、古い既存PCページをレスポンシブデザインにする場合、あえてゼロからホームページを作成し直した方が、コストもページの見栄えもよくなることもあります。とくにCMS化を一緒に考えるなら、すべて作り直すことも検討したほうがよいでしょう。
なお制作会社の選定をする際は、最低3社以上へ見積もり依頼を行って比較することをおすすめします。安かろう悪かろうではありませんが、とくに理由なく相場よりはるかに安い価格を提示してくる会社は避けたほうが無難です。とはいえ、金額が高いからクオリティが高いというわけでもないのが難しいところです。
見積額、制作会社の実績クオリティ、レスポンシブ対応の技術力、コミュニケーション力、提案力など総合的にバランスの良い会社を選定されるのがよいでしょう。
ホームページのスマホ対応の外注先選定・一括見積もりならリカイゼンにお任せください！
リカイゼンでは、熟練のマッチングスタッフが、希望条件に応じて適した方法、また対応可能な制作会社候補を選定し、無料紹介いたします。
まずはご相談からでもお気軽にご連絡ください。
お電話でのご相談は
03-6427-5422
受付時間：平日10:00～18:30
5. ホームページのスマホ対応のまとめ
スマホ専用サイトとレスポンシブサイトの違い、そして既存ホームページをレスポンシブデザインにする場合の費用相場と、会社選定のポイントについてまとめました。
デバイスごとのHTMLソース管理は、手間がかかる上にGoogleが推奨しているモバイルフレンドリーに反してしまうリスクがあるため、企業にとってあまり効果的ではないサイトになっている可能性があります。
レスポンシブサイトへ移行するには、少なくとも十数万円からのコストがかかってしまいます。しかし、万が一Googleから重複サイトとして認識されてしまい、検索結果の順位が落ちることがあれば、損害は十数万円では終わらないでしょう。
まだレスポンシブサイトへ移行していないホームページがある場合は、これを機に早めにレスポンシブサイトへ移行することをおすすめします。
コーディングの依頼先探しなら、
リカイゼンにおまかせください！
相談するだけ！プロがあなたにぴったりの会社をご紹介いたします！
コーディングの依頼先探しでこんなお悩みはありませんか？
- 会社の選び方がわからない
- 何社も問い合わせるのが面倒くさい
- そもそも依頼方法がわからない
- 予算内で対応できる会社を見つけたい
発注サポート経験豊富な専任スタッフが
あなたのご要望をお聞きし、最適な会社をご紹介いたします！
ご相談から会社のご紹介まで全て無料でご利用いただけます。
お気軽にご相談ください！
コーディングの
依頼先探しなら
リカイゼンにおまかせください！
相談するだけ！プロがあなたにぴったりの会社を無料でご紹介いたします！
まずはご質問・ご相談なども歓迎!
お気軽にご連絡ください。
