画像形式変換

WebPは同じ見た目をJPEGより小さいファイルで表現できるため、Webサイトに載せる画像では第一候補になります。JPEGは写真向けの非可逆形式で、対応していない環境がほぼ無いという強みがあります。PNGは可逆形式で、透過を扱えるのはこの3つの中でPNGとWebPだけです。ロゴ、アイコン、スクリーンショット、図表はPNGが向いています。

変換時の品質は、高画質（90）・バランス（70）・小サイズ（50）のプリセットから選ぶか、数値で直接指定できます。この品質はJPEGとWebPにのみ効き、可逆形式であるPNGへの変換では無視されます。

変換は、画像を一度キャンバスに描画し、目的の形式でエンコードし直すという流れで行われます。ブラウザが持っているエンコーダをそのまま使うため、追加のライブラリを読み込む必要がなく、処理は高速です。

この方式の帰結として、エンコードできるかどうかはブラウザの対応状況に依存します。対応していない形式を指定した場合は、黙って壊れたファイルを返すのではなく、エラーとして知らせます。

JPEGには透明度を記録する仕組みがありません。そのため、背景が透過されたPNGやWebPをJPEGへ変換すると、透明だった部分は黒く塗り潰された状態で出力されます。ロゴやアイコンをJPEGにして「背景が真っ黒になった」という現象はこれが原因です。

透過を保ったまま軽くしたいのであれば、変換先はWebPを選んでください。透過を残す必要がないのであれば、JPEGにする前に背景を白などで塗っておくのが確実です。

キャンバスを経由するため、元の画像が持っていたEXIF（撮影日時・カメラ機種・GPSの位置情報）とICCプロファイルは変換後の画像に残りません。位置情報を落としたい場合には都合が良い挙動ですが、それを主目的にするならEXIF削除の方が意図が明確です。

また、非可逆形式から非可逆形式への変換（JPEG→WebPなど）は、一度失われた情報の上にもう一度圧縮をかけることになります。元データが手元にあるなら、元データから直接目的の形式へ変換するのが最も画質が保たれます。

iPhoneの標準形式であるHEICは、ChromeやFirefoxがそもそもデコードできないため、このツールの入力にはできません。専用のHEIC変換を使ってJPEGまたはPNGにしてから、必要であればこのツールで別の形式へ変換してください。

記事に載せる画像を用意する場合、掲載幅までリサイズし、WebPへ変換し、必要ならさらに圧縮する、という順序が効率的です。リサイズで無駄な画素を削ってから形式を変えることで、同じ見た目をより小さいファイルで実現できます。