3-05(2) グリーキングで文章と余白のバランスを確認 | デザインってオモシロイ -MdN Design Interactive-

3-05(2) グリーキングで文章と余白のバランスを確認

2024.5.22 WED

【サイトリニューアル!】新サイトはこちらMdNについて


chapter 3 balance[バランス]

05 バランスをとって文字や文章を並べる
制作・文=境 祐司

technique2 グリーキングで文章と余白のバランスを確認



グリーキング(greeking)は、モックアップを作成する際に使用されるダミーテキストのことで、ライティングスペース(見出しや本文の領域)と余白とのバランスを確認する場合にも役立つ。行間や段落間、キャプションまわりの間隔など、全体を俯瞰できる。




【1】見出し、本文などすべての要素にclassを指定、コンテンツ全体はdiv要素でグループ化して、IDを指定する。グリーキングを表現するため、各要素に対して文字色と背景色を指定できるようにしておく。


【2】文字色のみのグリーキング(左)と背景色を加えたグリーキング(右)。ライティングスペースを色で視覚化できるため、ホワイトスペースとのバランスの検証に活用できる。



【3】ブラウザのウインドウを広げたり、狭めるなど、表示領域を変えながらライティングスペースの変化をチェック。背景に装飾画像を配置した場合は、重なり具合などを確認する。
twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちらMdNについて

この連載のすべての記事

アクセスランキング

8.30-9.5

MdN BOOKS|デザインの本

Pick upコンテンツ

現在