可変レイアウトと段落の最適化

可変レイアウトは、コンテンツの表示幅をユーザー側が決められるスタイル。
コンテンツの表示切れが起こらないように配慮するためのデザイン手法。
使用の際は文章構成と文字組みの最適化が必要。

見出しでアウトラインを示す

可変レイアウトを採用する場合文字数が流動することを視野に入れて、アウトラインを複数の見出しでしっかり示した文章構成を採用する必要がある。

段落の周囲に余白を与える

表示幅を縮小すると、画面の中の情報量は凝縮され増えたように見える。情報量が増えたことで画面が煩雑になったように見える。この問題を回避するため可変レイアウトを採用する際はブラウザの左側と本文ブロックの右側に十分な余白を設定する。

変更可能な文字幅を制限する

ウェブページを全画面表示した場合、1行の長さが極端に長くなり読みにくくなる。大きな画面に配慮して可変した場合の幅の最大値を限定する工夫をする。