フォトショップで背景透明にすると画像が荒れてしまう

質問

似たような質問が多いなか恐縮ですが、教えてください。

イラストレーターで作ったライン（線のみ）を、フォトショップを使って背景を透明にしました。
ＧＩＦ形式で保存したのですが、そのＧＩＦファイルを開くとラインが荒くギザギザになっていました。
どうしてでしょうか？
なめらかなラインのままＧＩＦで保存する、なにかいい方法がありましたら教えてください。

イラストレーターは９、フォトショップはElementsです。
ほとんど初心者です。
どうかよろしくお願いします。

回答No.1

dezimac · ベストアンサー

Phtoshopで保存するときにマットで背景色と近い色を指定して下さい。
http://web.kyoto-inet.or.jp/people/hikeda/justnet/smu/smu06A/smu06A.html

一応説明すると、
アンチエイリアス（ギザギザを軽減する）処理の影響です。
画像を1000%とかに拡大して、フチを見ると判りますが、
半透明な（アンチエイリアスが掛かった）部分があります。
でGIFは1色のみしか透過できません。
この半透明な部分は表現できないので別な近い色に置き換える必要があります。
結果、そこが汚く見えてしまいます。

補足

ありがとうございます。
アンチエイリアスのことはなんとなく知っていましたがGIFは一色しか透過できないのは初めて知りました。

＞Phtoshopで保存するときにマットで背景色と近い色を指定して下さい。
とのことですが、ラインは黒、背景は透明にしたいのですが・・・
具体的にアドバイスいただけませんか？
わがまま言ってすみません。

回答No.2

dezimac

> ラインは黒、背景は透明にしたいのですが・・・
GIFで保存して、Webページでの使用ですよね。
他での利用でも似たようなものですが。

Webページの背景色（に近い色）をマット色に指定します。
画像のみを開いた時にはフチのアンチエイリアス部分がマット色でギザギザした感じになりますが、Webページに配置したときには背景に溶け込んで判らなくなります。
背景がカラフルなイラストや写真とかだと厳しいですけどね。

フチの色が一色なら、逆にフチの色をマット色に指定するのもありです。
この場合アンチエイリアスがないギザギザした縁取りの画像になります。

先ほど紹介したページの「マットカラー処理」の部分は御覧いただけましたか？
Photoshopのものですが、Elementsでも機能が少し制限されているだけでほぼ同じです。

あとはPNGで保存するかです。
PNG32だとアルファチャンネルをサポートしているので、半透明も表現できます。
ただし、Opera、Firefox、Safari、Mac版IE5等は対応していますが、Windows版IEは非対応です。

お礼

背景色というのはWebの背景色ということだったんですね！
謎が解けました。
（てっきり画像の背景かと思っていました・・・）

ご紹介いただいたページを見て試したらきれいに作ることができました！
ありがとうございました。
PNGというのは使ったことがないですが、半透明の表現ができるなんて興味深いですね。
今度試してみようと思います。

本当に助かりました。
貴重な時間を割いていただいて、ありがとうございました。感謝いたします。