見出し画像

デザイナーなら最低限知っておきたい！Tracking と Kerning って...？

Haruni

はじめに

文字デザインにおいて、Tracking と Kerning は重要な概念ですが、これらがどのように異なり、テキストの見栄えにどのような影響を与えるか理解することは、ユーザーエクスペリエンス（UX）の向上に貢献します。今回は、デザイナーにとっては基本となるTracking と Kerning の違いに焦点を当て、それぞれがどのようにテキストデザインに影響を与えるかを探っていきたいと思います！

そもそもTrackingとKerningって？

Tracking（字間）

Tracking は文字と文字の間の一定のスペースを指します。これは、段落や文章全体の文字の配列に影響を与えます。Tracking を調整することで、テキスト全体の読みやすさや視覚的な一体感を向上させることができます。

例えば、文字を狭めると（Negative Tracking）、文字同士が密になり、よりコンパクトで引き締まった印象を与えます。一方で、文字を広げると（Positive Tracking）、各文字が離れ、より余裕があり開かれた雰囲気を醸し出します。

Kerning（字寄せ）

Kerning は、特定の文字間でのスペースの微調整を指します。特に、異なる文字間での空白の均等さを保つために使われます。Kerning は、特にアルファベットの組み合わせにおいて重要です。

例えば、"AV"のような組み合わせでは、AとVの形状により適切な空白が必要です。Kerning を正しく調整することで、文字同士の不自然な隙間や詰まりを解消し、テキスト全体のバランスを整えることができます。

Tracking と Kerning の効果

タイトルのTracking

例えば、ウェブサイトの見出しにおいて、Positive Trackingを使用することで、タイトルの文字同士を広げることがあります。これにより、タイトル全体がより読みやすくなり、視覚的なインパクトが向上します。逆に、Negative Tracking（文字を狭める）を使用すると、文字同士が引き締まり、シンプルでコンパクトなデザインが実現できます。

ロゴのKerning

企業ロゴにおいては、Kerningが特に重要です。例えば、"VA"といった組み合わせでは、VとAの形状により不自然な空白が生じる可能性があります。適切なKerningの調整により、これらの文字同士のバランスをとり、ロゴ全体の印象を向上させることができます。

段落の整形

文章全体に対しても、段落ごとにTrackingやKerningを微調整することがあります。例えば、引用文や強調すべき箇所に対しては、文字を広げて強調感を高めることができます。逆に、本文部分では文字同士を引き締め、一貫性のある読みやすいデザインに整えます。

上記に挙げたのは数例ですが、Tracking と Kerning が実際のデザインに与える影響を正しく理解し、それを活かすとよりUXを向上することができます。デザイナーとしては、具体的な状況に応じて適切な調整を行い、テキストデザインに個性や効果をプラスすることが重要となってきます。

Kerningで注意すべき英字

文字にはそれぞれ特定があり、すべての文字は以下のカテゴリーのいずれかに分類されます。

  • Straight-edged：まっすぐ（H、I）

  • Rounded：丸み（O、C、Q）

  • Diagonal-sided：斜め（A、V、Y）

注意しなければならないのは、2つのStraight-edgedを組み合わせる場合、その間の距離はStraight-edgedとRoundedの間の距離よりもわずかに大きいでことです。（例：HI vs HO）
また、2つのRounded（例：OO）は、その間隔がさらに小さくなります。Diagonal-sidedは特に厄介で、大きなスペースができる（例：AV）ため、特定のカーニング値と細部への高い注意が必要となります。

背景色におけるKerning

読みやすさを保つためには、異なる背景色に対して、適切に文字の間隔を考える必要があるときがあります。

街にある道路標識などは、文字と文字の間隔が広く意図的にデザインされています。私たちの目は、暗い環境の中で白い文字をみると、目が混乱し、読む速度を遅くする傾向があります。そのため、黒背景に白文字を使う場合は、文字と文字の間隔をより空けた方がよいのです。

結論

Tracking と Kerning は、一見地味でわかりにくそうですが、文字デザインにおいて微調整を行う際に重要なツールです。適切な設定を行うことで、よりテキストは読みやすくなり、一貫性のある視覚的な印象を与えます。

また、Kerningはグリッドと異なり、望ましい特定の数値のルールや決まりがなく、デザイナーの主観的な調整に依ることが多いです。そのため、トレーニングが必要となります。日頃から、道にある標識やレストランのメニューなどをみて、Kerningの最適化をアイデアを考えてみるのはいかがでしょうか。実際にKerningをトレーニングできるゲームもあるみたいなので試してみてくださいね。

この記事を通じて、Tracking と Kerning の役割と重要性を理解してもらえたらうれしいです。

デザインやプロダクトマネジメントについてもっと知りたい、最新のトレンドや洞察を知りたいという方は、私のアカウントをフォローしてみてくださいね。この記事が役に立ったら、スキをお願いします♪


参考：
https://www.fontfabric.com/blog/good-kerning-gone-bad-tips-fail-examples-recognize-signs-mistakes/#kernlettersindividually


この記事が気に入ったらサポートをしてみませんか？