レスポンシブデザインの基礎と制作時の注意点を解説

ferret編集部：この記事は2015年11月2日の記事を再編集しています。 ここ数年で定着してきた「レスポンシブデザイン」。 Webデザインに関わる人であれば、この言葉を耳にしたことがあるのではないでしょうか。 iPadなどのタブレットや、スマートフォンの表示に最適化されたページと理解されている方も多いかもしれません。 では従来のモバイル対応ページとはなにが異なるのでしょうか？ スマートフォンが一般に普及し、タブレットも次々に上位機種が発売される今、ますます需要が高まってくると見られるレスポンシブデザインについてまとめました。 レスポンシブデザインの定義 レスポンシブは日本語だと「反応が良いさま」と訳され、レスポンシブデザインは「単一のURL（HTMLファイル）であらゆるデバイスに最適化されるデザイン」を指します。 従来は、パソコン、スマホ、タブレットなど、表示サイズの異なるデバイス毎に

[sugi_hana]

E9はCSS3非対応なので、そのままではレスポンシブサイトを表示できません。 Googleが公開している下記のコメントをヘッダーに追加すると、IEでもCSS3を使用できるようになります。 <!--[if lt IE 9]> <script src="http://css3-mediaqueries-js

[bml]

この手のサイトは表示例がないのでわかりずらいね。

[japanitnt]

レスポンシブデザインの基礎と制作時の注意点を解説｜ferret [フェレット]: レスポンシブデザインの定義…

[reirei-bijin]

PCとスマホでは、文字量に対するストレスがちがう。よって、適切な文字数を把握することが大切かも。