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

もう少し詳しく

レスポンシブデザインれすぽんしぶでざいん(Responsive Design)とは、パソコン・タブレット・スマートフォンなど、表示する画面の大きさや向きに応じて、ウェブサイトやアプリの文字の大きさ・画像の配置・メニューの形などを自動的に調整する設計手法です。あらかじめ画面の種類ごとに別々のデザインを作るのではなく、一つのデザインの中に「この幅ならこう表示する」というルールを組み込み、画面が変化してもレイアウトが崩れないようにします。

どこで使われるか

多くのウェブサイトで標準的に使われている考え方で、パソコンの大きな画面で見ても、スマートフォンの小さな画面で見ても、同じサイトが見やすく表示されるのはこの仕組みによるものです。近年は、折りたたみ式のスマートフォンや、画面の向き・構成が変わる端末向けのアプリ開発でも、同じ考え方が重要になっています。

身近な例

スマートフォンを縦に持っているときと横に持っているときで、ウェブサイトのメニューの表示位置や文字の大きさが変わるのを見たことがある人も多いでしょう。これもレスポンシブデザインの働きの一例です。

注意点

レスポンシブデザインは画面の大きさに応じて見た目を自動調整する仕組みですが、すべてのサイト・アプリが対応しているわけではありません。古い作り方のサイトでは、スマートフォンで見ると文字が小さすぎたり、ボタンが押しにくくなったりすることがあります。