JPGはPNGの透明部分を保持できません。変換前に掲載先の背景色を決め、書き出した画像の輪郭と細部を実際の表示サイズで確認してください。
PNG → JPG
JPGにすると透明部分が消える理由
PNGは各ピクセルにアルファ値を持たせ、完全な透明から不透明までを表現できます。そのため、ロゴ、切り抜いた商品、柔らかい影を異なる背景の上に置けます。一方、一般的なJPGにはアルファチャンネルがありません。透明PNGをJPGへ変換すると、変換処理は透明または半透明のピクセルを何らかの通常色と合成しなければなりません。つまり、拡張子を変えるだけでなく、その書き出し画像で被写体の後ろに何を置くかを確定する作業です。
変換後に空白部分が白くなった場合、透明度が保存されたわけではありません。白、または変換ツールの既定色に統合されています。白いページでは問題なく見えても、薄いグレーのカードや濃いヘッダーに置くと四角い領域が現れることがあります。同じ素材を複数の背景で使うなら、透明PNGを残すか、透明度を扱える別形式を選ぶ方が確実です。
- 掲載先が透明度を受け付けるか確認する
- 書き出し前に実際の背景色を特定する
透明度が必須条件なら、変換を始める前にJPGが本当に必要か見直してください。
背景色は実際の掲載先から選ぶ
最初に、画像を表示するウェブページ、文書、通販サイト、アプリを確認します。背景を自分で管理できる場合は正確な色を調べ、その色でPNGを合成してからJPGへ書き出します。白く見える画面でも純白とは限りません。わずかに灰色や暖色の背景に、純白で平坦化した画像を置くと、画像の境界が箱のように見えることがあります。スタイル設定や画面の実色を確認して合わせるのが安全です。
一つの商品画像が、白い一覧、濃色の広告バナー、テーマが変わるメールなど複数の場所で使われることもあります。一枚のJPGは周囲の色に応じて変化できません。用途ごとに背景色を変えたJPGを用意するか、対応する場所では透明な元画像を使います。外部サービスが背景を自動で決める場合は、全画像を処理する前に一枚だけアップロードし、実際のプレビューで確認してください。
- 最も重要な掲載位置の背景色に合わせる
- 背景が異なる用途には別々の書き出しを用意する
JPGでは背景も画像内容の一部であり、後から自由に交換できる空白ではありません。
柔らかい縁、影、細い文字を点検する
曲線のアンチエイリアスや柔らかな影には、完全な透明と不透明の中間にあるピクセルが含まれます。平坦化すると、その縁は選んだ背景色と混ざります。そのJPGを別の色の上に置けば、白い縁、黒い輪郭、濁った影のように見える場合があります。白いロゴを暗い面に置く場合、髪や毛並みを切り抜いた画像、丸い商品輪郭、小さな文字では特に目立ちます。
元のPNGとJPGを、利用者が見る実寸で並べて比較してください。拡大表示はハローの位置を探すのに役立ちますが、圧縮の細部を必要以上に強調することもあります。曲線、文字内部の小さな空間、細い線、被写体と背景の境目を確認します。縁が不自然なら、圧縮率だけを変えるのではなく、透明な元画像に戻り、正しい背景色で合成し直してから書き出します。
- 曲線と半透明の境界を重点的に見る
- 実寸と適度な拡大の両方で比較する
ハローは合成時の背景色が原因であることが多く、品質設定だけでは解消しません。
JPGが適切な納品形式か判断する
アップロード先がJPEGのみを受け付ける場合、画像が主に写真で透明部分が不要な場合は、JPGが実用的です。反対に、さまざまな色の上に置くロゴ、UI素材、透かし、商品切り抜きにはPNGが向いています。形式名だけで優劣を決めず、掲載先の許可形式、透明度の必要性、細部の重要度、容量制限を基準に選びます。
PNGをJPGにしても解像度が増えたり、ぼやけたロゴが鮮明になったりはしません。JPEGは非可逆圧縮なので、強いコントラストの境界や小さな文字には、設定次第でにじみやブロック状の乱れが出ます。最小容量だけを狙わず、元画像と見比べて許容できる品質を選びます。透明なPNG原本は別に保存し、背景変更のたびに圧縮済みJPGを再編集しない運用にしてください。
- 掲載先の形式と容量の条件を先に読む
- 透明な原本を納品用JPGとは別に保管する
掲載先が透明PNGに対応しているなら、変換しないことが最も安定した選択になる場合があります。
書き出し後に配置まで確認する
重要な画像を一括変換する前に、代表的な一枚をPNGからJPGへの変換ツールで処理します。背景色を指定できるか、未指定時に何色が使われるかを確認してください。ブラウザー内のプレビューだけで判断せず、結果をダウンロードして別の画像ビューアーで開き、寸法、向き、背景色、輪郭、小さな文字を確認します。
次に、そのJPGを実際のページ、文書、アップロード手順へ配置します。通常の表示サイズで白い四角、縁取り、予期しない切り抜きがないかを見ます。必要ならダークモードや別の背景でも確認します。承認したファイルには透明原本と区別できる名前を付け、どの掲載先向けかを記録します。利用環境がまだ決まっていないなら、確認できるまでPNGを残してください。孤立したプレビューでは分からない問題を、最終配置の確認で発見できます。 また、複数人で運用する場合は、背景色の値、書き出し品質、確認した画面を簡単に共有しておくと、次回も同じ条件を再現できます。ファイル名だけで判断せず、元の透明PNGと用途別JPGの関係が分かるように管理してください。ブラウザーやアプリによって縮小表示の仕方が違うため、主要な閲覧環境で一度ずつ見ることも有効です。
- ダウンロードしたJPGを変換画面の外で開き直す
- 重要な掲載先すべてで実ファイルを試す
プレビューではなく、書き出したファイルが目的の場所で正しく見えてから承認します。
要点まとめ
- 最終画像に透明度が必要なら、PNGを維持するのが安全です。
- JPGが必要な場合は、変換前に実際の掲載先と同じ背景色を選びます。
- 半透明の縁は合成後に白や黒のハローとして見えることがあります。
- 書き出したJPGを開き直し、実際の表示サイズと重要な背景で確認します。
よくある質問
透明PNGをJPGに変換しても透明のままですか？
いいえ。一般的なJPGはアルファチャンネルを保持できないため、透明および半透明の部分は背景色と合成されます。
画像の周りに白い四角が出ないようにするには？
実際の掲載先と同じ背景色でPNGを平坦化するか、掲載先が対応するなら透明PNGを使います。一枚のJPGを異なる背景へ自動対応させることはできません。
ロゴの周囲に白い縁が出るのはなぜですか？
半透明の縁が明るい背景と合成された後、暗い背景へ置かれた可能性があります。透明な原本から正しい背景色で再合成してください。
JPGにすれば低解像度のロゴはきれいになりますか？
いいえ。変換で不足した細部は増えず、JPEG圧縮によって細い線や小さな文字がさらに乱れることがあります。
変換後に最低限何を確認すべきですか？
ダウンロードしたJPGを開き直し、背景、輪郭、文字、寸法を確認し、最終掲載先の実際の表示サイズで試してください。