# UDフォントと読みやすいデザイン（大きさ・色・余白） こんにちは、フリーランスデザイナーの千舟子です。 今日は、読みやすさの作り方について、 フォント選びが私たちの印象をどう変えるのか、 というテーマでお話ししていきたいと思います。 まず結論から言ってしまうと、 フォントで何が変わるのかというところなんですけど、 タイトルにある通り、 フォント一つで読みやすさが変わるという話を 今日はしていきます。 もちろんフォントで与える影響の変化って、 読みやすさ以外にも色々あります。 例えば世界観だったり、 このフォントで受ける印象、 このフォントだと優しい感じ、 フレンドリーな印象を受けるなとか、 高級感を感じるなとか、 抽象的な感情みたいな変化はもちろんあるんですけど、 今日はその中でも特に読みやすさっていう フォントの力についてお話したいなと思います。 メインはフォント選びで読みやすさが変わりますようなんですけど、 後半では読みやすさを作るには、 フォントを選ぶだけじゃなくて、 もっとデザイン面で色だったり大きさ、 余白の作り方とか、 具体的にデザインで応用するときに、 読みやすさを担保するポイントもご紹介したいと思います。 そもそも、何でフォントで読みやすさが変わるのか? っていうところからなんですけど、 まずフォントって一つ一つコンセプトがあるんですよね。 あるコンセプトに基づいて作られた、 デザインされた文字の塊、 集合をひとまとまりで書体とかフォントって呼ぶんですけど、 それがそれぞれ作りたい世界観があったり、 あとは適した仕様場面、 こういう時に読みやすいフォントにしようみたいなコンセプトとか、 そういったフォントによってあるんですよね。 おすすめの世界観、作りたい世界観だったり、 仕様場面っていうのがあるので、 選ぶフォントによって受ける印象だったり、 読みやすさっていうのが変わってくるんですよね。 例えば同じ民調体でも、 横書きの時に読みやすいフォントと、 縦書きの時に読みやすいフォントみたいな、 そういうコンセプトの違いで、 フォントを分けているものとかあるんですよね。 こんな感じで、フォントの種類ってたくさんありますけど、 それぞれにコンセプトとか、 おすすめの仕様場面みたいなのがありますよっていうところで、 今日はその中でもUDフォントっていうのをご紹介したくて、 このフォントの中に頭文字でUDって入ってたり、 フォントの名前の途中にUDって入ってたりするものがあるんですけど、 皆さんも見たことありますかね。 このUDって何の略かっていうと、 ユニバーサルデザインの略で、 ユニバーサルデザインってフォント以外でも結構、 バリアフリーデザインとか、 街づくりでよく聞くかなと思うんですけど、 段差をなるべくなくして、 車椅子の人でも使いやすい街づくりとか、 駅にめちゃくちゃエレベーター増えてるとかもそうですし、 そういった身体的な能力の差とかに限らず、 あらゆる人、みんなにとって使いやすい、 分かりやすいみたいなデザインのことを ユニバーサルデザインって呼んだりするんですけど、 これがフォントにおいてもあるんですよね。 フォントで言うと、誰にとっても読みやすいとか、 しっかり文字の判別がしやすいみたいな、 そういう視力にちょっと欠点があるみたいな人でも、 しっかり読みやすいようにデザインされているフォントが UDフォントです。 フォントにおけるユニバーサルデザインって 具体的にどう違うのか? 普通のフォントと何が変わっているのかっていうと、 似たような文字の差をしっかりつけるだとか、 なるべく画数を減らすみたいな、 なるべくシンプルな形にするとか、 あとは濁点と反濁点の違いも分かりやすいように より強調したり、 っていうような工夫がUDフォントではされてるんですよね。 このUDフォントのすごさが分かるエピソードが一つありまして、 奇跡のフォントっていう書籍で紹介されてたんですけど、 ある小学生の男の子のお話で、 その子は普通の本とか教科書の文字っていうのが どうしても読めなくて、 どうせ俺は無理だからみたいな感じで 途中で読むの諦めちゃうっていう子がいて、 その子のためにその小学校ではちゃんと 普通の教科書を読ませるんじゃなくて、 本とかの画面を使ってズームしやすくしたり、 色を自由に変えられたり、 みたいなそういった工夫をしてたんですけど、 それでもどうしても読めないっていう子がいたんですよね。 それで小学校の先生が試しに教材のフォントを UDデジタル教科書体っていうフォントに変えてみたんですよ。 そしたらその男の子が、 これなら読める、俺はバカじゃなかったんだって言って、 それまで文字を読むっていうのがなかなかできなかった男の子が フォントを変えることでしっかり読みやすくなったっていう事例があるんですよね。 という感じでこれぐらいフォントには 種類によって読みやすさが格段に変わるだとか、 そういうポテンシャルがあるんですよね。 これを聞くと、じゃあ全部UDフォントにすれば みんなが読みやすくていいじゃんってなるかもしれないんですけど、 ただここで強調したいのは、 フォントを変えることで読みやすさが大きく変わるように、 それぞれフォントが持っているコンセプトによって 与える印象が変わってくるっていうところをお伝えしたくて、 一番自分が作りたいデザインが読みやすさ最優先のデザインなら UDフォントを使う意識を使うようにすればいいんですけど、 例えばカフェのメニューとかでもっとカフェの世界観、 高級感のあるカフェならそういったフォントで より世界観を作り出したい場合もあるだろうし、 その中でも細かい文字はUDフォントを使った方が読みやすいかなみたいに そういった使い分けもできると思うんですよ。 という感じで、今日はフォントっていうのはそれぞれコンセプトがたくさんあって、 その中で読みやすいものがあったり、 より伝えたい世界観が変わってきたりっていうのがあるので、 デザインをする上でフォント選びっていうのは結構大事ですよっていうのが 今日のお話です。 最後に、読みやすさっていうのを作りたいときに、 フォントをとにかくUDフォントにすればいいのかって言うとそうじゃなくて、 フォント選び以外にも文字の大きさだったり、配色、 あとは余白の作り方で読みやすさにも大きく影響があって、 例えば大きさで言うと、文字の大きさは潰れない大きさだとか太さにしたり、 あとは読ませたい文章、長い文章とかは大きくしすぎない方が読みやすかったりっていうような感じで、 大きさっていう一つの視点でもより適切なデザインっていうのがあります。 あとは色で言うと、よく私もこの配信で言ってるのが、 明度差をとにかくつける、白黒にしたときの明暗の差ですね。 具体的なテクニックとしては、写真の上に文字を載せるときとかは、文字の下に色ベタを敷く。 例えば黒い文字で背景が緑の木々の森の中みたいな写真だったら、 黒い文字って見づらいと思うんですけど、その黒い文字の下に白い帯を敷くみたいな、 そういった感じで明度差をしっかりつけたり、 あとは文字の周りに光彩っていう加工だったり、ドロップシャドウっていう影をつけたり、 っていうことでも明度差をしっかり強調するっていうのができます。 あとは余白、文字周りの余白を適切にとる。 具体的には文字同士の間隔、横の間隔だったり、あとは行と行の文字の塊の間隔をしっかりとるとか、 文章の上下左右にしっかり余白をとる。 なんか枠の中にすごい文字ギチギチに詰め込んじゃうとかたまにあると思うんですけど、 そういうのはすごく読みづらいので、しっかり文字の周りに余白をとるっていうのも読みやすさにつながります。 ということで、今日は読みやすさの作り方について、特にフォント選びっていう視点でいろいろお話ししていきました。 キクダケフリーランス講座の毎週火曜日はこんな感じでサクッと学べるデザインのお話をお届けしています。 今日も最後まで聞いてくださりありがとうございます。