こんにちは！
デザイナーの伊東です。
今回から数回に分けてタイポグラフィーについて書きます。
タイポグラフィーといっても、欧文書体に標準を絞りたいと思います。
グラフィックデザインやDTPとくらべ、Webサイトをデザインしているとどうしても文字の扱いが雑になってしまいがちです。
しかし、最適なフォントの選定や、行間、字間を上手にコントロールすることはどんなデザインをする上でも重要な技術だと思います。
文字組を美しく見せるということは、情報をきちんと整理し、正しく伝えるというデザインの本質的な役割も担います。
そんな重要なお話なので、昔読んでいたタイポグラフィの本を引っ張り出してきて慎重に復習しながら、ゆっくりとブログにアウトプットしていきたいと思います。
書体の種類
用途にあった書体を正しく選ぶために、書体の種類と成り立ちが頭に入っていると便利です。
大まかな書体の分類をご紹介します。
ローマン体(セリフ体)
「セリフ(serif)」とは、「はね」、「はらい」のような飾りの部分のことを言います。
日本語で言うところの明朝体のような書体です。古代ローマでこのような大文字ができたことから「ローマン体」と呼ばれ、セリフがついていることから「セリフ書体」とも呼ばれます。このセリフのおかげで横方向の視線の誘導ができるため、長文に向いていると言われています。
サンセリフ体
「サン(sans)」はフランス語で「無い」という意味で、セリフの無い書体のことを表します。文字の歴史の中では比較的新しい書体です。「ゴシック体」とも呼ばれることがありますが、ヨーロッパでは「ブラックレター」という書体もゴシックと呼ばれることから、「サンセリフ」と呼ぶことが一般的だそうです。
遠くから見てもその形がはっきりと判別できるため、見出しや看板、標識などでの使用が向いています。
イタリック体
もともとイタリアで使われていた筆記体のことをさします。特徴は右に傾いている形です。単純に字を傾けただけの書体を「オブリーク(oblique)」と呼ぶのに対して、イタリック体は字を傾けた時のデザインの崩れが調整されています。
本文中でも特に強調したい文言や、周囲との違いを出すときに使用されます。
スクリプト体
手書きで書いた線のような書体で、いわゆる筆記体と呼ばれるものです。優雅な雰囲気があるものが多いので、スクリプト体を使用することで気品ある雰囲気を演出することができます。
ブラックレター体
なかなか使用されているところを見る機会は少ないですが、黒みの多い独特な形をしています。
ヨーロッパのアルプス山脈より北側で中世に使われていたのが起源と言われています。
大まかに5つの分類と、その特徴をご紹介しました。
厳密にこういう場面ではこの書体を使わなければならないというルールはありませんが、ルーツや得意不得意を把握しておくことで、より機能的なデザインをすることができるかと思います。
欧文書体の構成
キャップハイト
大文字の「T」や「H」などの文字の天地の高さのことです。「O」などの曲線で構成される文字は目の錯覚で小さく見えるため、その誤差を補うため少し大きめに作られています。
エックスハイト
小文字の「x」を基準とした高さのことです。エックスハイトの高さでフォントの印象もだいぶ変わってきます。
ベースライン
文字のベースとなるラインのことです。大文字の下線、小文字の「x」などの下線になります。デジタルフォントでは、異なる書体でも同じ位置にベースラインを持っています。「O」「V」「W」などの文字は若干ベースラインをはみ出すことで、目の錯覚で綺麗に揃って見えます。
ディセンダー
小文字の「g」「p」「y」などのベースラインより下にはみ出る部分のことです。小文字のディセンダーを無理にベースラインに揃えているフォントも中にはあるそうですが、可読性は低いです。デザイン的に凸凹させたくない場合は大文字で組むなどで対応できます。
アセンダー
小文字の「h」などのエックスハイトより上に出ている部分のことをさします。上記のサンプル(Helvetica)のようにキャップハイトとアセンダーがほとんど同じ書体がありますが、大文字の「I」と小文字の「i」が続くと区別がつかない場合があります。「Illustrator」など、「I」と「i」が続く文字列を組む場合はアセンダーハイトがキャップハイトより高くなっている書体を選択することで格段に読みやすくなります。
タイポグラフィーの記事第一弾は書体の種類、構成についてご紹介しました。
第二弾はより実践的な、行間の調整やカーニングについて書こうと思っています。
次回もぜひご覧ください！
