文字画像がぼやけるのを防ぐ

皆様、いつもお世話様です。


各地で桜が満開の季節ですね。
国立の大学通りは、桜吹雪が舞ってとても綺麗でした。
週末はお花見が出来そうです。晴れるといいですね。


さて、今回は「文字画像がぼやけるのを防ぐ」です。

WEB等に使う為、Photoshopやイラストレーターで文字バナーを作って、
JPGやGIFで保存すると、なぜかぼやっとしてしまう・・・という
現象についてです。
（※Photoshop　CS３を使用しています）

-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-･-

①バナーやボタン等の為に文字画像を出力すると、下記の画像のように、なぜかぼやけます。



原因はいくつかありますが、元のサイズを縮小すると確実にぼやけます。
画像は最初から原寸で作るのがポイントです。


②原寸で作っているのにぼやける理由

Photoshop等でデフォルトでONになっている機能「アンチエイリアス」が原因です。



このように、文字ツールの右下に、文字の状態を5種類選べるボックスが存在しています。
「なし」「滑らかに」「シャープ」「鮮明」「強く」の5種です。
どれを選ぶかにより、下記のように文字の滑らか具合（ぼやけ具合）が変化します。




アンチエイリアス「なし」を選択すると全くぼやけませんが、ギザギザの文字になってしまいます。
「滑らかに」「鮮明」はぼやけます。
一番きれいなのが「シャープ」です。


③JPGよりもPNGの方が少し綺麗



保存形式を選択する際、PNGを選ぶと、JPGより少し綺麗になります。
ただ、サイズも大きくなります。



WEBサイトに表示する場合、最も綺麗なのは画像ではなくテキストの文字です。
ですが、画像を使わなければならない場面も沢山あります。
サイズとの兼ね合いが難しいですが、PNGはけっこう便利です。