文字にコントラストをつけるのはとても効果的です。
見栄えがよくなるというメリットもありますが、伝えたい情報がより伝わりやすくなるんです。
ユーザーがページを見たときに、どれが重要な情報かを意識的に探さないといけないというのは、うまくページをデザインできていないからで、一番伝えたい情報をしっかり意識してコントラストをつけることで、ユーザーの視点は自然とその情報にいきます。
サイズ・太さ・構造・形・方向・色などを工夫することで、文字にコントラストをつけることができます。
サイズ(size)
一番単純でわかりやすくコントラストをつけるとしたら、文字のサイズです。
大きな文字と小さな文字を組み合わせることで簡単にコントラストがつきます。
ただし注意しないといけないのは、中途半端な大きさの差にしないこと。
思い切って大胆に大きく・小さくしないと、意味がありません。デザインの衝突がおきてしまうだけで、平凡な感じになってしまうからです。
読んでもらいたい文章の文字は大きくしようと考えるのが普通かもしれませんが、方法はそれだけはなく、文字が小さくても読んでもらう工夫をすることができます。
たとえば大きな紙があって、中心に小さく一文を書いたとすると、文字は小さくても絶対にその文章に目がいくはずです。
これは文字と文字のコントラストではなく、大きな紙に小さな文字というコントラストが生まれているからです。
なので単に文字を大きくすればいいわけではないんだと思っておいてください。
あと、アルファベットには大文字と小文字がありますが、全て大文字にするよりも小文字を使った方が、より多くのスペースを使えるようになるため、文字を大きくしやすいです。
太さ(weight)
太さでコントラストをつけることもできます。
文字を太くすればその分目立ちますし、見出しなどに使うだけでも、情報の構造が一目でわかるようになるので効果的です。
ほとんどの書体の太さには、ライト(細字)・レギュラー(普通)・ボールド(太字)・セミボールド(中太)
・エキストラボールド(極太)があります。
文字のサイズと同じで、せっかくコントラストをつけるなら、大胆に太く・細くしましょう。
色(color)
色のコントラストもわかりやすいですね。
文字色が違うだけで、印象も全然違います。
色の大きな特徴として、赤やオレンジなどの暖色は前面に出てくるのに対して、青などの寒色は引っ込んで見えます。
そのため赤をたくさん使いすぎると、その文字が強調されすぎてしまうおそれがあるので、少し使うだけでもいいかもしれないですし、反対に青色だったら少ないとあまり強調されないので、多めに使ってもいいかもしれません。
構造(structure)
構造というのは、文字がどのような構成になっているのかということ。
太さの推移だったり、セリフがあるかないかなどです。
一般的には、1つのページで同じ種類の書体は使わない方がいいとされています。
たとえばオールドスタイルの書体を2種類同じページで使ったりしない方がよく、1つはオールドスタイルを使って、もう1つはサンセリフ書体を使うなど、違うカテゴリーの書体を使うべきなんです。
書体のカテゴリーについては『活字の基本的な6つのカテゴリー!欧文書体にはこういうものがある』を読んでみてください。
形(form)
同じ構造の文字でも形が違うかったり、意図的に変えることができます。
アルファベットだとそもそも大文字と小文字で全然見た目の形が違いますし、他にわかりやすいのはローマン体かイタリック体。
ローマン体というのは上下にまっすぐの形のことを指しますが、イタリック体は文字が傾いています。
こういった文字の形を利用して、コントラストをつけるのもひとつの方法です。
方向(direction)
文字の方向は少しイメージしづらいかもしれませんが、文字を見るときの視線の流れのことを意識するといいかと思います。
通常は横向きですが、横文字を縦方向に書くこともできます。そういう場合は視線が横に流れるというよりも縦に見ているという感覚の方が近いです。
あと、文字(文章)の傾きもコントラストのひとつ。
ただしなぜ文字を傾ける必要があるのか、言葉で説明できなければいけないとは思います。
それができなければ文字を傾ける必要はおそらくないからです。
文字のコントラストを組み合わせる
文字にコントラストをつける方法を6つ紹介しましたが、これらは別々に使わないといけないわけではなく、組み合わせて使うとより良いコントラストが生まれると思います。
たとえばサイズや太さに差をつけて、なおかつ文字色も変えたり、形や構造も変えるといった感じです。
デザインの本質は問題解決であり、伝えたい情報を伝えやすくするためのものです。なんのコントラストもない文字は読んでもらいづらいため、伝えたい情報は伝わりません。
そういったデザインによるコミュニケーションを強化するという意味で、コントラストはとても大切です。
[…] 関連記事 『活字の基本的な6つのカテゴリー!欧文書体にはこういうものがある』 『和文活字のカテゴリー!明朝体やゴシック体の他にどんな種類がある?』 『文字にコントラストをつけると情報がより伝わりやすくなる』 […]