画像形式変換
PNG・JPEG・WebP を相互に変換します。透過が失われる場合の下地の色も指定できます。
すべてブラウザ内で動作します。入力した内容はアップロードされません。
仕組みと使い方
それぞれの形式は何のためにあるか
ここにある3つの形式は競合というより、用途の異なる道具です。中身ではなく習慣で選んでしまうのが最もよくある誤りです。
| 形式 | 圧縮 | 透過 | 向いているもの |
|---|---|---|---|
| PNG | 可逆 | あり | スクリーンショット、ロゴ、図、輪郭のはっきりしたもの |
| JPEG | 非可逆 | なし | 写真、互換性を最優先したい場合 |
| WebP | 両対応 | あり | 現代のウェブのほぼすべて |
ほとんどの場合に効く判断基準があります。平坦な色の面と硬い輪郭が主体なら可逆形式、連続的なグラデーションのある写真なら非可逆形式です。JPEG で保存したスクリーンショットは文字のまわりがにじみ、PNG で保存した写真は見た目の利点なしにサイズが5倍になることがあります。
透過をどうするかという問題
JPEG への変換だけは、圧縮とは別の意味で情報が失われる方向です。JPEG にはアルファチャンネルがないため、問題は透明な画素が変わるかどうかではなく、何色に変わるかです。
多くの変換ツールはこれを黙って決めており、canvas の既定値は黒です。透過背景のロゴが黒い長方形に乗って出てくるのは、たいていこれが原因です。このツールでは選べるようにし、既定を白にしています。多くの文書やウェブページの下地が白だからです。色のついた背景に置く予定なら、その色をここで指定してください。縁が白く浮かずになじみます。
避けたほうがよい変換
- 画質が良くなることを期待した JPEG → PNG。すでに劣化した画像を可逆形式で保存すると、劣化を完璧に保存したままファイルサイズだけが膨らみます。何も復元されません。
- 非可逆形式どうしの往復。JPEG や WebP で保存するたびに情報が失われます。何度か往復させると、元に戻せない劣化が目に見えるようになります。必ず手元にある最高品質の原本から始めてください。
- 写真を PNG にすること。スクリーンショット機能で写真を撮ったときに起きがちです。結果はきわめて巨大で、見た目は変わりません。
このツールでの変換の流れ
画像をブラウザがデコードし、canvas に描画し、指定された形式で再エンコードする——ブラウザが何年も前からネイティブに備えている3工程です。何も送信されないため、アップロードの待ち時間も、順番待ちも、他人の通信費に由来するサイズ上限もなく、聞いたこともないサーバー上にあなたの画像の複製が残ることもありません。
知っておく価値のある副作用がひとつあります。canvas に描き直す処理は画素だけを引き継ぎます。撮影メタデータ、撮影日時、カラープロファイル、GPS 座標は引き継がれません。画像を公開する前にはむしろ望ましいことが多いのですが、それらが必要な場合は原本を保管しておいてください。
よくある質問
- 透過部分が白くなったのはなぜですか？
- JPEG には透過を保存する仕組みがないためです。JPEG のすべての画素は不透明なので、透明だった部分は何らかの色にならざるをえません。このツールではその色を選べるようにしており、既定は白です。この処理がないと黒く出ます。透過を保ちたい場合は PNG か WebP に変換してください。
- iPhone の HEIC ファイルも変換できますか？
- ブラウザが HEIC をデコードできる場合に限られます。Apple 製デバイスの Safari は対応していますが、多くのブラウザは対応していません。読み込める環境であれば通常どおり変換できます。読み込めない環境では、ファイルの読み込み自体が失敗します。ブラウザが対応していない形式を、大きなデコーダを読み込まずにページ側で扱う方法はありません。
- 変換すると画質は落ちますか？
- 方向によります。PNG から WebP や JPEG への変換は非可逆なので、情報の一部が失われます。JPEG から PNG は可逆ですが、すでに失われたものが戻るわけではありません。劣化した画像を、より大きなファイルで正確に複製するだけです。WebP から JPEG は、非可逆だったデータをさらに非可逆で再エンコードするため、劣化がわずかに重なります。
- どの形式を書き出せるかはどう判定していますか？
- ページの読み込み時に実際に試して、動作する形式だけを選択肢に出しています。ブラウザは書き出せない形式を指定されると黙って PNG を返すため、そのままでは拡張子と中身が食い違うファイルができてしまいます。選ぶ前に判定しているのはそのためです。
- ファイルサイズの上限はありますか？
- 端末のメモリに収まる範囲だけが制約です。アップロードしないため、サーバー側の上限も順番待ちもありません。5,000万画素を大きく超えるような画像では、処理が遅くなったり、空きメモリの少ないスマートフォンでは失敗したりすることがあります。