• TOP
  • ブログ一覧
  • 【スマホ対応】で検索結果上位を狙う方法徹底解説

2021.02.07

WEB制作

【スマホ対応】で検索結果上位を狙う方法徹底解説

NoImage画像

【スマホ対応】で検索結果上位を狙う方法徹底解説

自社のホームページがパソコンにしか対応していない…なんてことはありませんか?

パソコンではホームページがきれいに表示されるのに、スマホでは文字がかぶったり読みにくいなんてことがあれば、スマホ対応していない可能性があります。

Googleがモバイルファースト インデックス(MFI:Mobile First Indexing)を導入していることから、ホームページをスマホ対応することは必要不可欠とも言えます。

今回は、スマホからホームページを閲覧した場合、スマホ対応になっているかの確認方法と、スマホ対応になっていない場合の対処方法を紹介します。

スマホ対応とは?

「スマホ対応」とは、スマホでホームページを見たときに、スマホ用に表示されるサイトを準備すること(最適化すること)を言います。

ホームページを表示した時、パソコンだけではなく、スマホでも見やすく表示することでユーザーがホームページに訪れやすくなります。

スマホの普及が増加していることから、ホームページに訪問する人の80%以上の人がパソコンではなく、スマホから訪問しています。

このことを考えると、スマホで見やすいサイトを作成しておくことは、必要不可欠と言えます。

スマホ対応していれば、サイト訪問者の離脱率を大幅に削減でき、サイト訪問時間を延ばすことができるため、商品やサービスの購入などに大いに役立ちます。

「スマホ対応をする」ということは、ユーザーにとって見やすく分かりやすいサイトを準備することになります。

そしてスマホ対策をすることでGoogleでのSEO対策にも役立ちます。

スマホ対応の確認方法

サイトがスマホ対応になっているか、どのようにして確認するかを解説します。

簡単に確認できるのでぜひ活用してみてください。

  1. Googleが提供しているモバイルフレンドリーテストに調べたいサイトのアドレス(URL)を入力する
  2. 1分ほどで結果が表示されるまで待つ
  3. 「問題ありません。このページはモバイルフレンドリーです」と表示されればOKです。

モバイルフレンドリーとは「スマホ対応している」ことを表します。

もしモバイルフレンドリーになっていない場合には、スマホ対応するようにしましょう。

ここからはスマホ対応にする方法を3つ紹介していきます。

スマホ対応にする方法【3つ】

ホームページをスマホ対応にする方法は主に3つあります。

  1. CMS自動切換え
  2. レスポンシブ対応
  3. スマホ専用サイトの作成

簡単な方法から順番に紹介していきます。

①.CMS自動切換え

簡易的に作成できるCMS(WordPressなど)限定ですが、「CMSの自動切り替え機能」を利用するだけでスマホ対応にすることが可能です。

WPtouchJETPACKMOBILE SMARTなどのプラグインを導入すれば、手軽にスマホ対応に切り替えられます。

WPtouchは、スマホなどのモバイル端末で見たときに最適化したデザインテーマを表示してくれるプラグインです。

スマホ対応プラグインの中でも最も人気があります。

管理画面で外観のカスタマイズが可能な上にテーマが豊富にあります。

オリジナルデザインにしたい場合にもおすすめのプラグインです。

JETPACKは、便利機能がパックになっているプラグインです。

JETPACKをインストールすれば30以上の機能が利用可能となります。

機能の中にある「モバイル用テーマ」を活用し、スマホ対応にすることができます。

MOBILE SMARTは、モバイル端末からアクセスしたとき、モバイル用のテーマに切り替え表示してくれるプラグインです。

デザインは比較的シンプルでユーザーが手動でPC用とモバイル用を切り替えられます。

②レスポンシブ対応

レスポンシブとは、「敏感に反応する」という意味合いがあります。

Webサイトを閲覧するときパソコンを利用するかスマホを利用するか、利用する機器によって表示されるサイズは変わりますが、効果的に切り替えしてくれるのがレスポンシブ対応です。

レスポンシブ対応は、基本的にPCサイトのデータを使ってユーザーが使っているスマホやタブレットなどのサイズに合わせてシートを自動的に切り替えて表示します。

新しいページを追加した場合でも、スマホ向けに作成し直す必要がなく、自動的にスマホ用として表示してくれます。

パソコン用ホームページを更新すれば、スマホ用サイトも更新されるため、手間がかからないことが最大のメリットです。

パソコン用サイトとスマホ用サイトを2つ制作するコストをかけられない場合や手手間をかける時間がない場合におすすめの方法です。

しかしデメリットもあり、画像が小さい場合、文字も合わせて小さくなってしまったり、文字の改行がうまくいかないことが稀にあります。

③スマホ専用サイトの作成

ホームページの作成時にスマホ専用サイトを作成する方法です。

「スマホ専用」のサイトであるため、HTMLやCSSを書き込むことでユーザビリティの優れたサイトが出来上がりますが、PC用サイトとスマホ用サイトを作成する必要があるため、ホームページ作成費用が2倍かかります。

一般的な費用の平均は以下の通りとなります。

  • スマホ用デザイン案 80,000円
  • スマホページ作成(トップページ) 30,000円
  • スマホページ作成(トップページ以外)20,000円
  • お問合せページ作成 20,000円

スマホ用のサイトを別途作成すると平均して合計15万円ほどかかります。

費用がかかる分、ユーザーにとって見やすいページが出来上がります。

スマホ対応【まとめ】

上記で紹介したスマホ対応の方法について特徴をまとめてみます。

CMS自動切換えレスポンシブ対応スマホ専用サイト対応
コスト不要
(カスタマイズ除く)
不要PC用・スマホ用2つ必要
デザイン自由度は低め一部制約あり整えやすい
運用管理画面だけで可能ソース1つで可能PC用スマホ用2つ必要
期間ONに切り変えのみかかるかかる

これからスマホ対応をする人は、上記の表を参考にして、優先順位を決めてどの方法が良いかを決めてください。

どの方法が良いのか分からない方やスマホ対応にして欲しいといった場合には

無料でご相談にのりますのでLife Growにお気軽にご相談ください。

※現在LINE作成中です。
お申し込みをご希望の方は問い合わせから
お問い合わせください。

お問い合わせcontact

WEB施策や集客などについての課題解決のサポートを
いたします。お気軽にお問い合わせください。

会社概要company

弊社の概要についてまとめさせていただきました。

PAGE TOP