本記事には広告(アフィリエイトリンク)を含みます。
こんにちは、コムたんです。サムネやデザインをPhotoshopで作ってます。
結論:原因は、PSDに書かれたフォントがそのMacに入っていないだけです。置き換える前に文字の幅を測っておき、「見つからないフォントを解決」で替えたあとに同じ幅へ戻せば、レイアウトはほぼ崩れません!
サムネを作る仕事をしていて、Photoshopの文字装飾は数え切れないほど作って比べてきました。その中で地味に一番時間を食うのが、別のMacで作ったPSDや人からもらったPSDを開いた時の「フォントが見つかりません」です。極太ゴシックは書体ごとに字幅がけっこう違うので、何も考えずに置き換えると、文字が枠からはみ出したり顔にかぶったりします。なので今回は、置き換えの手順と、代わりの太いゴシックを同じ文字で測って選ぶやり方をまとめました。書体ごとの数値をずらっと並べるより、自分の手元の候補を同じ物差しで測れる方が役に立つと思ったので、基準の数字は僕が実際に測った1書体分だけ載せています。
症状:PSDを開くと警告が出て、打ち直すと書体が変わる
PSDを開いた瞬間に「フォントが見つかりません」系のダイアログが出ます。閉じると見た目は普通に表示されているのに、レイヤーパネルを見るとテキストレイヤーに黄色い警告マークが付いている。これが症状です。
厄介なのはこのあとで、文字をダブルクリックして1文字でも打ち直すと、手元にある別の書体に切り替わって、幅も太さも変わります。サムネの文字はぎりぎりまで大きく組んでいることが多いので、これで人物の顔にかぶったり、セーフエリアの外にはみ出したりします。僕はこれで一回、納品直前にレイアウトを組み直す羽目になりました。
- 別のMacで作ったPSDを開いた時(片方のMacにだけ入れた書体がある)
- 人からもらったPSDを開いた時
- Adobe Fontsで有効にしていた書体を解除したあと
- OSを入れ直したり、フォントを整理したりしたあと
原因:PSDに入っているのはフォントの「名前」だけ
PSDの中には、フォントのデータそのものは入っていません。保存されているのは「この文字はこの名前のフォントで組む」という情報と、保存した時点で描かれた文字の絵です。Photoshopは開く時にその名前で手元のフォントを探して、見つからなければ警告を出します。見た目がそのまま表示されるのは、保存時の絵が残っているからです。打ち直すと描き直しが必要になり、無いフォントでは描けないので別の書体に置き換わる、という仕組みです。
ちなみに文字の設定を細かく見ると、フォント名・ウェイト・字送り・水平比率・カーニングなど53項目あります。置き換えで変わるのはフォントだけで、字送りや水平比率、縁取りや影のレイヤー効果はそのまま残ります。だから置き換えたあとに幅がずれる原因は、ほぼ書体ごとの字幅の差だけ。逆に言うと、幅さえ合わせ直せばレイアウトはかなり戻せます。
手順:置き換える前に測って、替えてから戻す
ポイントは、置き換える前に元の幅を控えておくことです。置き換えたあとでは元の幅が分からなくなるので、順番がマジで大事です。
- 開いた時のダイアログは一旦閉じる。Adobe Fontsにある書体なら同期されて警告が消えることがあるので、少し待ってからレイヤーパネルを見る。
- 警告マークの付いたテキストレイヤーのサムネールを、⌘(WindowsはCtrl)を押しながらクリックして選択範囲にする。「ウィンドウ」→「情報」を開き、選択範囲のWとHを控える。この時点ではまだ文字を打ち直さない。
- 「書式」→「見つからないフォントを解決…」を開き、見つからないフォントごとに代わりの書体を選んで「OK」を押す。版によってはメニュー名が「すべての見つからないフォントを置換」になっている。
- もう一度、手順2と同じやり方でWとHを測る。幅がずれていたら「文字」パネルの水平比率に「元の幅 ÷ 新しい幅 × 100」の値を入れるか、フォントサイズで合わせる。
- 縁取りや影を付けている文字は、効果込みの大きさでも確かめる(次の章)。

確かめ方:文字だけの幅と、縁込みの幅を両方見る
置き換えがうまくいったかは、目で見るより数字で見る方が早いです。僕が基準にしている極太ゴシックで「衝撃の真実」を100pxで組むと、文字だけの大きさは幅493px・高さ94pxでした。代わりの候補も、同じ文字・同じサイズで組んで、この数字と比べます。高さはどの書体でもそこまで変わらないことが多いので、まず見るのは幅です。
もうひとつ忘れがちなのが縁取りです。同じ文字に縁30pxを付けたら、幅が64px広がりました。左右に32pxずつはみ出している計算です。文字だけの幅が合っていても、縁込みで枠からはみ出していたら意味がないので、縁や影がある文字は効果込みでも測ります。やり方は、テキストレイヤーを複製して「レイヤー」→「スマートオブジェクト」→「スマートオブジェクトに変換」し、そのサムネールを⌘クリックして情報パネルを見るだけ。縁の太さそのものの考え方は縁取りと影の数値をまとめた記事に書いています。

予防・応用:太いゴシックの選び方と、次から起こさない工夫
代わりの書体を選ぶ時に僕が一番気にしているのは、太さは比率では戻せないということです。幅は水平比率やサイズでいくらでも合わせられますが、線の太さは書体で決まります。なので候補は、まず各書体の一番太いウェイト(Heavy・W9・Uなど、その書体の最大のもの)から選ぶ。そのうえで幅を測って、元に近い物を残すのがめっちゃ早いです。Macならヒラギノ角ゴシックの太いウェイトが最初から入っているので、とりあえずの代わりにしやすいです。
| 測るもの | 見る場所 | 僕の実測(基準) |
|---|---|---|
| 文字だけの幅 | ⌘クリック→情報パネルのW | 493px(100px・6文字) |
| 文字だけの高さ | ⌘クリック→情報パネルのH | 94px |
| 縁込みで増える幅 | スマートオブジェクトにして測る | +64px(縁30px) |
| 片側のはみ出し | 増えた幅 ÷ 2 | 32px |
| 置き換え後のズレ | 直す所 |
|---|---|
| 幅が広くなった | 水平比率を下げる、またはサイズを下げる |
| 幅が狭くなった | 水平比率を上げる、または字送りで広げる |
| 線が細く見える | 比率では戻らない。もっと太いウェイトの書体に替える |
| 縁込みで枠をはみ出す | 文字サイズを下げるか、縁の太さを見直す |
字送りで幅を合わせる時は、詰め方によって文字の印象もけっこう変わります。メトリクスとオプティカルの違いは文字の詰め方を同じ文字で比べた記事にまとめてあります。
予防として僕がやっているのは3つです。ひとつは、2台のMacで行き来するPSDには、なるべくAdobe Fontsの書体を使うこと。同じアカウントなら別のMacでも同期されるので、警告が出にくくなります。ふたつめは、レイヤー名にフォント名を書いておくこと。置き換えたあとでも元が何だったか分かります。みっつめは、テキストレイヤーを複製してラスタライズした物を非表示で残しておくこと。元の見た目を後から重ねて比べられるので、幅合わせがガチで楽になります。
つまずきやすいところ
警告を無視して保存しても大丈夫?
文字を打ち直さなければ、見た目は保存時のまま残ります。書き出しも、その絵のままで出せます。ただ次に誰かが文字を触った瞬間に別の書体へ置き換わるので、直す予定があるPSDなら先に手順どおり置き換えておく方が安全です。
同じフォントを入れたのに警告が消えない
PSDが探しているのはフォントの内部の名前なので、見た目の名前が同じでも、版が違ったり別のメーカーの同名書体だったりすると一致しないことがあります。まず文字パネルに出ている元のフォント名と、入れた書体の名前やウェイトを見比べてください。フォントを入れたあとはPhotoshopを再起動してから開き直すのも忘れずに。
疑似ボールドで太さを足すのはあり?
文字パネルの疑似ボールドで太く見せることはできます。ただ僕は最後の手段にしています。縁取りを重ねる前提のサムネ文字だと、一番太いウェイトがある書体を選び直した方が形が崩れにくいと感じるからです。
PSDをもらう側の人→置き換える前に幅を測るのを癖にしてください。PSDを渡す側の人→Adobe Fontsで組んで、レイヤー名にフォント名を書いておくのが最強です!
縁取りと影の数値、サムネ文字の詰め方比較も合わせてどうぞ。
この記事で使っているソフトは Photoshop です。まだ持っていない人は、Adobe公式のPhotoshopのページから無料体験で始められます。
この記事の設定をそのまま使えるレイヤースタイル(定番500種・第1集)は、BOOTHで配布しています。ショップ名は「くりねくんの研究成果」(ショップ全体)です。

コメント