Webサイトのレイアウトとして5つの基本系を知っておくと、Webサイトを検討する際に役に立つ。
レイアウトとは、例えば1カラムや2カラムなど、全体的な構造レイアウトのことである。
それぞれの特徴は以下だと考えてほしい。
一直線にユーザーに訴えかける傾向があり、世界観の演出力がある。メインコンテンツ部分の幅が広いので画像での訴求力があり、ブランドイメージの促進によい。またサイドバーに目が行かない分、目線の流れをある制御しやすく、意図した流れでコンテンツを見せることができる。
【1カラムレイアウトの例】
サイドバーが右か左にあるレイアウト。他のページへのリンクやブログの新着情報一覧などを表示させることが多い。ナビゲーションとしては親切になり、他ページのコンテンツへの遷移をしてもらいやすくなる。
一方で世界観の演出としては1カラムに比べて劣る。
【2カラムレイアウトの例】
情報量が多いサイトにありがちなレイアウト。全体的にスマートではなく見づらくなるが、情報量の豊富さを見せることがメリットになるサイトには向いている。Yahooのトップページは3カラムである。
【3カラムレイアウトの例】
多数のコンテンツをフラットに並列的にレイアウトするためわかりやすいが、特定のものを強調しづらい傾向にある。
ニュースサイトやファッションサイトなどによくあるレイアウトで、一覧性の良さが求められるものに向いている。
【グリッドレイアウトの例】
世界観の演出にはもってこいのレイアウトである。
メッセージ性やイメージ性が強いサイトに向いていて、インパクトを創出できる。
感性に訴えかける訴求だといえる。
【フルスクリーンレイアウトの例】
レイアウトが変わればできるデザインも大きく変わる。ユーザーに対してどんな印象をもたせたいのか、あるいはどう行動してほしいのかを考えレイアウトを決めよう。