「ビジュアルが中心」か「読み物が中心」かによってどのような表現をするか考えて制作することがデザインで必要なことと思います。
「読み手に伝わるデザイン」「心に残るデザイン」「読みやすい文字間」を制作する上で大切なことは、センスよりも基本ルールとデザインの目的を明確にすることだと考えています。
広告バナーやblogアイキャッチ画像を作る際に、自身が意識している文字間や文字組のルールついてまとめました。
文字間(仮想ボディ)
和文書体の文字は「仮想ボディ」と呼ばれる正方形の枠内に収まるように設定されています。文字によって大きさは異なりますが、仮想ボディの大きさは均一です。
和文書体は、すべての文字が同じ大きさの仮想ボディが均一に設定されていますが、欧文は英文と数字と種類によって仮想ボディの幅が異なります。
大きい文字の文字間
タイトルや見出しで強調する文字の場合は、文字を入力した後で文字間を開けて調整する事をおススメします。
枠を作りその枠内に一文字一文字均等に揃えていきます。
ベタ組みだと少しバランスが崩れてしまうので、枠に綺麗に入るようにカーニングで調整していきます。
小さい文字の文字間
見出しなどと違って文字の強弱で弱の小さい文字に関しては、間隔を狭くする「ツメ」をしっかりと行います。
文字間を調整することを「カーニング」といい、間隔を狭めることを「ツメ」といい、間隔を広げることを「アキ」といいます。文字を入力した後に行う重要なテクニックです。
ひらがなと漢字(和文)
ひらがなやカタカナは漢字に比べて、文字間が空いて見えます。
カーニングにおいてカタカナは「イ」と「ン」の間隔が広すぎる為「ツメ」。漢字はどの文字も狭すぎるので「アキ」で微調整します。
自動カーニングもありますが、始めのうちは一文字一文字丁寧にカーニングしていくことで文字間の感覚を身につけることができます。
ショートカットキー「Alt + ←→」で微調整可能。
この作業を何回も繰り返ししていると、自身が「しっくりくる」「美しい」と思う文字間に関して自然に身につくと思います。
英数字(欧文)
和文に英数字が登録されていますが、和文は基本和文を綺麗に表示するためにデザインされたフォントである為、和文で英数字を使用することはNG。
上が小塚ゴシックPro(和文)の英文で、下がArial(欧文)の英文です。見比べた時にやはり、欧文を使った英文が美しく見えますね。
- 和文:ひらがな・カタカナ・漢字
- 欧文:英文・数字
文字組(応用編)
以上の基本を踏まえた上での応用編として後は、文字組に関してです。
文字組を少し変えただけでも大分印象が変わってきます。カーニングを行った上で文字列を美しく並べる。デザインに正解はありませんが基礎を基準に後は自由に自身のデザイン感性をぶっこむとまた一段と良い仕上がりになってくると思います。