レスポンシブデザインのメリット・デメリット

Posted on 2017.6.21

 

 

こんにちは!ディレクターの小川です!

 

前回書いた「レスポンシブデザインについて」の続きで、

今回は「レスポンシブデザインのメリット・デメリット」について綴りたいと思います。

 

 

 

前回、Googleがレスポンシブデザインの使用を推奨していると書きましたが、それはなぜか。

まずGoogleの検索エンジンは以下3種類のモバイルサイトを認識しています。

 

①レスポンシブデザイン。
②動的な配信。(PHPなどによって吐き出されるページ。実際のHTMLファイルは存在しない)
③別々の URL。(パソコン向けのHTMLとモバイル向けのHTMLを別々に用意し、URLもわけられている状態)

 

この3種類のうち、Googleは①のレスポンシブデザインを推奨しています。

 

レスポンシブデザインの場合、どのデバイスに対しても同じURL・HTML・CSSファイルを使用しているため、例えばスマホでは通常に表示されているのにパソコンやタブレットなど他の端末では表示エラーが起きる、といった問題を回避することができます。

 

Google検索エンジンのクローラーの巡回の手間が少なくなるといった利点や、問題が少ないことでユーザビリティが向上する点もあるため、Googleはレスポンシブデザインの使用を推奨しています。

 

 

では具体的にどのようなメリット、デメリットがあるか。

 

 

 

メリット

 

 

●SEOで有利。

 

Googleが推奨していることもあり、モバイルフレンドリーに対応しているWEBサイトがSEOで有利になります。

モバイルフレンドリーとはモバイル端末での表示に最適化(スマホ対応)することです。

読みやすいテキストサイズ。横スクロールが必要ない。リンクやボタンがタップしやすい。Flash(スマホ非対応)を使用していない。など、ユーザーに対してやさしいつくりであるか。

またパソコンとスマホでソースが分かれていないことで、Googleクローラーが判断に迷わず、Google等への伝達のミスも少なくなるからです。

 

 

●将来的に出てくるであろうデバイスに対応できる。

 

限られた画面サイズに依存しないため、後に出てくるであろうデバイスに対しても、表示させることができます。

また多くのブラウザにサポートされているCSS3を使用しているため、汎用的で、より多くの人々に見てもらえる。

 

 

●1つのソースで管理できる。

 

パソコンサイトとスマホサイトでHTMLが別々に構築されていないため、1つのhtmlファイルで、デザインの設定を変更でき、同じコンテンツを全てのデバイス端末に供給するため管理がしやすい。

そのため更新や修正作業も容易に行え、モバイルサイトは古いままといった問題も防ぐことができる。

 

 

 

 

デメリット

 

 

●スマホでの表示が重くなる。

 

パソコン用のHTMLコードやCSSも読み込むため、表示に時間がかかる。CSSで画面に表示しないようにしても、読み込みは行われてしまうため、ユーザーが待ちきれず離脱する恐れがある。

また画像も同様にパソコン対応の大きな画像の場合、モバイルの3G/4G回線で読み込むには時間がかかる。

 

 

●構築の工数がかかる。

 

シンプルなページであればいいですが、それでもレスポンシブサイトの制作は通常よりも工数がかかります。

表示させるデバイスごとに対応するデザインを用意したり、コーディングの構築が複雑になっているため、設計や構築で工数が増えます。

またそのためのコストも高くなります。

 

 

●コンテンツの精査が必要。

 

パソコンサイトは表示画面が大きいため、情報を多くても表示に特に問題はありません。

しかし、スマホやタブレット端末になると、当然画面が小さくなるため、テキストや画像が多すぎる場合、スマホでは文字が溢れてしまうなどユーザーにとって見づらいものになってしまいます。

そのためレスポンシブにする場合、パソコン・スマホ両面でみた場合を考慮した、デバイスごとのコンテンツの精査が必要になります。

 

 

 

 まとめ

 

Googleが推奨しているとはいえ、必ずしもレスポンシブデザインがベストな選択ではありません。
紹介したようにメリットだけではなくデメリットも存在するため、あくまで選択肢の一つとして捉える必要があります。

ターゲットユーザーがどのようなデバイスを使い、どのようなシーンでホームページを利用するかを考え、最適なデザインを選択することをお奨めします。

 

お客さまの要望を叶えるのはもちろんですが、ゴッタライドではユーザー目線も大切にし、より良いサイト作りを心がけております!

 

 

メリットデメリット

お問い合わせ