＃02:レイアウトと構図
黄金比をはじめとした美しい構図をつくるためのテクニックを紹介していきます。
黄金比は、昔から人々が美しい、バランスがいいと感じてきた大きさの比率です。
黄金比の近似値は 1 : 1.618（約 5 : 8）です。
モナリザの絵や企業のロゴなどに使用されています。
3 × 3 グリッドの黄金分割は、黄金比をつかって縦横を３分割し、そこに要素を配置する構図のテクニックです。
1 / 3 ルールは、縦横をきっちり1/3に分けた線を引き、そこにあわせて要素を配置することで美しい構図を作るテクニックです。
Webサイトでは、「スキャニングパターン」という人の目線を意識したレイアウトやボタン配置などを考えます。
人の目線の動きが F の形になるようなスキャニングパターンです。
たとえば、Webサイトを見たとき
まず左上から視線を右に水平に移動し、
次に少し視線を下に移動して、
また水平に視線を移動する
ときのようなパターンです。F パターンは文章の多い、２カラムのレイアウトに多いスキャニングパターンです。
人の目線の動きが Z の形になるようなスキャニングパターンです。
たとえば、
左上から右へ、
そこから左下へ移って、
最後に右下に視線が移動する
という流れです。Z パターンは文章が比較的少ないページに多く見られるパターンです。