レスポンシブWebデザインはいまや当たり前になっていますが、レスポンシブにしたからといって、それはスマホ対応したと同意義になるわけではありません。
レスポンシブはあくまでPC・スマホ両対応にするための１手段であり、その手法は古典的なものも含め複数存在するので、場合によって使い分けていく必要があります。
モバイルフレンドリーが検索順位を決める
Googleは2015年4月から、検索順位の決定要因としてモバイルフレンドリーの要素を追加しました。モバイルフレンドリーなサイトは、スマホやタブレットなどのモバイル端末でも閲覧がしやすいからです。
これはあくまでGoogle独自のチェック項目でしかないのですが、WebにおいてGoogleの存在は依然として大きく、Webサイトのスマホ対応は急務と言えます。
このモバイルフレンドリーに対応するための技術としてはレスポンシブWebデザインが有名ですが、今回は前述にもあったようにそれ以外のスマホ対応の方法についても紹介していきます。
スマホ対応には複数の方法がある
スマホ対応と聞いて真っ先に叫ばれるのは、レスポンシブWebデザインです。しかし、実はスマホ対応を実現する方法は複数あります。
むやみにレスポンシブを採用するのではなく、それぞれのWeb戦略にかなう、適切な手法を選択することが重要です。
ここからは、スマホ対応を実現する方法を（もちろんレスポンシブも含めて）いくつか紹介していきます。
スマホ対応をするための方法
１. スマホ専用のサイトをつくる（別URL）
デバイスごとに専用のサイトをつくる方法です。パソコンサイトとは別に、スマホ用サイトやタブレット用サイトをつくります。この場合、各デバイスごとに異なるHTMLファイルを持つことになるので、下記のようにデバイスごとにサイトURLが異なります。
PCサイト http://◯◯◯.com/
スマホサイト http://◯◯◯.com/sp/
メリット
- HTML/CSSファイルがPCとスマホ向けで別なので、独立した運用管理ができる
- PC向けのデザインとスマホ向けのデザインをそれぞれの環境に合ったものにできる
デメリット
- HTML/CSSが完全に独立した別物なので更新するときは両方とも更新しなければならない
- URLが異なるため流入が分散するのでSEOやSNSによるシェアに弱い
２. スマホ専用のサイトをつくる（同一URL）
一つ目の方法とほぼ同じですが、こちらはURLが同じになります。UA（ユーザーエージェント）を判別して表示内容を振り分けます。URLが同一なので、SNSシェアに強く、ユーザビリティ面でもメリットがあります。サーバーサイド（PHPなど）、クライアンサイド（JavaScriptなど）またはApacheのhtaccessなどを用いて対応します。
メリット
- PC向けのデザインとモバイル向けのデザインをそれぞれに適応したものにできる
- SEOやSNSによるシェアに強い
デメリット
- URLが同じでも呼び出しているソースは別々なので、両方のHTMLを更新しなければならない
- コーデイングとは別にプログラミングをする必要がある
３. レスポンシブデザインを利用する
スマホ対応を実現する方法の中でも、いま最も採用されているのがレスポンシブWebデザインです。CSS3のメディアクエリを利用することで、デバイス（ディスプレイサイズ）ごとに異なるCSSを適用させます。
メリット
- HTMLが同じなので、１度でPC向けサイトとモバイル向けサイトの両方が更新される
- SEOやSNSによるシェアに強い
- Googleが推奨している
デメリット
- ページの表示に時間がかかる場合がある
- 制作予算（工数）がふくらむ可能性がある
- PC向けサイトとモバイル向けサイトのデザインを大幅に変えることが難しい
どう使い分けるべきか？
スマホ対応は、そのサービスのWeb戦略に合致する方法を採用することが大切です。
もともとPC閲覧向けデザインで運営していて、コンテンツ量が多くサイト規模が大きい、階層が深いという場合には、無理にそのサイトをレスポンシブデザインにすることが正解とはいえません。逆に新規で一からサイトを作る場合は、モバイルファーストないしモバイル端末での閲覧を意識しておくことに損はありません。
全てはコンテンツの質や量、また、それをユーザーがどう閲覧したいかによって使い分けるべきです。もっと言えば、コンテンツ量自体もPCとスマホでは出し分けたほうがよい場合もあります。ユーザーがそれぞれのプラットフォームを利用するとき、どう情報を閲覧するのかをきちんと捉えることが、真のモバイルフレンドリーであるといえます。
まとめ
安直にスマホ対応＝レスポンシブとするのではなく、サイトやサービスごとに適切な手法を用いて柔軟に対応していくことが求められています。
今回紹介した手法は料理のお皿のようなものです。結局はその上にどんな料理をのせるかによって、使うお皿も変わってきます。手法とそれぞれの得手不得手を知った上で、取り扱うコンテンツ自体と向き合いましょう。
