まずはここから始めよう!デザインの4大原則

関連する情報どうしを近づける「近接」

近くにあるものどうしには関連性が存在すると感じる特性が人にはあります。そのため、関連性のある要素は一つのグループとしてまとめておくと、ユーザーにとっても分かりやすいホームページを作ることが可能です。たとえば、marginやpaddingなどを使って関連性のある要素とない要素で余白の広さに差をつけると、見た目にも認識しやすくなるでしょう。

要素を一方向に揃える「整列」

要素が左揃えや右揃え、中央揃えなどバラバラに配置されていれば、なんだかゴチャゴチャした印象をユーザーに与えてしまいます。しかし、右揃えなら右揃えで統一すると、見えない線で整えられているようなスッキリとした印象を与えることができます。

情報の優先度を明確にするための「強弱」

情報には優先度が存在します。たとえば見出しは、本文を読む前に何について書かれているかを知るために重要なものです。そこで、見出しと本文の間に文字の大きさや太さなどの違いをつければ、情報の優先度を明確に示すことができます。また、優先度を分かりやすくするためには配色も重要です。赤やオレンジなどの暖色系は色が膨張して人の目に飛び込んでくる印象があるため、注意喚起の情報などに使用するとその重要性が伝わりやすくなります。

特徴的なものを繰り返す「反復」

反復を使用するとホームページに統一感を持たせることができます。反復の代表的なものの一つがグローバルナビです。どのページでも同じグローバルナビが表示されることで、そのホームページの統一感が保たれるのです。また、ホームページの基調となる色も事前に決めておくことが重要で、各ページにその基調となる色を使用すればサイト全体に一貫性を持たせられます。

レスポンシブデザインとは、画面サイズに応じて表示を最適化する、ウェブデザインのテクニックのことです。どのような環境からウェブサイトを閲覧しても、レイアウトが最適化されるようになっています。