Document

Web page programming (2限)
A N N A YA 1M A G U C H I
M O N DAY
COURSE URL:
H T T P : / / W W W 2 . O B I R I N . A C . J P / A N N AY /
Today
May ２５th
2
 素材・コンテンツの収集
 ページデザインのコツ
 1．グループ化する。
 2．メリハリをつける。
 3．揃える。
 4．繰り返す。
１．グループ化する
情報の内容を整理
グループに分けレイアウトする
ページデザインの最初の法則は「グループ化」です。
1ページの情報を、まず、３つか4つのグループに分け
るところから、デザインがはじまります。雑多な情報を
内容によって整理して、分けてあげることによって、
だいぶ分かりやすくなります。
２．メリハリをつける
思い切りよく
大きさ・太さ・色・スペース
メインタイトルや強調したいイメージはなるべく大きく
し、見る人の目を引きつけるようにします。反対にサブ的な
意味合いの要素やボタン、写真の説明文などは、思い切っ
て小さくします。どれもこれも大事だからといって大きくしてし
まうと焦点がぼやけ、そのページに何が書いてあるか理解を
得るのに時間がかかってしまいます。メリハリをつけるからこ
そ、目立たせたいところが目立ち、小さい文字にも焦点を合
わせられるのです。
３．揃える
頭・幅・大きさ・左揃えが原則
複数の要素がどこかで揃っていること、これほど手
軽で実用価値の高い法則はありません。
これだけで、ほとんどのページは秩序があって見栄えの
するものになるにも関わらず、なぜかなかなか実践されて
いません。画像の角と文のはじめを揃える。見出しと本文
の頭を揃える。ボタンの横幅を揃える。写真の大きさを統
一する。揃えられそうなところを見つけたら、次から次へと
揃えてみましょう。
4．繰り返す
サイト全体の一貫性
要素の繰り返し
WEBサイトではリアルな本と違って、ページが次々と切り替り、
「現実」に存在するのは目の前の1ページだけというバーチャルな世
界なので、見出しタイトルや、画像のトーン、カラーリング、レイアウ
トフォーマットなどの要素を、統一したスタイルに保つことでサイトの
一貫性を感じさせ、見やすく、内容の理解度が高まります。

Download Report