おすすめLP作成ツール詳しくはこちら

イラレで書き出すと画質が悪い?高解像度で画像を書き出す方法

お悩み

イラレで書き出すと画像が荒い気がする・・

Adobe Illustrator(イラレ)で画像を書き出したときに「なんかぼやけてる…」「画質が悪くなる」と感じたことはありませんか?

この記事では、高解像な画像をきれいに書き出す方法を、初心者にもわかりやすく解説します。

Web用に書き出したい方はこちら

印刷用に書き出したい方はこちら

目次

イラレで書き出すと画質が悪くなる原因3選

なぜイラレで書き出すと画質が悪くなるのか?

  1. 解像度が72ppiのまま書き出している
  2. スケール(倍率)が低いまま書き出している
  3. アートボードが大きすぎて、実サイズより拡大されて表示されている

多くの方がデフォルト設定のまま書き出しており、「高解像度=データが重い」→「画質が悪くなる」と誤解してしまっています。

【結論】イラレでも高画質の画像は書き出せます!

実は、設定さえ正しければ、Illustratorからでも超くっきり&高精細な画像をWEB用に書き出せます。

イラレでWeb用に高解像画像を書き出す手順【PNG/JPEG対応】

バナーやサムネイル用にweb上で使うpng、jpg画像を高解像で書き出す手順を解説します。

ステップ①:ファイル → 書き出し形式 を選ぶ

上部メニュー「ファイル」→「書き出し」→「書き出し形式」

次に、保存場所と名前を入力し、「PNG」または「JPEG」を選択

ステップ②:書き出しオプションを最適化

jpgの場合

pngの場合

項目推奨設定補足
解像度300 ppiWebでも高精細表示される
アンチエイリアス「アートに最適」文字や図形のにじみを軽減
背景(pngの場合)透過 or 白使用用途に応じて調整

ワンポイント:「アートボードを小さくして300ppiで書き出す」と効果的

  • ピクセルサイズそのまま+ppiを上げると、物理サイズが小さくなって密度=画質が向上します。
  • ブログなどでは横幅600px〜1200px程度がちょうど良いので、アートボードもそれに合わせて設計するのがベスト。

補足テク:Photoshopでppiだけ変更する方法

実際にこの方法でやってます

アートボードを実寸で作っている場合、イラレで300ppiで書き出すとサイズが大きくなってしまうのが問題でした。

かといって72ppiだとサイズは実寸のままですが、やはり画質は粗くなってしまいます。

そのため300ppi高解像度で書き出したあと、Photoshopでサイズを戻すというやり方をしています。

実際、多くのプロも以下のように「Illustratorで高解像度出力 → Photoshopで物理サイズを調整」という流れを採用しています。

やり方

  1. Photoshopで画像を開く
  2. 「イメージ」→「画像解像度」
  3. ✅「再サンプル」のチェックを外す
  4. 解像度を72ppiに変更 → ピクセル数は維持され、見た目サイズだけ変わります
メリット説明
✅ 画質はそのままピクセル数(px)は変えないので、画像の細かさは損なわれない
✅ ファイル用途に合わせてppiだけ調整できるWebなら72ppi、印刷なら300ppiなど、後から調整が柔軟にできる
✅ アートボードやデザインをいじらなくていいIllustrator側の設計や構成を一切変えずに済む

印刷用に高解像度で画像を書き出すには?

「イラレで印刷用の画像を書き出したら、画質が悪くてぼやけた…」
そんな悩みを防ぐには、以下の3つのポイントを意識しましょう。

✅ ① 解像度は必ず「300ppi以上」に

印刷物は72ppiでは確実に荒れます
最低でも300ppi、こだわるなら350〜600ppiでの書き出しをおすすめします。

✅ ② ファイル形式は用途で使い分け

形式用途
PDFチラシ/名刺/ポスターなど印刷所入稿用に最適
TIFFフチなし印刷・CMYKカラー・非圧縮が必要な場合
JPEG写真印刷や軽量データ送付用(高画質設定必須)

✅ ③ 書き出し手順(PDFの場合)

  1. 「ファイル」→「別名で保存」→形式:Adobe PDF(.pdf)
  2. 「Adobe PDFプリセット」で「高品質印刷」を選択
  3. 【重要】「圧縮」タブで以下を確認:
    • 「画像のダウンサンプル」→オフ or「300ppi以上」
    • カラーモードは「CMYK」(印刷所指定があればそれに従う)

✅ その他の印刷用Tips

  • 効果メニュー → ドキュメントのラスタライズ設定」も300ppi以上に変更しておくと安心
  • トンボと裁ち落とし」を設定してから書き出すと、印刷ずれのリスクが減ります

印刷物でもイラレ書き出しで画質を落とさないコツ

チェック項目理由
アートボードのサイズはmm単位で確認実寸と印刷精度が一致しているか確認するため
解像度は300ppi以上に設定印刷に適した細密表現ができるため
CMYKカラーモードで作成するRGBだと色味がズレる可能性がある
フォントはアウトライン化する印刷所で文字化けを防ぐため

WEBと印刷、両対応したいときは?

「一つの画像でWebでも印刷でも使いたい」という場合は、

  • アートボードを小さめに設計(実寸)
  • 300ppiで書き出し
  • 必要に応じてPhotoshopでppiだけ下げてWeb用に変換

このように使い分けると、画質を落とさず両方に対応できます

【まとめ】印刷もWebも、画質で損しないイラレの書き出し術

「イラレ 書き出し 画質悪い」と感じたら、解像度・スケール・形式の見直しを!
正しい設定さえすれば、プロ仕様の高画質画像が誰でも書き出せます。

よくある質問(FAQ)

ブログで使う画像に300ppiは必要ですか?

画質を優先したいなら必要です。 ただし、72ppiに変更してもピクセルサイズが十分大きければ見た目は問題ありません。

スマホで見ると画像がにじむのはなぜ?

Retinaディスプレイは高密度表示なので、低解像度画像は荒く見えがちです。300ppiでの書き出しが推奨されます。

【まとめ】イラレで画質が悪くなるときの対策

「イラレで書き出すと画質悪い・・・」と感じたら、解像度・スケール・形式の見直しを!

正しい設定さえすれば、プロ仕様の高画質画像が誰でも書き出せます。

問題解決策
書き出した画像がぼやけてる解像度を300ppi、スケールを100%以上に設定
サイズを変えたくないPhotoshopでppiだけ調整(再サンプルOFF)
画質を保ちつつファイルサイズを抑えたい小さめアートボード+高解像度書き出し

この記事を書いた人

プレリスのアバター プレリス フリーランスWebデザイナー

フリーランスWebデザイナー
LP制作から集客までやってます。
プライベートは40代主婦で子供が2人。趣味は旅行・ゲーム。
質問はお気軽にコメント欄・LINEからどうぞ。

コメント

コメントする

目次