Webレイアウト

レイアウトの4つの原則

Webレイアウトを理解するためには、まず4つの基本の原則から。

原則1:近接の原則
近くにあるもの同士は関連性があるように見える原則
原則2:整列の原則
「見えない線」を引いてページ上の要素がそろっている原則
原則3:対比の原則
大事なところとそうでないところを区別してメリハリをつける原則
原則4:反復の原則
繰り返しでリズムを作って調和のとれたデザインをつける原則

レイアウトのあれこれ

3つの「揃え」を活用しよう

レイアウトする上で左揃えや右揃え、センタリングということは誰もが必ずやることです。ここでは文字の揃え方について解説していきます。

黄金比と白銀比を活用しよう

Webデザインに限らず、デザインの世界では黄金比と白銀比という概念があります。

Webレイアウト辞典(基礎編)

基本的なレイアウトの方法を紹介します。

レイアウトの仕方

トップページのレイアウトほど考えるものが難しいと感じることはありませんか?まずページのレイアウトを考える前にトップページには何があるのかを考えていきましょう。

縦で2分割

横で3分割

逆コの字/逆L字型

ページの特徴別 Webレイアウト辞典

ページの特徴ごとにWebページのレイアウトを紹介しています。

本文が主体のレイアウト(深い階層のページに便利)

段組なしレイアウト

2段組のレイアウト

関連ページのリンクがあるレイアウト

   

3段組のレイアウト

   
2010年1月14日更新