PhotoShopで作成した文字がぼやけます。

質問

いつもお世話になってます。
PhotoShop5.0でのことです。

文字ツールで文字を書いているのですが、何度やっても文字がボヤけます。「web用に保存」をして減色する前の段階で（編集段階）で結構ボヤけてしまってるのです。

文字のサイズは12pxとか16pxとかです。アンチエリアスを「無し」にすると見られたものではないし、その辺の修正では変わりませんでした。フォントの種類も標準でついているものについてはイロイロ試しましたがどれも汚かったです。

ココ数年画像編集を仕事にしてきまして、今までは別に気になら無かったのですがWEB上で文字が綺麗に表示されているサイトがあり、気になるようになりました。

思考錯誤を繰り返しましたが変わりませんでした。結論としては「フォントが悪い」ということになりました。有料のフォントなら、綺麗に表示されるものでしょうか？もしこれがフォントのせいであり、他に綺麗に出るフォントがありましたら購入も考えてます。

分かる方、どうか教えてください。

回答No.7

cruise · ベストアンサー

こんにちは、
私は目的がWeb用保存だとすると、大きな文字を使用する場合や拡大縮小をしない限り
Illustratorを使っても綺麗に出力されるとは思わないのですが・・・

サイズ800*600px程度の白い背景に黒い12pxの文字で「綺麗な文字」といろいろな場所に打ってみてください。
（レイヤーの複製はだめです）
拡大して比較してみると、同じ文字を打ったにもかかわらず、アンチエイリアスのかかり具合が若干違うと思います。
これを利用して綺麗に出力された文字を使うというのはどうでしょう？
（Photoshop6以降は文字レイヤーを決定する前に移動することで同様の変化を得られます。
　また、基本設定として文字自体のアンチエイリアスの強さを「なし」「鮮明」「強く」「なめらかに」と変更可能です）

後は、アンシャープマスクを微調整するとか、

アンチエイリアスをかけた文字とかけていない文字をレイヤーでぴったり重ねる。
次に、アンチエイリアスのかかっている文字のレイヤーの不透明度を下げてやるなんてのはどうでしょう？

さらに少々面倒ですが効果のあるものとして、
新規画像で白の背景に黒で文字を書きレイヤーを統合
統合された背景レイヤーをダブルクリックでラスタレイヤーに変更。
レイヤーオプション（Ver6以降はレイヤースタイル）のブレンド条件で
「このレイヤー」と「下になっているレイヤー」という二つの白黒グラデーションがあると思います。
「このレイヤー」のグラデーションの白側にある三角をAltキーを押しながら黒い方に少しずつドラッグしていけば、
明るさの高い方からグラデーションを保ったまま透過していけます。（Altキーを押さないと三角が２つに分かれません）
つまりアンチエイリアスのかかり具合を細かく調整できます。
後は好きな色に変えてやればOKですね。

全然違った観点からいえば、
ディスプレイのリフレッシュレートが高いのが原因かもしれません。70～60Hzとかにしたら綺麗になったりして・・・
画像編集を仕事になさっているので知っておられたら申し訳ないのですが、
リフレッシュレートを上げすぎると、ちらつきを押さえる反面、画像や文字のぼけが現れます。

お礼

実用的で詳細なアドバイスをありがとうございます。以後、やってみます。文字は打つ場所によってもアンチエリアスが変わる可能性があるのですね。

「アンチエリアスのかかってるのとかかってないの二つのレイヤーを重ねる」というのは有名なテクニックのようですね。それすらもやっていなかったです（笑）

グラフィックが本業というわけではないのですがHP作成を主としてるので画像編集は良くやります。が、我流なので
ふがいない箇所がたんまりとあります。

cruiseさんの技術レベルの高さと、こうやって身しらずの人にも丁寧に長文で教えてくれる優しさに感動しました。本当、感謝（シェイシェイ）です。

答えてくれた皆様もありがとうございました。
以後も毎日勉強し、精進いたしまッス。

回答No.6

paotan

ごめんなさいベクトルデータではなくベクターデータの間違いです。

回答No.5

paotan

こんにちは！
有料のフォントを使っても変わらないと思いますよ。
解像度はどのぐらいで作っていますか解像度が低いと、どう作ってもぼやけてしまいます。解像度が高ければそんなにぼやけません。
それでもだめなら、photoshopはバージョン６.０以降からベクトルデータが扱えるようになりました。7.0にバージョンアップすれば解決するかも知れませんね。
体験版がダウンロード出来るので試してみて下さい。

参考URL：

http://www.adobe.co.jp/products/tryadobe/main.html#photoshop

補足

＞paotanさん
どうつくってもボヤけるものなんですね。了解しました。6とか7も使いたいのですが予算が足りなそうです（笑）。ありがとうございました。

＞みなさま

画像を見てもらいたくて画像をサーバーにアップしてURLを張りつけたのですがOKWEBの規約に違反するようで怒られてしまいました（笑）。これが気になるレベルかどうかみなさんに実際の画像を見て欲しかったんですけどねー。

みなさんからの情報をまとめると、やはり「ベクターがお勧め」ということですね、了解しました。まぁ、冷静に？見てみるとこちらのOKWEBの←のメニューの文字（Q&A WatchとかMy Pageとか）もにじんで見えます。こんな大きなサイトの画像がそうなら、このままでも良いかなという感じもします。しかしGIFでも結構ぼやけるんですねーー。

GIF=スッキリ画像というイメージがあるからかもしれませんが…うーん。あと2日ほどしたらこの質問を閉じますネ！何か追加情報があればお願いします。

回答No.4

k_kazari

ちょっと値がはりますが、
イラストレーターとの併用を試みたらいかがでしょうか？
私もまったく同じ悩みをもっていました
＞PhotoShopのフォントがぼやける（アウトラインがぼやける）
で、とりあえず
イラストレーターも所有しているので
文字を良く使う印刷物、
または文字画像などは
イラストレーターを利用して作成しています。
なぜか、わかりませんが、
イラストレーターは綺麗にフォントがでます。
一度、イラストレーターを所有している人に
聞いてみる、もしくは、ちらっと試させてもらうと
良いかと思います。
なんせ、ソフトの値段が値段なので（高い）

参考になれば幸いです。
でわ、がんばってください

補足

＞k_kazariさん
フォトショップ単体では無理ということでしょうか。ベクターデータでないと無理ってことですかね。でも新規作成した編集段階のPDFでもこの現象が見えるとなると、フォトショップって高い割には…ということに。

イラストレーターはインストールされているのですが、まともに起動したことがありません。ガリガリと音はなるのですがそれだけで終わってしまいます…。当方のマシンはwin98なもので。ダサダサです。でもアプリケーションの不具合では無いです、家のマシンでも同じぼやけが出ているので。

印刷物ではなくWebの画像として使うので、本当にレベルの低い話なのですが…。妥協できないくらいに汚いんですよね。

しかし、イラレを使えばそれも解消されるとのことですね。イラレで書いてみてからそれをフォトショップで加工すれば大丈夫でしょうか？？やってみますね。

回答No.3

AF2

アプリケーションの異常等でこうなるなら私の答えられる問題ではありませんが、
フォントを何でも良いので一文字ワープロで225ポイントぐらいに拡大表示してプリントするか、画面で可能な限り拡大表示して斜めの部分を見てみて下さい。そこがギザギザしているのならばフォントの問題と考えても良いかと思います。斜めの線が綺麗なら、後私に分かるのは♯1さんのJPEGによる圧縮ぐらいです。JPEGは8*8ピクセルで区切って非可逆圧縮（データを失い、画像が汚くなる）しているので、保存のごとにデータが失われ、従って編集段階からJPEGを利用して保存をくり返すと確実に解像度が8分の1に近付いて行きます。また、この現象はコントラストの高い所で特に起こりやすいので、白黒文字の画像なんかを編集している場合は、確実に画質が劣化してしまいます。もし、レイヤーを使用されているのならJPEGは使用せず、photoshop型式での保存だと思いますが、これなら非可逆圧縮ではないので、画質の劣化はありません。一回一辺当たりのピクセル数を10倍ぐらいに上げてから画像編集（photoshopなら画像解像度が高いと書ける文字の大きさが小さくなる）をして、それからバイキュービック法で解像度を下げたり、フォントの大きさを12.14.18.24.36等の数に設定してみて下さい。

補足

jpgの圧縮って、8pxごとなんですね。勉強になってしまいました（笑）、ありがとうございます。

印刷してみましたが、印刷した文字はギザなど皆無で綺麗なものでした。まぁこれはフォトショップではなくテキストエディタで書いたものを印刷したからかもしれませんが。

GIFとして保存してありますが、見比べてみても編集中のpdfとなんら変わりはなかったです。

ハッキリ言って、ほとんどの文字がぼやけて見えます。自分の液晶ディスプレイがいけないのでしょうか？

GIFになったからこうなら自分の減色方法が悪い、ということなのですが編集段階からこうなのでなんとも…。やはりイラストレーターしかないのでしょうか？？

回答No.2

AF2

アプリケーションの異常等でこうなるなら私の答えられる問題ではありませんが、
フォントを何でも良いので一文字ワープロで225ポイントぐらいに拡大表示してプリントするか、画面で可能な限り拡大表示して斜めの部分を見てみて下さい。そこがギザギザしているのならばフォントの問題と考えても良いかと思います。斜めの線が綺麗なら、後私に分かるのは♯1さんのJPEGによる圧縮ぐらいです。JPEGは8*8ピクセルで区切って非可逆圧縮（データを失い、画像が汚くなる）しているので、保存のごとにデータが失われ、従って編集段階からJPEGを利用して保存をくり返すと確実に解像度が8分の1に近付いて行きます。また、この現象はコントラストの高い所で特に起こりやすいので、白黒文字の画像なんかを編集している場合は、確実に画質が劣化してしまいます。もし、レイヤーを使用されているのならJPEGは使用せず、photoshop型式での保存だと思いますが、これなら非可逆圧縮ではないので、画質の劣化はありません。一回一辺当たりのピクセル数を10倍ぐらいに上げてから画像編集（photoshopなら画像解像度が高いと書ける文字の大きさが小さくなる）をして、それからバイキュービック法で解像度を下げたり、フォントの大きさを12.14.18.24.36等の数に設定してみて下さい。

回答No.1

nitscape

編集段階の保存形式はPhotoshopの形式でしょうか？編集段階でもJPEGを使っているとボケることがあるようです。

補足

＞nitscapeさん
JPGやGIFは、編集後に出力として出してます。
出力後のjpgが多少にみむのは知ってます。色が少ない時はGIFで出力してにじみを避けてます。

新規作成したにもかかわらず編集段階でもなってます。白地にMSゴシックなんかで書くとそれが顕著に表れます。あまりに小さいピクセルならくっつきそうなものですが、14pxくらいでもどうもぼやけます。うーん。nitscapeさんはなりませんか？