Adobe Illustratorでpngやjpg画像を書き出しをした時に画質が悪くなったり、なぜかジャギジャギ（ガビガビ？）した粗い画像になったりしたことはありませんか？
この記事ではIllustratorの書き出しで画像が粗くなってしまう問題の解決方法について解説します。
同じくIllustratorの書き出しで画像サイズが大きくなったり、1pxずれる問題の対処法はこちらの記事が参考になります。
Adobe CCのプランを比較するなら
Adobe CC コンプリートプランと単体プラン、どちらを選ぶべき？
Adobe Creative Cloud プランの比較
こちらもおすすめ 2024年最新 Adobe CC コンプリートプランを安く更新できる！一番安い購入方法
Illustratorで画像を書き出す方法は3つ
Illustrator（CC）で書き出しには3つの方法があります。それぞれの特徴をまとめます。
| 書き出し方法 | 用途 | 特徴 |
|---|---|---|
| スクリーン用に書き出し | Web用 | JPG,PNG,SVG,PDF 複数のWeb用素材を、複数の形式、複数のサイズで一括で書き出すことができる アートボードごとの書き出しも可能 |
| 書き出し形式 | 印刷用、 Photoshop用 | PNG,BMP,CSS,PSD,SVG,TIFF,TXTなど CMYKやグレスケールで書き出し、psdファイルの書き出し可能 書き出せる画像形式が多い アードボードごとの書き出しも可能 |
| Web用に保存（従来） | Web用 | JPG,PNG,GIF 昔からあるWeb画像の書き出し方法 スライスの書き出しができる |
PNG・JPGに書き出しすると画質が悪い、ジャギーができる問題の対処法
Illustratorのスクリーン用に書き出し・アセットの書き出し機能は一度に複数のサイズの画像や形式を書き出すことができる機能です。スライスを使って一つ一つ書き出す画像を設定していた頃に比べると、ドラッグ＆ドロップで書き出す画像を選択でき、抜群に作業効率が上がりました。便利ですよね。
でもアセットの書き出しで書き出した画像が（特にjpg）なぜか粗い。ジャギー？ノイズのような、大きい画像を縮小した時のような感じで画質が悪くなるのです。
書き出し画像の画質を改善する方法（アセットの書き出し）
原因はIllustratorの書き出しの設定にありました。以下、書き出し画像の画質を改善する方法です。
アセットの書き出しパネルの場合、右上のメニューから「形式の設定...」を選択します。
またはファイル＞書き出し＞スクリーン用に書き出しから、フォーマットの右端にあるギアアイコンをクリックします。
形式の設定を選択できるウィンドウが開きます。左側のファイル形式ごとにオプションを設定することできます。
JPG80のオプションを見てみると、アンチエイリアスは「文字に最適（ヒント）」になっています。
「アンチエイリアス」を「アートに最適（スーパーサンプリング）」に変更します。
これで再度画像を書き出してみると・・・ジャギーがなくなり、画像が粗いのが改善されました。
Web用に保存では「アートに最適」を選ぶ
古いバージョンだとアセットの書き出しではなく、「Web用に保存」しかない場合があります。その場合は画像サイズの下のプルダウンで「アートに最適」を選ぶことができます。
まとめ
以上、Illustratorで画像の書き出しをする際に画質が悪くなってしまう問題についてまとめました。
ことで解決できると思います。参考になれば幸いです。
同じようにIllustratorで書き出しすると、画像が1px大きくなる問題はこちらで詳しく解説しています。
