AVIF PNG 変換ツール

AVIFからPNGへ: 透過を守るため、そして編集する画像のために

AVIFは透過に対応していますが、多くの変換ツールはその情報を捨ててしまいます。角が抜けたロゴを雑なツールに通すと、背景に白い四角、あるいは黒い四角が付いて戻ってきます。ここでJPGではなくPNGを選ぶ一番の理由がこれです。PNGには本物のアルファチャンネルがあるので、切り抜いた素材はスライドやモックアップ、商品ページにそのまま置ける状態で手元に届きます。

二つ目の理由は編集です。PNGの圧縮は可逆なので、受け取ったピクセルをそのまま保存し、それ以上は何も捨てません。代わりにJPGへ変換すると、保存するたびに既存のノイズの上へさらにノイズが重なります。デザインソフトに読み込む画像や、これから何度もトリミングして書き出し直す画像なら、PNGはその往復のたびに画質を削りません。

透過のテスト、1ピクセルずつ

完全に透明な帯、ちょうど半分だけ透明な帯、完全に不透明な帯という3本の縦帯を持つAVIFを用意しました。これを自社サーバー上ですべての設定で変換し、出力を1ピクセルずつ調べました。

半透明は64色でも保たれました。ここが多くの変換ツールの失敗するところで、パレットには半透明を収める明確な場所がないため、やわらかい影が硬い輪郭に変わってしまうのが通例です。このツールではどの設定でも、背景色と合成される処理は一切行いません。同じファイルをAVIFからJPGへ通すと、透明な帯は単色で塗りつぶされました。JPEGには透過を保存する仕組みがそもそも無いからです。

削減率をお約束しない理由

Palette compression は初期状態でオンになっています。写真をフルカラーのPNGにするとファイルが巨大になり、通常のzlibではほとんど小さくならないからです。どれだけ減るかは画像しだいで完全に変わります。同じ1200かける900、ディスク上21 KBのAVIFを、各設定で変換した結果がこちらです。

この画像ではパレット化してもほとんど小さくならず、256色ではむしろ大きくなったため、ツールはパレット版を捨ててフルカラー版を残しました。一方、平面的なロゴやスクリーンショットなら、同じ設定でファイルが半分以下になることもあります。だからこのページのどこにも、たった一つの削減率を書いていません。守れる約束だけをします。小さいほうのバージョンが必ず届き、どちらが選ばれたかは結果に表示されます。

PNGはAVIFの数倍の容量になると考えてください

AVIFは目で気づかない細部を捨てることが許された、新しい非可逆コーデックです。PNGは渡されたピクセルをすべて記録しなければなりません。AVIFなら数百キロバイトに収まる写真も、フルカラーのPNGでは数メガバイトになります。これは変換の不具合ではなく、可逆であることの代価です。それでも用途に対してPNGが重すぎる場合、その画像はおそらく写真であり、AVIFをJPGに変換するほうが適しています。

スクリーンショットや文字は鮮明なまま

硬い輪郭、UIの文字、べた塗りの面は、JPEGが最も苦手とするものです。JPEGは小さな正方形のブロック単位で処理するため、文字の周囲に目に見えるにじみが残ります。PNGはその輪郭をそのまま保存するので、スクリーンショットはAVIFと同じ鮮明さの文字で変換されます。また平面的な画像は Palette compression が最も効く対象でもあります。スクリーンショットやロゴは実際に使われている色数が少ないからです。グラデーションを含むスクリーンショットで、容量削減より確実さを優先したい場合は、Palette compression をオフにして全色を残してください。

パレットは自分で決められます

圧縮設定の下に Colours という色数の入力欄があります。触らなければ各設定がそれぞれの既定値を使います。2から256までの好きな値を入れれば、その色数のパレットになります。既存の素材に色を合わせたいときや、アイコンを限界まで軽くしたいときに便利です。Palette compression を完全にオフにすると、1ピクセルも違わないフルカラーのPNGが得られます。

向き、色、サイズ

スマートフォン写真の回転情報は、書き出す前に画像そのものへ適用したうえで出力から削除されます。そのため画像は正しい向きで届き、ビューアーが二重に回転させることはありません。広色域の Display P3 プロファイルは捨てられずPNGに埋め込まれます。これは色が正確に出るか、空が蛍光色になって戻ってくるかの分かれ目です。保存先がプロファイルを無視する場合は、Colour profile 設定でsRGBへ正しく変換できます。ピクセル寸法は変わりません。変換するのは形式であって、サイズではありません。

拡張子を変えたファイルとアニメーション

形式はファイル自身のバイト列から判定するので、誰かが .jpg という名前で保存したAVIFでも正しく変換されます。アニメーションAVIFは最初のフレームを1枚の静止画として書き出し、そうなったことを結果に表示します。アニメーションPNGは作成しません。1つのファイルを変換したい人が求めているのは、ほとんど同じ画像を数百枚に展開することではないからです。

得られるもの

• 透過背景をまるごと保持。半透明もやわらかい影もそのまま
• 可逆圧縮なので、後からトリミングして書き出し直しても画質を失わない
• パレット版とフルカラー版のうち小さいほうを、ファイルごとに判定して出力
• 必要なときは2から256色まで、パレットの色数を自分で指定可能
• 写真は正しい向きで、広色域はそのまま保持、または希望すればsRGBへ変換
• 元のピクセル寸法をそのまま維持。毎回変わりません

次のステップ

透過のない普通の写真ですか。AVIFをJPGに変換すれば、同じ画像をはるかに軽いファイルにできます。

PNGが思ったより重いですか。PNGを圧縮すれば、寸法を変えずにさらに小さくできます。

この画像をウェブサイトに戻しますか。PNGをWebPに変換すれば、透過を保ったままブラウザ向けに軽量化できます。