レスポンシブデザインとは、ブラウザのサイズに応じて表示が変わるデザインのことです。今では少なくなりましたが、スマホに対してPC用のデザインのページを表示させてしまうと、とても見づらいのでお客様は離れて行ってしまいます。ですからそれぞれのデバイスに適切なデザインをそれぞれ出し分ける必要があるのですが、PC、スマホ、タブレットとバラバラで管理してしまうと、何か変更があったときに修正する手間が増えてしまいます。そこでURLとHTMLは同じものを使い、CSSではPC画面やスマホ画面の大きさに合ったサイトデザインへ、自動で変更するように設定します。これが「レスポンシブデザイン」にするということです。
例えば、PC画面のサイズを横幅1,000px、スマホ画面のサイズを横幅750pxと仮定します。レスポンシブデザインでは「横幅1,000pxの画面には1,000px用のCSSを適応、横幅750pxの画面には750px用のCSSを適応」といった感じに、自動で変更してくれます。
ECサイトなど、多くの情報を提供するサイトの場合は記事のボリュームも多くなってきます。レスポンシブデザインにすることで、URLとHTMLを一つ用意すればいいので、管理がしやすく制作コストの削減に繋がります。
