PNGファイルとは

PNG はバイナリ形式です。これを知っているプログラムにしか意味を持ちません。 ピクセルの格子を保存するので、自分の解像度を超えて拡大するとぼやけます。 スクリーンショット、ロゴと線画、ウェブのために使われます。

拡張子は .png、正式名称は Portable Network Graphics です。ただしどちらも、そのファイルが中に何を持てるかほどには多くを語りません。このページの残りは、その中身についての話です。

PNG Development Group が 1996 年に公開しました。 仕様は ISO/IEC 15948 です。

これだけ長く読まれ続けてきた形式なら、10 年後に取り出したいものを預けても大丈夫です。

仕様書がそのまま公開されているので、中身を推し量るのではなく文書を読んで実装できます。この形式が数多くのプログラムに載っているのはそのためであり、20 年前に書かれたファイルが今も開けるのもそのためです。ただし「仕様が公開されている」ことと「使用料が要らない」ことは別の話です。中でコーデックを包んでいる形式では、特許のライセンスは仕様書が答えていない別の問題として残ります。

PNG ファイルは中身をそのまま保存します。保存し直しても何も変わらないので、開いて、直して、また保存する——それを何度繰り返しても劣化は積み上がりません。これが、渡すための形式ではなく作業のための形式である理由です。

PNG ファイルはアルファチャンネルを一緒に持てるので、ロゴの縁は後ろに何があってもなめらかなまま残ります。白い箱に閉じ込められた状態で届くことはありません。

1 チャンネルあたり最大 16 ビット。 RGB、グレースケール、インデックスカラーで扱えます。

1 チャンネルあたり 8 ビットを超えるぶんこそが、編集のあいだ階調が段に割れるのを防いでいます。作業用のファイルでは効きますが、完成したファイルではまず関係ありません。

PNG ファイルは壊れたファイルが黙って誤読されるのではなく、壊れていると分かるようにするチェックサムを備えています。

チェックサムは何も直しません。ファイルが壊れていると教えてくれるだけです。ただしそれは、今それを知るか、送った相手から知らされるかの違いです。

Adobe Photoshop、GIMP、Paint.NETが読めますし、同じ種類のプログラムならたいてい読めます。

ファイルが開かないとき、形式が悪いことはめったにありません。たいていはプログラムのほうが形式より古いのです。もっと古い形式に変換してしまうのが確実な逃げ道で、このサイトの残りの部分はそのためにあります。

これは今のブラウザーならどれでも読めます。

ですからページに置くのも、メッセージに添えて送るのも、安心してできます。相手が何をインストールしているかを考える必要がありません。

PNG ファイルはEXIF データ、XMP データ、ICC プロファイルを持てます。

このうち何が変換後まで残るかは、変換先の形式次第です。そして正直な答えはたいてい「一部だけ」です。

PNG は渡すために作られたもので、中で作業するためのものではありません。編集は可能ですが、快適だったためしはありません。賢い道は、元のファイルへ戻ってもう一度書き出すほうを通ります。

繰り返し挙がる不満はこれです。中身のわりにファイルが大きくなる。

どれも、この形式を避ける理由にはなりません。どれかに不意を突かれる前に知っておくべきことがら、というだけです。これは別の主張であり、そして役に立つほうの主張です。

ここが最も混乱するところです。1920 × 1080 の画像が、片方は 40 kB、もう片方は 4 MB になりえます。PNG の圧縮は画素の行に沿って繰り返しを探します。一色で塗られた面はほとんどゼロまで縮み、隣の画素と同じものがまず出てこない写真は、圧縮する材料をほとんど与えません。

そこから、形式を選ぶ前に使える判断が出てきます。図やダイアグラム、文字の入ったスクリーンショット、ロゴであれば、PNG は小さく、しかも欠点がありません。写真であれば PNG は巨大になり、画質 85 の JPEG と目で区別できないもののために完全な忠実さを買っていることになります。

PNG を百回開いて保存し直しても、最初のファイルとビット単位で同じものが残ります。支払うべき世代の劣化はなく、調整する画質のつまみもありません。選ぶものが存在しないからです。圧縮そのものが可逆に設計されています。

だから作業用ファイルには PNG が正解です。これから注釈を入れるスクリーンショット、これから切り抜くロゴ、公開までに三つのソフトを通る画像。JPG ならその一歩ごとに代償がありますが、PNG では何も失われません。

1994 年まで、ウェブで透明を扱える形式は GIF でした。GIF は LZW 圧縮を使います。その年、ユニシスが特許を行使し、GIF を書き出せるソフトの開発者からライセンス料を取ると発表しました。応答として、メーリングリスト上のわずか数週間で、同じ仕事をより良くこなす自由な形式が設計されました。

そこから、GIF にはない二つの性質が来ています。256 色ではなく数百万色、そして 1 ビットではなく段階のある透明度です。特許は 2004 年に失効してもう何の意味も持ちませんが、それを避けるために生まれた形式は残り、今もその用途では優れた選択肢であり続けています。

PNG のアルファチャンネルは、画素ごとに 256 段階の不透明度を保持します。曲線の縁はなめらかに透明へ溶けていき、ロゴは白い背景でも、暗い背景でも、写真の上でも清潔に見えます。どこに置かれるかを前もって知っている必要がありません。

これはまさに GIF にできないことです。GIF では画素は不透明か不可視かのどちらかで、曲線の縁は階段になります。ロゴを書き出すのに、どんな背景に置かれるか分からない。PNG を選ぶ技術的な理由はそこにあります。

通常の PNG は三つのチャンネルそれぞれに 8 ビット、つまり赤・緑・青を 256 段階で持ちます。画面に出す画像であれば十分すぎるほどで、おかしなところは何も見えません。

限界が見えるのは商業写真と印刷です。暗部を持ち上げたり色かぶりを直したりしても縞が出ないように、1 チャンネル 16 ビットで作業します。形式としては 16 ビットも定義されていますが、書き出せるソフトは少なく、活かせるブラウザはほぼありません。その深度で作業するなら、作業ファイルは TIFF で、PNG は見せるための複製です。

グラフィックソフトから出てきた PNG には、たいてい要らないものが入っています。メタデータのブロック、誰も使わないカラープロファイル、必要より大きなパレット、そして効果ではなく速度を基準に選ばれた圧縮設定。

oxipng や pngquant といった道具は、目に見える画素に一切触れずに二割から七割を削ります。pngquant の場合はパレットを制御しながら減らします。画面部品の画像を多く抱えるサイトでは、形式を変えずに得られる最大の節約がこれです。

写真なら JPG か WebP。ロゴやアイコンならベクター形式の SVG で、どんな大きさにも合い、容量は数分の一で済みます。動きのあるものなら動画です。アニメーション PNG は存在しますが読めるものがほとんどなく、GIF は同等の MP4 より重くなります。

PNG が正しいのは、描かれたもの、文字が入っているもの、やわらかい透明が要るもの、そして編集を何段階も経るもの。これは輪郭のはっきりした一覧で、その外側にはたいてい、もっと良い選択肢があります。