「レスポンシブWebデザイン」とは、PC、タブレット、スマートフォンなど、複数の異なる画面サイズをWebサイト表示の判断基準にし、ページのレイアウト・デザインを柔軟に調整することを指します。
現在はPCやスマートフォンなど、デバイス毎に各HTMLファイルを複数用意し最適化することが、一般的な制作方法となっています。
「レスポンシブWebデザイン」では、1つのHTMLファイルを、CSS3(Media Queries)で制御し、異なる画面サイズに応じてページのレイアウト・デザインを調整します。
- 1つのHTMLファイルで複数デバイスに対応できるので、制作後はメンテナンス等が容易になり、作業工数の軽減になります。
- 全てのデバイスの情報が同一の為、各デバイスによる設計がバラバラにならず、情報整理が行いやすくなります。さらに、情報整理が行いやすくなることによって、本当に必要なコンテンツが見えてきます。
(お客様の視点からみても、1つのワイヤーの中から情報を選抜するということで、気持ちよく情報整理が行えます。 - PCとスマートフォンなど異なったデザインとして考えず、決められたデザインやUIで制作が行えます。
- 各デバイスのURL統一化
- 大きく分けて、モバイルとPCは利用シーンが異なるため、絶対的なものだとは言えません。
- 制作後の作業工数の軽減にはなるが、多くのデバイスに対応させるため、設計やデザインを行う際にはとても慎重に行う必要があります。
- 1つのHTMLファイルを使用するため、PCとモバイルを異なるレイアウトにした場合、見えない部分に必要のない要素が読み込まれてしまい、ページの読み込みが重くなる可能性があります。
- デバイスごとに細かい配慮をすることが難しい。
特に新しい解像度のデバイスが登場することにより、標準規格が変更され、サイト全体の仕組みを変更しなければならない可能性があります。
1つのHTMLファイルを、CSS3(Media Queries)で制御し、異なる画面サイズに応じてページのレイアウト・デザインを調整されます。