クリエイター:コーディング備忘録ブログ

WEBデザイン

Webデザインの基本レイアウト

Webデザインには5つの基本レイアウトがあります。
・シングルカラムレイアウト
・マルチカラムレイアウト
・グリッドレイアウト
・ブロークングリッドレイアウト
・ノングリッドデザイン

1.シングルカラムレイアウト

パーツをすべて1列で構成したレイアウトです。
「1カラム」とも呼ばれます。
ヘッダーからフッターまでが上から順番に並んでいるもっともシンプルなレイアウト
パソコンやスマホ色々な端末で見てもほとんど同じレイアウトで表示されるのが特徴

2.マルチカラムレイアウト

複数の列を使ったレイアウトパターン。
シングルカラムレイアウトよりも、コンテンツを一覧で多く配置する方法
一目で多くの情報を得られるため、ニュースメディアのような回遊性をユーザーに提供するようなサービスで多く使われるのが特徴

3.グリッドレイアウト

それぞれの要素をグリッド状(格子)に分割して並べることで、美しく整えられた印象のデザインを作る方法です。
グリッドデザインやグリッドシステムとも呼ばれます。
情報を整理して見せられるレスポンシブデザインとの相性が良く、更新性にも優れているなどの特徴から、Webサイトのレイアウトとしてもよく使われる。

4.ブロークングリッドレイアウト

規則性のある境界線をポイントであえて外したデザイン方法です。
通常のグリッドレイアウトは、一味違った印象的でオリジナリティーを出しやすいのが特徴
背景にあるブロックからはみ出したり、位置を外して配置していたりします。

5.ノングリッドデザイン

ブロークングリッドレイアウトよりもさらに崩したデザインが特徴です。
ブロークングリッドレイアウトがずらす・重ねる技法を使うのに対して、ノングリッドレイアウトはより開放感のあるデザインといえるでしょう。
写真やテキストが折り重なるように配置されていたり、不規則なサイズのテキストが配置されたりします。

コメント

この記事へのコメントはありません。

RELATED

PAGE TOP