㈱システムデザインセンター (システム構築・Web・文書課)

FileMakerシステム構築
FileMakerビジネスアライアンス加盟
なぜFileMaker?
ExcelからFileMakerへ

<< PREV | PAGE-SELECT | NEXT >>

>> EDIT

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

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


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


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

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

-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-

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

blg_20140404_00.jpg

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


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

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

blg_20140404_02.jpg

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


blg_20140404_01.jpg

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


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

blg_20140404_03.png

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



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

関連記事
スポンサーサイト

| Webノウハウ | 22:56 | comments:0 | trackbacks:0 | TOP↑

COMMENT















非公開コメント:

TRACKBACK URL

http://bunsyoka.blog.fc2.com/tb.php/50-34f86c38

TRACKBACK

<< PREV | PAGE-SELECT | NEXT >>