其の13 字間(トラッキングやカーニング)を整える | デザインってオモシロイ -MdN Design Interactive-

其の13 字間(トラッキングやカーニング)を整える

2024.4.20 SAT

【サイトリニューアル!】新サイトはこちらMdNについて
タイトル画像

レベル初級其の13

字間(トラッキングやカーニング)を整える


カーニングとは文字列の文字と文字の間隔を、文字の形に合わせて一字一字の個別に調整することである。見出しなどを画像で作成する場合、使われている文字を見やすく、美しく見せるためのテクニックだ。また、トラッキングとは文字全体を均等に詰める方法である。

カーニングとトラッキング、どちらか一方の手法を使用するのではなく、トラッキングで全体のバランスを調整し、部分的にカーニングで微調整するとよい。

ひとつの単語だけ見ると、そうした手法の効果に気づきにくいが、画面上にバランスの取れていない見出しがいくつも存在すると、サイト全体のバランスも悪く見えてしまう。ほかのデザインの要素がどんなによくても、カーニングやトラッキングの処理がなされていないと、何となくチープな雰囲気になってしまうので注意したい【1】【2】。

字間の調整を行わない例
【1】字間の調整を行わない例。文章に濁点「“」や「。」などが入っている場合、特に右側の文字との間隔が開いてしまうので、バランスが悪く見える。また、フォントによっても見栄えが違うので、注意したい
字間調整を行った例
【2】調整を行った例。「グ」と「ト」の間隔を調整した。すべての文字間が均等になったので、バランスがよく見える

お作法一覧へ
twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちらMdNについて

この連載のすべての記事

アクセスランキング

8.30-9.5

MdN BOOKS|デザインの本

Pick upコンテンツ

現在