Hatena Blog Tags

レスポンシブWebデザイン

(ウェブ)
れすぽんしぶうぇぶでざいん

Webサイトのページデザインを「ブラウザやデバイスの種類」で判別するのではなく、「ブラウザやデバイスの表示幅」で判別して表示を切り替える手法。
スマートフォンやタブレット端末の普及により、それぞれのデバイスに対応させたHTMLファイルを用意するのが一般的だったが、レスポンシブWebデザインを活用すれば、1つのHTMLファイルをCSS3で制御して表示を最適化することができる為、管理や制作が非常にしやすいのが特徴。

メリット

  • メンテナンスに手間がかからない:レイアウトをひとつ変更すると、全デバイスの表示に対応される
  • リダイレクト設定をする必要がない:携帯電話やiPhoneなどのデバイスごとに異なるURLを用意しする必要がない
  • ユーザー・インターフェース:デザインが統一されていることで、ユーザーは普段どおりにページを閲覧することができる

など。

デメリット

  • 開発に時間がかかる:通常のHTMLだけで組まれたレイアウトと比べると製作に時間がかかる
  • Internet Explorer 8 問題:IE用に全く異なるスタイルシートを用意すれば問題ないが、IE8がメディアクエリを認識しないために通常は対応していない

など。

このタグの解説についてこの解説文は、すでに終了したサービス「はてなキーワード」内で有志のユーザーが作成・編集した内容に基づいています。その正確性や網羅性をはてなが保証するものではありません。問題のある記述を発見した場合には、お問い合わせフォームよりご連絡ください。

関連ブログ