マルチデバイスに対応したレイアウト

現在、スマートフォンのディスプレイというと4～5インチがメインとなっています。しかし先日発売されたiPhone6 plusでは6インチのディスプレイが採用されました。またタブレットでは7～10インチと様々な大きさのものが主流となっていたり、モバイル端末の画面サイズの多様化はさらに進みつつあります。
このようなマルチデバイス化に対応したwebデザインのレイアウトにはどのようなものがあるのでしょう？

マルチデバイスに対応したレイアウト

・レスポンシブデザイン
ひとつのHTMLファイルを、CSS3で制御し、画面サイズの異なる様々なデバイスに最適なページのレイアウトやデザインを調節し表示する。

・リキッドレイアウト
画面のサイズに応じて要素を相対的もしくは可変的に調整するレイアウトです。メリットとしては、文字や画像だけでなくボックスとしての要素がデバイス毎に伸縮するという事です。

・フレキシブルレイアウト
リキッドレイアウトと同じように、要素を相対的、可変的に調整します。
しかしフレキシブルレイアウトの場合、最小幅と最大幅を指定するので大きな画面で見た場合、周りに余白が生まれます。

・可変グリッドレイアウト
ブロック毎に文字や画像を配置するグリッドレイアウトにリキッドレイアウトのもつ可変性を取り入れたレイアウトです。
ブラウザのサイズに合わせボックス状になった要素が配置されていくため、情報系のサイトなどによく使用されます。

レスポンシブデザインと組み合わせて理想のレイアウトを

前述したような各デバイスに対応したレイアウトをレスポンシブデザインと組み合わせることでさらに魅力的なサイト制作が可能になります。
様々なサイトを参考に、自分の作ろうとしているサイトに最適なレイアウトがどのようなものなのか考えてみましょう？