文字を画像にする

最終更新: 2026.11.11

かつての私は、すべての文字をテキストにして、ロゴなどはベクターとして表示してなるべくジャギーなどの見えない綺麗な画面を実現しようとしていた。使えないフォントを指定してきて、画像として表示するような状況では悔しさを覚えた。
そして、現在では普通の画像も大きなサイズのものが使えるようになり、なんとなくジャギジャギで汚いWebサイトというのは減ってきている。

なぜそこまで、テキストにしたかったのか、そのほうが修正しやすいのもある。文書構造として正しいものをなるべく出したい。

しかし、そこの縛りもそこまで重要ではないのではないかと思う。Webフォントに対応していないフォントはたくさんある。それに、画像データとしての塊でしか表現できない質感もあるだろう。また、更新の仕組みも画像を簡単に差し替えられる仕組みを用意するなど実装面での考慮も入れることも現在のオリジナルで各々がCMSを作るような時代においては可能ではないだろうか。CMSで画像内のテキスト自体を更新するような仕組みも可能だろう。

全てをベクター、テキストデータとして画面を綺麗に覆わなくても良いのではないか。
もちろん、Altなどを適切に設定して情報として持つようにするのは前提である。画面から文字をコピーする際も、以前であれば文字データでなければ、コピーできずに歯がゆい思いをしていたが現在では画像からコピーすることも多い。また、実装上の工夫で文字としてコピーできるようにすることも可能だ。

文字を画像にすること。
文字を反対に、意味性から逃れた画像や装飾のように並べて扱うこと。
画像を文字として扱う。文字をwoffではなく、一つ一つの画像にしてしまう。hoverで違う画像に変えてみる。境界がブレる。その瞬間に何かが見えてくる。