PNG（可逆圧縮 + 透明度）

📌

PNGとは

PNG（Portable Network Graphics、ピング）とは、画質を一切落とさずにファイルを小さくできる画像形式です。GIF（古い画像形式）の特許問題を回避するために生まれ、今ではWeb画像の定番になっています。

PNGの2大特徴は次のとおりです。
・可逆圧縮（Deflate）：圧縮しても展開すれば元画像に完全に戻る＝情報を1ビットも捨てない
・アルファチャンネル：ピクセルごとに「透け具合」を持てる＝背景を透かせる
・フルカラー対応：約1677万色（24ビット）＋透明度を扱える

身近な例で言うと、PNGは「真空パックで食材を保存する」イメージです。袋を圧縮して小さくしても、開ければ中身は元のまま。一方、写真向けのJPEGは「ジュースを濃縮する」ようなもので、小さくはなりますが元の味（画質）は完全には戻りません。

🗜️

可逆圧縮の仕組み

PNGはDeflate（デフレート）という可逆圧縮（＝展開すれば完全に元へ戻せる圧縮）アルゴリズムを使います。これはZIPと同じ仕組みで、内部では2つの技を組み合わせています。

・LZ77：直前に出てきた同じデータの並びを「○文字前から△文字分コピー」という参照に置き換える
・ハフマン符号：よく出る値ほど短いビット列を割り当てて、全体のビット数を減らす
画像には「同じ色がずっと続く」「似た模様が繰り返す」場所が多いので、この方式がよく効きます。

「可逆＝元に戻る」「非可逆＝元に戻らない」という対比が大切です。PNG・GIF・ZIPは可逆、JPEG・MPEG・MP3は非可逆に分類されます。可逆は文字やロゴのようにくっきりした絵に向き、非可逆は写真のように細かい差が気になりにくい絵に向きます。

🪟

アルファチャンネル

アルファチャンネルとは、ピクセルの色情報（RGB）に加えて持つ「透け具合（不透明度）」の情報のことです。PNGは1ピクセルを「R・G・B・A」の4つの値で表します（これをRGBAと呼びます）。

A（アルファ値）は0〜255で表され、
・A = 0：完全に透明（背景がそのまま見える）
・A = 255：完全に不透明（背景が見えない）
・中間の値：半透明（背景がうっすら透ける）
となります。GIFは「透明 or 不透明」の2択しか持てませんが、PNGは256段階の細かい半透明を表現できます。

身近な例で言うと、アルファチャンネルは「透明フィルムに印刷したシール」のようなものです。背景がどんな色でも、シール部分だけが乗り、余白は透けてなじみます。そのためロゴやアイコンは、背景色を選ばず重ねられるPNGで作るのが定番です。

💡

なぜイラスト・ロゴにPNGが向くのか

PNGがイラスト・ロゴ・文字画像に向く理由は「可逆圧縮で輪郭をそのまま守れるから」です。ロゴや文字は、白い背景と黒い文字が隣り合うようなくっきりした輪郭（エッジ）が命です。

なぜJPEGだと輪郭がにじむのか。JPEGの量子化（＝細かい情報を間引く工程）は、隣のピクセルとの色の「急激な変化」を高周波成分と見なして削ってしまいます。くっきりした輪郭はまさにこの急激な変化なので、輪郭周辺に汚れたようなノイズ（モスキートノイズ）が出てしまいます。
・PNG：情報を1ビットも捨てない → 輪郭をそのまま保存できる
・JPEG：細かい情報を間引く → 輪郭周辺がにじんで劣化する

身近な例で言うと、はんこを押した書類をスキャンした画像で考えてみましょう。PNG保存ならにじみなくくっきり読めますが、JPEG保存だとはんこの周囲が少しぼやけて公文書として使いにくくなります。「正確に伝えなければならない図・文字・記号」にはPNGを選ぶのが基本です。

🗂️

PNGとJPEGの使い分けまとめ

「PNG か JPEG か」を選ぶ基準はシンプルです。
・PNG を使う場面：ロゴ・アイコン・文字・線画・スクリーンショット・透明背景が必要なとき
・JPEG を使う場面：デジカメやスマホで撮った写真・グラデーションが多い画像

なぜ「画像の内容」で使い分けるのか。画像形式の選択は「どこで画質が落ちても気にならないか」で決まります。写真のわずかな色のずれは人間にほとんど分かりません（だからJPEGでよい）。でも文字の輪郭のにじみはすぐ分かります（だからPNGが必要）。データの性質と人間の感覚の両方を理解することが、適切な形式選びの出発点です。