PNG最適化テクニック

後藤大地  [2009/07/22]

Smashing Magazine - WE SMASH YOU WITH THE INFORMATION THAT WILL MAKE YOUR LIFE EASIER, REALLY.

Sergey Chikuyonok氏がSmashing Magazineにおいて「Clever PNG Optimization Techniques」のタイトルのもと、PNG画像を最適化するためのいくつかのテクニックを紹介している。このテクニックは、PNGエンコーダがどのようにデータを保存するかを調査することで得られたテクニックだと説明されている。

記事の中でSergey Chikuyonok氏は、まず、PNGで導入された機能のうち、特に次の2つを理解しておくことが重要だと説明。

スキャンラインフィルタリング (データフィルタ)

ピクセルのカラーを別のピクセルから得る方法。全ピクセルにカラー情報を持たせるのではなく、隣り合ったピクセルからの差分情報だけを指定することで圧縮率を引き上げる機能。次の5つの指定が可能。

  • None (フィルタなし)
  • Sub (左の値の分だけ減算する)
  • Up (上の値の分だけ減算する)
  • Average (左と上の値の平均値の分だけ減算する)
  • Paeth (上、左、左上のどれかの値の分だけ減算する)

イメージタイプ

PNGはファイルの種類を指定するメタデータをファイル内部に保持できる。次の5つのイメージタイプを保持可能。

  • グレースケール
  • トゥルーカラー
  • インデックスカラー(ビットトランスパレンシ、パレットトランスパレンシ)
  • アルファ付きグレースケール
  • アルファ付きトゥルーカラー

PNGの操作に関してはAdobe Fireworksが優れた機能を提供していると説明があるほか、画像品質を下げることなくファイルサイズの削減を実現するツールとしてOptiPNGpngcrushが紹介されている。これらツールは次の機能を提供するという。

  • もっとも適切なイメージタイプを選ぶ
  • もっとも適切なデルタフィルタを選ぶ
  • もっとも適切な圧縮方法を選ぶ

さらに進んだ圧縮方法として、次の4つの手法が紹介されている。

  • ポスタリゼーション (類似カラーをある程度まとめてしまうことで、フィルタの効果が効きやすくする方法)
  • ダーティトランスパレンシ (完全透過になっている部分のオリジナル画像を真っ黒にする。強力な手法だがあまり知られていない方法)
  • トランスパレンシ分割 (透過データを含んだ画像を、透過なしのPNG-8と透過ありのPNG-24に分割して、さらにPNG-24の方にポスタリゼーションを実施する。効果はあるがファイルが2つになるため扱いにくいテクニックではある)
  • インフルエンスマスク (Photoshop CD4よりも前のバージョンで実施できる圧縮方法)

Sergey Chikuyonok氏はJPEGに関しても同じように画像の圧縮をさらに進めるための手法をSmashing Magazineにおいて「Clever JPEG Optimization Techniques」のタイトルのもとで公開している。



IT製品 "比較/検討" 情報

転職ノウハウ

あなたが本領発揮できる仕事を診断
あなたの仕事適性診断

シゴト性格・弱点が20の質問でサクッと分かる!

「仕事辞めたい……」その理由は?
「仕事辞めたい……」その理由は?

71%の人が仕事を辞めたいと思った経験あり。その理由と対処法は?

3年後の年収どうなる? 年収予報
3年後の年収どうなる? 年収予報

今の年収は適正? 3年後は? あなたの年収をデータに基づき予報します。

激務な職場を辞めたいが、美女が邪魔して辞められない
激務な職場を辞めたいが、美女が邪魔して辞められない

美人上司と可愛い過ぎる後輩に挟まれるエンジニアの悩み

人気記事

一覧

イチオシ記事

新着記事

KDDI、auスマホと強力に連携する8.0インチタブレット「Qua tab PX」
[19:04 5/31] 携帯
Intel、最大10コアのデスクトップ新ハイエンドCPU「Broadwell-E」を発表
[19:04 5/31] パソコン
日空ビル、羽田国際線ターミナルでCYBERDYNE製クリーンロボットの実証実験
[19:04 5/31] テクノロジー
geanee、SIMロックフリーの10.1型Windows 10デタッチャブル2in1 PC
[18:51 5/31] パソコン
アーティスト風の描き下ろし6つ子も!「おそ松さん」グッズがTSUTAYAに
[18:50 5/31] ホビー

求人情報