新着情報

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

昨今、ホームページをレスポンシブWebデザイン対応にする企業が増えてきました。制作側からすると、制作には手順が煩雑化し、困難を極めてきます。しかし、Googleは今後のWeb標準にする意向を目指し、推奨しています。

Googleが推奨するレスポンシブWebデザインとは?

  • 簡単に要約しますと、スマートフォンに最適化されたサイトを構築する際に、Googleは、次の 3 つの構成をサポートしています。

    レスポンシブ・ウェブデザインを使用しているサイト、すなわち、すべてのデバイスに単一の URL で同じ HTML を提供し、CSSを使用してデバイスごとにデザインを変更するサイトです。こちらが Google の推奨する設定方法となります。

  • すべてのデバイスに対し単一の URL で、ユーザーエージェントに応じてデスクトップ用かモバイル用かなどを判断して動的に異なる HTML と CSS を提供するサイト。
  • モバイル用のサイトとデスクトップ用のサイトを別々に構築しているサイト。

引用;Googleウェブマスター向け公式ブログ

レスポンシブ対応にするメリットは?

  • PC 用のページとモバイル用のページを単一の(同一の) URL とすることができるため、ユーザーにとってはシェアやリンクが容易であり、Google のアルゴリズムにとってはコンテンツを適切にインデックスできるようになります。
  • ユーザーエージェントの異なる Googlebot ごとにページをクロールする必要がないため Google がより効率的にコンテンツを発見することができます。

引用;Googleウェブマスター向け公式ブログ

Googleに気に入られているレスポンシブWebデザインですが、
先端を行く民間企業や大学ではすでにレスポンシブ対応を採用しています。
光岡自動車
レスポンシブWebデザインの弱点とデメリット
セントメディア
レスポンシブWebデザインの弱点とデメリット
HYS
レスポンシブWebデザインの弱点とデメリット
国際トータルファッション専門学校
レスポンシブWebデザインの弱点とデメリット

海外では米ハーバード大学や英ケンブリッジ大学がレスポンシブを採用しています。

こうした中で企業だけでなく、政府のホームページさえレスポンシブ対応をしています。
文部科学省ホームページ
ますます増えていく、レスポンシブの流れ。

移行するにあたって、いくつかデメリットを並べてみました。

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

スマートフォンやタブレットでアクセスした時に、PC用のサイトを閲覧することができない。

これについては、ユーザーエージェントを判断してHTMLを振る方式をレスポンシブWebデザインはとっていない=
htmlがひとつしかないので、振りようがないのです。
パソコンでホームページを確認して、外出時にスマートフォンで再確認しようとすると、
レイアウトが違うので、一瞬焦ったりします。

急いでいるときこそ、目的の情報を早く引き出したいのに、
レイアウトが違うことでイライラしてしまうこともあります。
また、GoogleMapを閲覧したいときなど、画面が小さ過ぎたり、
思ったようにコントロールできなかったりします。
こういうときはPCサイトで見たいと思うはずです。

ブラウザの拡大機能に反応する

パソコンでレスポンシブ化されたホームページを閲覧し、
見えにくいところを拡大して見るという方もいらっしゃると思います。
Windowsの場合は、[Ctrl]キー+マウスホイール操作で拡大縮小ができますが、
レスポンシブ対応のホームページを拡大すると、
ブラウザ側はブレークポイントが設定されているためにブラウザが誤解をしてスマホ用を表示してしまいます。
こうなると、ある程度までしか拡大できません。

関連記事:レスポンシブWebデザインが採用できないサイトって?

発注側のデメリット

現状サイトが使えない

現状サイトのディレクトリ構造は、
レスポンシブ対応をする上で利用が推奨されておりません。
ソースコードが複雑化、またはレイアウトがレスポンシブ対応に不向きの可能性が大きいからです。
すなわちスクラッチで作り直すということが必要です。
つまり、費用が高額になる可能性がでてきます。

構成の見直し

レイアウトが変わりますので、
構成(コンテンツ)の見直しが必要になります。
Web担当者様に掛かる重圧は計り知れなくなります。

それでもレスポンシブ対応する意味は?

業種にもよりますが、多いところでは全ユーザーの6割がスマホサイトからのアクセスです。
レスポンシブのメリットは、

  • Googleが推奨している。
  • HTML、CSSの簡略化。
  • SEO対策。

です。
スマホサイトのみの構築では、上記のメリットはありません。
レスポンシブ化したホームページは公開してから1週間程度すると、
SEO効果を発揮します。
それは何故か?
GoogleがレスポンシブWebデザインを推奨しているからに他ありません。

もし、競合が多く少しでも検索結果上位を目指すのなら、
レスポンシブ対応も考えた方がいいのかも知れません。

コメントを残す

*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">