WEBサイトはスマートフォン対応済み？
BtoCサイトは特に急務です！
「あなたの会社のホームページはスマートフォンに対応していますか？」
数年前からスマートフォンやタブレットが急速に普及し、パソコン以外の他デバイスへの対応が必須となってきています。企業によっては「大至急対応したいがどうすればよいのか？わからない」とお悩みの方も多いのではないでしょうか？
Webに携わっている方には、もう何年も前から課題になっていることなので、「今さらこの話題？」という感じもあるかと思います。しかしスマートフォンが急速に普及している状況にもかかわらず、国内主要企業ですら35%の企業WEBサイトがスマートフォンに対応していないという状況なのです。主要企業でこの状況ですから、中小企業では更に未対応の企業が多いと予想されます。今後は更に、一般消費者のスマートフォンでのWEB利用が増えてくるでしょう。そのため一般消費者をターゲットとしたBtoCサイトのスマートフォン対応は必須であり、待ったを許さない状態となっています。こう言った状況を考え、今回あらためてこの話題をとりあげてみました。
・国内主要企業サイトの65％がマルチデバイスに対応
スマートフォンに対応するための二種類の方法
１.スマートフォン対応したページを新しく作成する
パソコン用のWEBサイトを既に持っている場合、今までのパソコン用のページはそのままにして、新たにもう1組スマートフォン専用のサイトを作成し、スマートフォン利用者にはそちらのサイトを表示するというものです。これはスクリプトやサーバー側の設定を介在させて、サイトを見に来た人のデバイスを自動的に判断し、スマートフォンで見に来た人にはスマートフォン用に作ったページへ自動的にジャンプさせる方法です。パソコン用とスマートフォン用で、ほぼ同じ内容のページが2枚ずつ、2組のWEBサイトが存在することになります。
２.新しくレスポンシブ対応のページを作成する
１組のWEBサイト（ページ）をパソコン用、スマートフォン用、タブレット用などデバイスによって表示を変更する方式を「レスポンシブ」と言います。厳密に言うとデバイスによってではなく、画面の横幅で表示を切り替えています。
１つのファイル（ページ）で複数の見せ方をするという状態になります。
レスポンシブサイトのメリット
１つのファイルで見せ方を切り替えているので、ページに更新があった場合、１つのファイルを変更すれば、全てのデバイスで内容が変更されます。更新の手間が少なく効率的です。
また、レスポンシブの方がSEO的に有利になります。（SEOとはGoogle等の検索において上位に表示させる対策のことを言います）
SEOにおけるレスポンシブページの優位性について、検索大手のGoogleは「モバイル SEO の概要」で『Google では、デザイン パターンとしてレスポンシブ デザインをおすすめします。』とアナウンスしています。
そして「レスポンシブ デザインにする理由」として以下の6項目（Googleから引用）をあげています。
１：URL が 1 つなので、ユーザーによるコンテンツの共有やリンクが簡単になります。
解説：スマートフォン専用の別ページを作成した場合は、パソコン用とは別にスマートフォン用のファイルが必要なため、URLも別のものになり、スマートフォン用の導線の確保が必要です。その点レスポンシブの場合は1ファイルなので導線が1つですみます。
２：対応するパソコン用ページやモバイル用ページが存在することを Google のアルゴリズムに伝える必要がなく、ページへのインデックス プロパティの割り当てが正確に行われます。
解説：Googleの検索アルゴリズムにページが2枚存在することを知らせる必要がないので、スムーズに検索順位の獲得ができます。
３：同じコンテンツのページをいくつも維持管理する手間が省けます。
解説：パソコン用とスマートフォン用の2ページが存在する場合、更新のたびに2ページの修正が必要となり更新する時間や労力がかかります。レスポンシブは1ページなので1つの更新ですみます。
４：モバイルサイトでよくある誤りに陥る可能性を抑えることができます。
解説：パソコン用とは別にスマートフォン用サイトが存在する場合、同じコンテンツを2度更新しなければならないことによる単純な間違えや更新のし忘れなどのミスがおこりやすい。レスポンシブデザインの場合は（3）と同じく1ページの更新ですむので、間違えを極力少なくできます。
５：ユーザーをデバイスごとに最適化したページにリダイレクトする必要がないため、読み込み時間を短縮できます。ユーザー エージェントに基づくリダイレクトはエラーが発生しやすく、ユーザー エクスペリエンスを損なうおそれがあります（詳しくは、ユーザー エージェントを正しく検出するをご覧ください）。
解説：パソコン用サイトとは別の導線を作るためにリンクミスといった誤りや、リダイレクトでの移動によるロード時間がかかる恐れがあります。
６：Googlebot がサイトをクロールするために必要なリソースを節約できます。同じコンテンツのページが複数存在すると、別々の Googlebot ユーザー エージェントが複数回クロールしてすべてのバージョンを取得する必要があります。一方、レスポンシブ ウェブ デザインの場合は、1 つの Googlebot ユーザー エージェントがページを一度クロールするだけで済みます。Google によるクロールの効率が上がると、サイト内のより多くのコンテンツがインデックスに登録され、適切な間隔で更新されることにつながります。
解説：GooglebotがWEBサイト間を自動でクロールして、世の中のWEBサイトの情報を蓄積しています。パソコンサイトとスマートフォンサイトが別々にある場合、同じ内容でURLの違う２つのページを別々にクロールすることになります。その結果「どちらが最新で正式なページだろう？」と迷いながら判断することになります。その点レスポンシブサイトの場合、1 つのページを Googlebotが一度クロールするだけで済み、Google に対して解りやすく、検索インデックスにも登録されやすくなります。
上記の6番目の項目が、レスポンシブページのSEOにおける優位性について一番重要な部分になります。これによってWEBサイトの内容が検索結果に適切に反映されるようになります。
その他SEOについて詳しくは下記をご覧ください
・SEO対策の基本を解説！成果を出すSEO対策基本知識と方法
・効果が高いのに見落としがちなSEO６選
レスポンシブサイトのデメリット
レスポンシブページにもデメリットがあります。
スマートフォンは横幅も狭く、複雑なレイアウトは不向きです。パソコンでのデザイン重視のサイトをそのままレスポンシブさせても決してモバイルフレンドリーにはなりません。ですから、PCファーストでデザインしたページの場合は「複雑でレスポンシブ化できない」ということも発生します。レスポンシブページを作成する前にページ内のコンテンツの重要点を把握し、モバイルファーストでシンプルなデザインにすることが望ましいです。
そしてもうひとつ、1枚のhtmlやcssにデバイス別の見え方や分岐を記載するので、情報量が増えることが多く、読み込む時間やページ容量が重くなるといった点もあります。ネット回線の高速化やページの軽量化対策は進んでいますが、まだまだページあたりの容量が重く、ページロードに時間がかかるケースが多くあります。
また、デメリットというわけではありませんが、BtoCサイトの場合スマートフォンユーザーの方が圧倒的に多いケースも考えられます。その場合、レスポンシブ化するのではなく、最初からスマートフォン専用サイトのみを作る方が望ましいという場合もあります。
費用の面から、すでにお持ちのページをレスポンシブ化できないものか？と考えるのも一案になるでしょう。しかし、もともとの制作方式によっては、多くの構成の見直しが必要だったり、作成された時代が古い場合、全くレスポンシブ化できないものもあり、結果的にリニューアルに近いくらいの費用が掛かってしまう場合もあります。
まとめ
スマートフォン対策のオススメの施策
- Webサイトを新規に作成、またはリニューアルの場合
⇒レスポンシブでの作成＜超オススメ＞ - 既にパソコン用のWebサイトを持っている場合
⇒別にスマートフォン専用サイトを作る＜オススメ＞
⇒既存のサイトをレスポンシブ対応させる
WEBサイトをスマートフォンに対応させると言うことは、これまで取りこぼしてきたスマートフォンユーザーを、より確実に獲得する第一歩になります。それは自社商品やサービスの認知につながり、売上にも影響してくるはずです。
実際にどういった施策が適切なのかは、ページの作りよっても変わってくるため、専門知識がないと判断が難しいケースが多くなってきます。スマートフォン対応をご検討の場合はWEB制作のプロに相談してみることをお薦めします。
WEBプログラマー ／ H.C
