レスポンシブ? リキッド? ソリッド?

さまざまなデバイスやさまざまなウィンドウサイズに適応させるためのウェブサイトのデザイン手法.

  • 《レスポンシブデザイン》 とある指定したウィンドウ幅(ブレイクポイント)より大きい・小さいによってデザインを切り替える方法.多くはPC版(ウィンドウ幅がでかい)とSP版(ウィンドウ幅が小さい)に分けてデザインされる.中間にタブレット版のデザインを挟むこともある.PC版→タブレット版→SP版の切り替わりに際し,中間がいい感じで表示できるようになっているかがポイント.ユーザーのウィンドウ幅はまちまち,タブレットやスマホもウィンドウ幅がまちまちなので,「ここ!」とブレイクポイントを決め打ちしてデザインすると,失敗することがままある.HTML+CSSコーダーは,デザイナーの気持ちを汲んでコーディングする技量が必要.
  • 《リキッドデザイン》 ウィンドウ幅に対して柔軟にパーツを配置して見せる方法.レスポンシブデザインと組み合わせることも多い.レスポンシブデザインではPC版→タブレット版→SP版のブレイクポイントでの変化が大きいため,その変化を吸収する意味もある.HTML+CSSコーダーであれば,リキッドデザインは当然配慮すべきものと自分は考えている.
  • 《ソリッドデザイン》 ウィンドウ幅がどうであろうと固定のデザインで見せる方法.普通は利用しないけど,何らかの意図があればよいのかも.この方法を使うことはまずない.