先に結論

透明背景や鋭い図形・文字が必要ならPNGを優先し、不透明な写真中心の作品ではJPGも比較します。どちらも固定ピクセルの配布用画像なので、編集可能なAI原本は残してください。

ツールを使う

aiファイルコンバーター

ツールを開く

AI原本と配布画像の役割を分ける

Adobe IllustratorのAIファイルは、パス、図形、文字、配置画像、効果を編集するための作業文書です。PNGまたはJPGへ書き出すと、見た目が指定した幅と高さの画素に描画されます。その時点で出力はラスター画像となり、元のベクターのように任意の大きさへ再計算されません。想定より大きく表示すれば、細い線や小さな文字は柔らかく見える可能性があります。

AI原本、必要なフォント、リンク画像は管理された場所に保存します。書き出す前に、アートボード範囲、クリッピングマスク、隠れたオブジェクト、影、外側にはみ出す要素を確認してください。オンライン変換ツールがIllustrator固有の効果を完全に再現するとは限りません。複雑な透明効果やリンク素材がある場合は、作成アプリから出した基準画像と変換結果を比べます。

配布先が画像を求めているからといって、AIを上書きしたり削除したりしないでください。PNGとJPGは閲覧や掲載に便利な派生物であり、後から色、文字、寸法を直すための編集情報を保持しません。承認済みの出力と試験版を別フォルダーへ分け、どのアートボードと設定から作ったか分かる名前を付けると、誤配布を防げます。

  • AI原本とリンク素材を保管する
  • アートボードと切り抜き範囲を確認する
  • 複雑な効果を基準画像と比較する

PNGとJPGは配布用のラスター画像であり、AI文書の編集機能を保存する形式ではありません。

透明度と鋭い境界にはPNGを選ぶ

PNGはラスター値を無損失方式で圧縮し、アルファチャンネルによる透明度も扱えます。異なる背景に重ねるロゴ、アイコン、操作画面の部品、図解、単色の境界、小さな文字には有力な出発点です。透明や半透明の画素を残せるため、背景色を固定した長方形として書き出す必要がありません。淡い影や滑らかな縁は、明るい背景と暗い背景の両方で確認します。

ただし無損失は小容量を保証しません。多数の色、写真、粒状の質感、複雑なグラデーション、大きなぼかしを含む作品ではPNGが重くなることがあります。最終表示に必要なピクセル寸法だけを書き出し、余分な空白も除きます。標準画面用と高密度画面用を作るなら、それぞれの倍率と用途を明示し、ブラウザーやアプリが実際にどちらを取得するかまで確認してください。

PNGにしてもベクターへ戻るわけではありません。小さすぎるPNGを拡大すれば輪郭はぼやけますし、巨大なPNGを一律に配信すれば通信量が増えます。透明度が本当に必要か、文字や線の鮮明さがJPGで崩れるか、予定サイズで判断します。用途が固定背景の写真なら、PNGだけに決めずJPG候補との容量差も測ります。

  • アルファ透明度の必要性を確認する
  • 表示寸法に合う画素数で出力する
  • 複雑な色では実容量を測る

PNGの無損失圧縮は画素を守りますが、常に最小の配信ファイルになるとは限りません。

不透明な写真中心ならJPGを試す

JPGは連続した色調を持つ写真、自然な質感、柔らかな背景を効率よく圧縮しやすい非可逆形式です。AIレイアウトの大半が写真で、透明背景が不要なら比較候補になります。一方、細い線、小さな文字、高コントラストのロゴや商品輪郭では、にじみ、リンギング、ブロック状の変化が見えることがあります。縮小サムネイルだけで合格とせず、問題が出やすい部分を実寸で見ます。

通常のJPGはウェブ画像で使うアルファ透明度を保持しません。書き出す前に最終背景色を決め、透明だった部分をその色へ合成してください。白に固定したJPGを暗いページへ置くと、意図しない白い四角が現れます。影や縁に元の背景色が混ざっていないか、実際の背景上で確認します。透明度が必須ならJPGの容量が小さくても要件を満たしません。

品質値は共通の絶対点数ではなく、エンコーダーごとの制御値です。間隔を空けた複数候補を同じ寸法で作り、文字、輪郭、滑らかな色、写真の細部を同じビューアーと倍率で比較します。掲載サービスが再縮小や再圧縮を行う場合は、候補を一枚アップロードし、実際に配信された派生画像をダウンロードまたは検査して承認します。

  • 不透明な最終背景を決める
  • 複数の品質設定を比較する
  • 配信先で再処理された画像も確認する

透明度が必要なら、JPGを検討する前に背景をどのように処理するか決めてください。

寸法と色条件をそろえて比較する

画素寸法は拡張子以上に鮮明さと容量へ影響します。最終表示幅、縦横比、標準画面と高密度画面の倍率を先に決めてください。幅800ピクセルで表示するカードに、用途のない巨大画像を渡す必要はありません。第三者サービスへ縮小を丸投げすると、補間方法や圧縮を管理できなくなります。小さな文字が最終サイズで読めるかも出力前に確認します。

PNGとJPGを比較するときは、同じアートボード、切り抜き、幅、高さから作ります。片方だけ小さい、余白が少ない、別の背景色である状態では、容量差を形式の効果と判断できません。ファイルのバイト数とともに画素寸法、背景、品質設定、使用した変換器の版を記録します。見た目が同等なら配信条件に適した小さい候補を選べます。

印刷向けに作ったAI文書を画面用へ出す場合は、RGB表示で重要な色が期待どおりか確認します。変換器によってプロファイル、ブレンド、影、オーバープリント風の効果の処理が異なることがあります。代表的な端末でブランド色、肌色、中間の灰色を見て、色の違いが許容できるか判断してください。印刷納品では、そもそもPNGやJPGが指定形式かも確認します。

  • 実際の表示幅と密度を定める
  • 縦横比と切り抜きを固定する
  • 同一画素寸法で候補を比べる

キャンバスや切り抜きの違いで減った容量を、形式そのものの利点と誤認しないでください。

実際の掲載先で最終候補を承認する

選択が明確でない場合は、同じアートボードからPNGとJPGを両方作ります。透明度、文字と輪郭、写真部分の自然さ、容量の順に確認し、拡張子だけでなく報告される形式やMIMEタイプも見ます。余白、切れた影、予期しない背景がないか開き直してください。PNGが重すぎるなら不要な寸法を減らし、JPGが崩れるなら品質を上げるかPNGへ戻します。

最終確認はファイル一覧のプレビューで終えません。実ページまたはアプリに配置し、明暗の背景、モバイルの小さな表示、高密度画面で検査します。サービスがサムネイルや応答型サイズを作るなら、小さい派生物と大きい派生物を一つずつ見ます。承認した寸法、背景、形式、品質設定を記録し、AI原本から再現できる状態を保ってください。

複数アートボードを一括出力する場合は、各ファイルの名前、寸法、内容を一覧と照合します。空のアートボード、非表示の案、不要な裁ち落としが混ざっていないか確認し、先頭、中間、末尾のファイルを実際に開きます。試験版と承認版を分離し、納品フォルダーには合格した画像だけを置きます。完了条件は変換の成功表示ではなく、目的地で必要な透明度、鮮明さ、容量を同時に満たすことです。

  • 同じ条件で二形式を出力する
  • 目的地の背景と端末で確認する
  • 承認した書き出し設定を記録する

正しい形式は、透明度、鮮明さ、容量、掲載先の要件をまとめて満たす候補です。

要点まとめ

  • AIは編集可能なベクター中心の作業ファイルですが、PNGとJPGは指定寸法のラスター画像です。
  • 透明度、ロゴ、細い線、小さな文字には、無損失圧縮とアルファ透明度を扱えるPNGが向きます。
  • 不透明な写真主体の作品ではJPGが小さくなる場合がありますが、輪郭や文字に圧縮劣化が出ることがあります。
  • 同じアートボードとピクセル寸法で候補を作り、実際のページやアプリで画質と容量を確認します。

よくある質問

AIファイルをPNGへ変換するとベクターのままですか?

いいえ。PNGは固定画素のラスター画像です。編集と再出力のためにAI原本を別に保管してください。

ロゴにはPNGとJPGのどちらが適していますか?

透明背景や鋭い境界が必要ならPNGが一般的な候補です。ただし実際の表示寸法と背景で確認します。

JPGで透明背景を保存できますか?

通常のJPGはアルファ透明度を保持しません。透明部分は書き出し時に指定した背景色へ合成されます。

PNGは常にJPGより高品質ですか?

PNGは非可逆圧縮を加えませんが、写真中心の用途では適切なJPGが十分自然で大幅に小さい場合があります。

書き出し前に何を決めるべきですか?

掲載先、透明度、背景、最終ピクセル寸法、許容容量を決め、同じ条件で候補を比較してください。

出典・参考資料

  1. adobe.com
  2. developer.mozilla.org
  3. w3.org