動的色量子化を使用して画像を最適化する

カラークオンタイズは、画像の全体的な視覚構造を維持しながら、画像内の色の数を減らす手法です。ファイル形式によっては、これにより画像のファイルサイズが劇的に減少することがあります。TinyPNG (opens in a new tab)や他の類似のアプリケーションは、カラークオンタイズを使用して画像ファイルサイズを削減します。カラークオンタイズは、芸術的な効果を生み出すためにも使用できます。

imgixを使用すると、URLパラメーターを変更するだけでカラークオンタイズ操作をオンデマンドで実行できます。最適化と効果の両方について、どのように機能するかを見てみましょう。

sandbox-demo — `mark-align=middle,center&mark=https://assets.imgix.net/presskit/imgix-presskit.pdf?w=160&fm=png&page=2&w=640&q=75&h=320&fm=png8&fit=crop&colorquant=9`

基本的な使用方法

カラークオンタイズを使用するには、imgix URLにcolorquantパラメーターを設定します。このパラメーターは2から256の値を受け入れます。この操作はimgixの操作順序の最後の一つであり、他の画像調整や合成操作の後に適用されます。

最適化のための`colorquant`の使用

圧縮のためのカラークオンタイズを検討する際には、グラフィック要素、アイコン、またはアニメーションからキロバイトを削減する際に最大の効果を発揮します。

fm=png8と併用することで、シャープでピクセルパーフェクトなグラフィックを維持しながら、ファイルサイズを最大60％削減できます。次の例では、透明なPNGを使用し、colorquantおよびfm=png8で処理した同じ画像を示します。この例の元の画像は、Adobe Illustratorの「Web用に保存」ダイアログからエクスポートされた1200×900の無損失透明PNGグラフィックです。