目次

    そもそも「文字詰め」とは何か?

    「文字詰め」とは、文字と文字の間の間隔を読みやすく調整する作業を指します。

    正方形の枠に収まった漢字とひらがな

    図のように、フォントというものは1文字が正方形の枠の中に収まった状態で並んでいます。しかし、おさまる文字は「あ」や「し」など横長だったり縦長だったりするため、そのままだと不自然な隙間が空いてしまうのです。
    不自然な隙間が空くと読みにくい上、ブランドロゴの場合だとカッコ悪く見えてしまいます。文字詰めとは地味ですが、とても重要な作業なのです。

    さて、文字詰めを行うシーンとしては大きく2つ「印刷物」と「Web」に分けられます。
    まず今回は印刷物上での文字詰めの方法をご紹介します。

    の、前の下準備

    Illustratorの操作パネル

    イラストレーターを使っている場合、文字パネルの「アキを挿入」部分の設定を、両方とも「自動」から「アキなし」に変更してください。「アキ」とは、「、」や「()」などについてくる余白のことです。印刷物の場合、アキがあると読みにくくなってしまうので、原則アキは無しにするとよいでしょう。

    印刷物むけカーニング方法3種類

    1. 自動で詰める方法:メトリクス

    Illustratorの操作パネル

    フォントに入っている余白情報を用いて文字を詰める方法。Opentypeという種別のフォントなら「プロポーショナルメトリクス」機能を使えば、フォントデザイナーが意図する最適な文字詰めを行なってくれます。
    ただし欧文には対応していないので、カーニング設定でメトリクスを追加選択するか、後述オプティカルを選択する必要があります。また、メトリクス単体を選択後手動で文字詰めをすると不自然な余白が空いてしまうことがあるため注意が必要です。

    結論として、メトリクス設定で作業をする場合はプロポーショナルメトリクスとメトリクスを組み合わせて使うことを推奨します。

    1. 自動で詰める方法:オプティカル

    Illustratorの操作パネル

    IllustratorやPhotoshopなどソフト側で文字詰めしてくれる機能。フォント内に余白情報が無いTruetypeという種別のフォントや欧文フォントの文字詰めが可能となります。

    結論として、メトリクス設定で作業をする場合はプロポーショナルメトリクスとメトリクスを組み合わせて使うことを推奨します。

    プロポーショナルメトリクスとオプティカルの併用はNG!

    オプティカルとメトリクス、双方にメリットがあるとはいえ、両方使うと文字が重なってしまう可能性があります。フォントの状態に応じて使い分けるのがベストです。

    3.手動で詰める

    これはかなり感覚的な部分ではあるのですが、上記2つどちらかの方法を使っても微妙な余白が空いたり、詰まりすぎてしまうことがあります。こうした場合は手作業で1文字ずつ詰めるやり方が有効です。

    Illustrator上での操作方法

    1. 詰めたい文字の右側を選択
    2. Optionキー(altキー)を押しながら、
    3. 右の矢印キーで詰めるor左の矢印キーで空ける

    手動で詰めるコツ

    「いやとは言っても、パッと見たときどこを詰めたらいいか分からないよ」
    「やってるうちにどんどん意味不明になってきたよどうしてくれるんだ」
    と思われる方もいらっしゃるかと思います。(新卒の頃の私がそうでした)

    そこで、手動で詰める際のコツをご紹介できればと思います。

    丸と直線を意識する

    英語でポップコーンと書かれている文字詰めの説明図

    図のように、隣り合う文字の形が直線同士であれば余白は広めに、直線と丸であれば若干狭めに、丸同士であればさらに狭めに余白を詰めると整った見た目になります。

    上下逆さまに文字詰めしてみる

    英語で上下逆さまにポップコーンと書かれている文字詰めの説明図

    文字詰めする中で意味不明になってしまうのは、脳が言葉の意味も一緒に考えてしまうため。行き詰まったら文字を上下逆さまにして、気になった部分を詰めていきましょう。
    ただし文字を逆さまにしているので操作も左右逆になります。ご注意ください。(余談として、デッサンにおいてもパッケージ類を描く際は書かれている言葉を「図形」だと思って描くように、とされています)

    いったん別のことをする

    これはデザインにおいても起こりうることですが、1つの作業に長時間取り組んでいるとどんどん視野が狭くなりがち。あまりにも煮詰まった際にはいっそ別のタスクに取り組んだり、少し休憩するのも手の一つです。


    さいごに

    ここまでで文字詰めに関していくつかご紹介しましたが、作業する方によって多種多様なやり方があり、確実な正解は無いです。
    お話したことを踏まえて自分なりの文字詰めの最適解をぜひ見つけてみてください。

    おまけ

    カーニングが学べるWebゲーム「KernType」

    腕試しにぜひどうぞ。

    PREV
    2025.03.07
    便利な生成AI「Galileo AI」について解説
    NEXT
    2025.03.09
    WEBディレクターが知っておくべきAWSの基礎知識【初心者向け第1回】