ホームページ制作の上で大切な「文字」の話【ノンデザイナー向け】

こんにちは！夏フェスとライブを目前に控えた牧野です！！

前回はホームページの色が与える印象や、配色のコツについて書きました！
今回も見た目に関するところで、書体や文字の間隔、行間によって与える印象についてまとめましたので、ぜひご覧ください。

文字間・行間を調整してみる

まず、文字間と行間がぎゅっと詰まった文章を見て見ましょう。

ホームページ制作・コンサルティングが
得意なビーズクリエイトです。この記事
はデザイナーの牧野が執筆しています。
私はうどんが大好きで、全国のおいしい
うどんを食べ歩く旅に出たいと常日頃考
えています。おいしいうどん屋さんをご
存知でしたら、ぜひ教えてくださいね。

う〜ん…すごく読みづらい…。
こんな風に文字間・行間が詰まりすぎていると、文字と文字がくっついてしまって大変読みづらいんです。
目を凝らさないと読めないので、疲れてしまいますよね。

対して、文字間と行間をどどんと広げた文章がこちら。

ホームページ制作・コンサルティングが
得意なビーズクリエイトです。この記事
はデザイナーの牧野が執筆しています。
私はうどんが大好きで、　以下略

ゆったりしていて読みやすいかと思いきや、縦読みなのか横読みなのかわかりません…。
目の移動する距離が多すぎて、こちらも疲れるし読みづらいですね。

それぞれが与える印象

ぎゅっと詰まった文章

忙しさや急かされるような印象を与えることができます。
安売りのチラシで、金額の文字間が詰まっているのはそのためです。

うどん大好き！

かしこまったイメージや、スピード感を与えるには、文字間を詰めるのがオススメです。
さらに文字を太くしてみると、より角張った感じが伝わりますね。

うどん大好き！

※読みづらくなるので、詰めすぎには十分注意しましょう！

ゆったりと余裕のある文章

ゆったり感、優しい感じ、高級感を感じさせることができます。

うどん大好き！

30代以降がターゲットの女性誌では、文字間が空いた細文字のロゴが使われていることが多いです。

うどん大好き！

※こちらも読みづらくなるので、やりすぎには注意です！

「こう思って欲しい！」によって、文字間や書体を調整しましょう！

サイトの雰囲気にもよりますが、「今すぐこのボタンを押して欲しい！」という時には文字を太くして詰めてみたりしても良いかもしれません。
ゆったりリラックスして読んで欲しい場合は、文字を細めにして文字間をしっかり開けた文章にしてみましょう。

ところで、文字間と太さの調整の他に、変化していることがあったのですがお気づきになりましたでしょうか。
実は、「ゴシック体」と「明朝体」を使い分けていたのです！

書体の使い分けについても書く予定ですので、お楽しみに！