リキッドレイアウト(liquid layout)
「このサイトはリキッドレイアウトで作っているよ」と言われてピンと来たあなたはデザインに関する勉強をしたり、興味がある方です。
最近よく耳するレスポンシブデザインと混同しがちなデザイン手法ですが、それぞれに共通する部分もあれば明確な違いもあります。
いずれにしても今後は良く目にすることになるであろうレイアウトである事は間違いないので、是非これを機に覚えてしまいましょう。
[adstext]
[ads]
リキッドレイアウトの意味とは
一言で言うと、表示されるデバイスごとにコンテンツの大きさが最適化されて切り替わる表示形式になります。
先ほど申し上げたようにレスポンシブデザインと似ている部分があります。共通点としては、1つのURLに対してユーザーの閲覧デバイスによって表示が切り替わるという点です。
違いとしては、レスポンシブデザインはデバイスによって不必要な素材は非表示になるのに対して、リキッドレイアウトはそのままのデザインが拡大・縮小するイメージであるという事です。
リキッドレイアウトの由来
最近ではスマホだけでも様々な大きさのものが出てきました。さらにそこにタブレット、PCとデバイスを足していくと数十種類の大きさのデバイスが出てきました。
しかし、それらすべてに合わせてデザインを変えていたのではあまりにも工数がかかりすぎます。そこで出現してきたのが、利用するデバイスによって表示の大きさを変える形態です。
リキッドレイアウトの文章・例文
例文1.リキッドレイアウトを施しているので、デバイスの大きさに応じて表示の大きさが切り替わるようになっている
例文2.複数のデバイスで閲覧されることを想定して予めリキッドレイアウトで制作をしてある
例文3.デバイスの種類が無数に出現している昨今においてはリキッドレイアウトは有効なデザイン手法だ
例文4.リキッドレイアウトで作ったサイトはデバイスによっては可読性が悪くなってしまう
例文5.今後の運用体制を考えてリキッドレイアウトで作成することにした
今後のサイト運用を考えたら、昔のようにサイトを作ったらしばらくは更新もしなくて良いような状況ではないため、リキッドレイアウトで作成することが望ましいです。
リキッドレイアウトの類義語
リキッドレイアウトの他に代表的なデザイン手法として、グリッドレイアウトというものがあります。格子状の枠を張り巡らせ、それにそってコンテンツを配置していくというデザイン手法です。また、エラスティックレイアウトというものもあり、これは横幅を決める基準として文字数を利用するものです。
リキッドレイアウトまとめ
今後はますますリキッドレイアウトの需要が高まっていく事は間違いありません。
レスポンシブデザインの特徴を明確に把握した上で、今後制作をしていくうえでは積極的に取り入れていきたい手法です。