MD-Blog_Web Creative

Webデザインを生業にしているみなさん、こんにちはこんばんは！
MD-USHIDAです。
カープが強くて、ウハウハな毎日をおくっております。

さてさて、今回のテーマは、
第2回「フォントについて改めて考えてみよう　～UDフォント編～」です。

デザインとは"切っても切れない関係"のフォント。
第2回は、最近よく使われている「UDフォント」について、改めて勉強してみましょう！

「UDフォント」とは？

そもそも「UDフォント」とは、いったいどんなフォントなのでしょう？

UDフォント (Universal Design Font／ユニバーサル デザイン フォント)

「年齢・国籍・文化・障がいの有無に関係なく、出来るだけたくさんの方にとって利便性が高いデザイン（ユニバーサルデザイン）」をコンセプトに、視認性・読みやすさを追求し、設計されたフォント

書体のデザイン自体がシンプルで、誤認を防ぐために類似した文字にはしっかりと区別されたデザインになっていて、携帯電話・説明書などの小さい文字や高速道路の標識など、読みにくく間違いやすい環境でも比較的読みやすいため、正確な情報伝達に対応しているデザインとなっています。

また、Webやグラフィックのデザイナーにとっては、潰れやすい・誤読しやすい文字に個々に対応しているので、小さなフォントサイズでも使用することが出来たり、文字のバランスをしっかりと検証されているから幅広い用途で使いやすく、ありがたみのあるフォントですね。

上図のように、UDフォントと比べると、その他の一般的なフォントは濁点などが小さく、場合によってはくっついてしまっていることが分かります。

UDフォントの視認性・可読性

次にどのくらい視認性・可読性に違いがあるのか、調査してみましょう。

UD新ゴと新ゴのテキストを、30px／20px／10pxのサイズで用意してみました。
いかがでしょうか？

フォントサイズが小さくなる（認識しづらくなる）につれて、読みやすさに違いが出てきてますね。
新ゴの10pxでは「暑」が完全に潰れてしまっていますが、UD新ゴはなんとか読めるかと思います。文字列のガタツキも、UD新ゴの方が少ない感じがします。

重ねるとこんな感じ！

 UD新ゴの方が、仮想ボディいっぱいに大きくデザインされていています。
大文字化することで潰れも少なく余白もしっかりと開いていますね。

ただ、UDフォントは大きくデザインされてる分、文字間が狭く見えがちな印象です。個人的には長文に使用する際には必ずカーニングを入れています。
文字自体のバランスが良いので、よりすっきりと読みやすくなるかと思います！

※"仮想ボディ"や"カーニング"について前回の記事を読んでね!!

UDフォントの主な取り扱いメーカー一覧

では最後に、UDフォントを発表している主なメーカーをご紹介します。

イワタUDフォント

http://www.iwatafont.co.jp/ud/
パナソニックと共同開発された、UDフォントの元祖です。

モリサワUDフォント

http://www.morisawa.co.jp/font/about/knowledge/ud/
言わずと知れた国内最大手メーカー。UD新ゴの使い勝手が良いと、個人的に感じてます。

ヒラギノUDフォント

http://www.screen.co.jp/ga_product/sento/
Macユーザーにはおなじみのヒラギノ。モリサワパスポートに契約するとコチラも使用できます。お得！

モトヤ

http://www.motoyafont.jp/images/shotai_sample/motoyaud_font.html
最近ではGoogleでおなじみのフォント。

まとめ

UDフォントについてザクっとまとめてみました。いかがだったでしょうか？
UDフォント自体が有料で、それなりに高価ではありますが、使っている感想としては「デザインに使いやすい」と感じるフォントがたくさんありますね。
最近ではWebデザインにも視認性・可読性の重要性が増して来ていますので、ぜひ、利用してみはいかがでしょう。

ではでは。