レスポンシブとは？

menu

2020年6月15日

「レスポンシブ」とは通常「レスポンシブWebデザイン」のことを指し、Webサイトを作成する手法の1つを意味します。
レスポンシブWebデザインは、PC、スマートフォン、タブレットなど、どのデバイスからwebサイトを見ても最適なレイアウトで表示することができます。

スマートフォンやタブレットが登場する前は、Webサイトの閲覧はPCから行うことが一般的でした。しかし、現在はスマートフォンのように小さなデバイスからWebサイトを見るユーザーが増えたため、従来の方法では最適なレイアウトを表示することが難しくなってしまいました。

そこで登場したのが、レスポンシブWebデザインになります。
現在では、共通のレイアウトでさまざまなデバイスに対応できるようになっています。

レスポンシブWebデザインは、HTMLにWebサイトの内容を書き、CSSにデバイスごとのレイアウトを書きます。
1つのCSSファイルの中に、PC、スマートフォン、タブレットなど、すべてのデバイスのレイアウトを書くことも可能です。

例えば、デバイスのウィンドウ幅が320px以上だったらスマートフォン用のレイアウトを表示したり、ウィンドウ幅が1024px以上だったらPC用のレイアウトを表示するということが出来ます。

※上記に記載した「320px以上だったらスマートフォン、1024px以上だったらPC」という切り替えはブレイクポイントの境界値を設定することで実現します。ブレイクポイントについて詳しく知りたい方は、当スタッフブログの「レスポンシブWebデザインのブレイクポイントについて」をご参照くださいませ！

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

レスポンシブとは「レスポンシブWebデザイン」のことを指し、さまざまなデバイス上で最適なレイアウト表示を行うことができるWebサイトの作成方法ということがお分かりいただけたでしょうか。

Web制作技術は日々進化しているので、チェックを欠かさないようにしたいですね！

投稿一覧

コーディングパックのメールマガジン