レスポンシブWebデザインとは何か？

モバイル専用サイトのように、ファイルを2重化構造でもつことなく、通常サイトに必要なファイルに、少し拡張した記述をすることで、ユーザーが様々な画面解析度で閲覧した場合でも、最適な表示を柔軟に実現する手法です。ちなみにResponsiveとは、「反応がいい」という意味ですが、元は建築用語の「Responsive Design」（変化できる建築デザインの意）から引用されたそうです。なお技術的には、主に3つの要素から構成されます。

「メディアクエリー」
CSS3では、デバイスの幅を検知する、メディアクエリーと呼ばれる記述により、ユーザーの画面解析度に合わせて、任意のスタイルを適用することができ、これを利用します。

「フルードグリッド」
液体が器の形に合わせて、流動的にカタチを変えるかのように、画像やテキストなど、Webページコンテンツの要素を、どんな画像解析度で閲覧されても、きれいに整列させたレイアウト表示を実現する技術です。

「フルードイメージ」
画像を、縦横比を保ったまま、画像解析度に合わせて、伸縮させる技術です。 またその他に、例えば画像解析度に合わせて、読み込ませる画像を切り替えることで、回線事情の悪いモバイルからの閲覧でも、レスポンスを改善する、というようなことも行えます。

デバイスの所有率

モバイルのみ

インターネットの閲覧にも、モバイルを利用するユーザーが増えています。そのためデバイスとしてモバイル以外を所有する必要性がなくなってきており、これらのでもグラフィックへリーチするには、モバイル対応として、もはやレスポンシブWebデザインは必須といえます。

どんな画像解析度で閲覧されても、表示を最適化でき、今後も増え続ける様々なデバイスへも柔軟に対応できます。

ファイルを一元管理できるため、生産性・メンテナンス性に優れています。

デザイン性も統一されます。

SEOにも有効（Googleも推奨）

An Industry Best Practice

-Google

通常のサイトを構築するよりは、記述しなければならないコードや、考慮しなければならないことが増えるため、テスト作業も含め、開発コストは上がります。
（モバイル専用サイトを別に開発するよりは、一般に安くなりますが。）

コードがより複雑化するため、設計段階から、それなりのスキル・知識のもった開発者が携わる必要があります。
（適切なスキルのない開発者が関わると、返ってメンテナンス性が悪くなり、不測の事態を招く可能性もあります。）