UPDATE:2016.11.10
- CATEGORY
初心者のためのデザイン日誌10
初心者のためのデザイン日誌!記念すべき(?)2桁目に突入!webデザインのレイアウトその2
ウェブ・レイアウトを大きく分けると「グリッド・レイアウトデザイン」と「フリー・レイアウトデザイン」の 2つに分けることができます。グリッドデザイン
文字や画像、カラムなど一定の規則に従い、格子状にレイアウトして、整然としたイメージの印象が強いレイアウトになります。本来は新聞や雑誌などの印刷物で良く使われているレイアウト手法になります。画像や文章などの構成要素を、各グリッドにきちんと配置することで、マージンを統一して各要素の大きさが多少違っていても、きちんと整列された印象を与えることが可能になります。
〜メリット〜
1 一瞬で多くの情報を見せることができる
2 サムネイル画像などを整列することでクリックがしやすい
3 整列したコンテンツを配置することでサイト全体の統一感が出やすい
4 コンテンツの追加更新が効率的にできる
〜デメリット〜
1 一度に入ってくる情報量が多くなるため、どこから見れば良いのか迷いやすくなる
2 更新頻度高いWEBサイト程、過去に興味のあった記事を見つけにくい
3 全体的な統一感があることにより、コンテンツごとの重要度に差をつけにくい
グリッドデザインのタイプ別があります。
カード型グリッドデザイン
コンテンツをカードを並べたような「カード型グリッドデザイン」。可変グリッドデザイン
ブラウザの幅に合わせてコンテンツの幅や位置を変化させる「可変グリッドデザイン」。きちんと整列されたレイアウトから秩序のような印象を感させるグリットデザイン。ただある程度の規則性の中でイレギュラーなものや、大きさの違うものを配置したりすることで個性を出したり「遊び」を入れることもできます。
次回はフリー・レイアウトデザインについて触れていきたいと思います。