前回はGIFとPNGの機能差について、いくつかの項目を挙げて説明としました。予定ではその次のエントリで両形式の透過の実現について書くつもりでしたが、前回の説明で言葉足らずな部分があったことに気付いたので、このエントリを補足とさせていただきます。とりあえず両形式の使い分けについてだけ知りたい方は、このエントリを飛ばして前後のエントリを参考にしてください。

ビット配列による色表現

基本的な部分にたちかえってみますと、デジタルの画像データはつまるところ1または0の値をもったビットの集まりになります。色の表現の考え方としては、1ドットにつき1ビットの情報をもつことができるのならば、そこに色があるか/ないかを情報としてもてるわけで、単色の画像を表現できます。この場合の単色は白黒に限らず、もし1を、”赤色が存在している”ことの指標として定義しているのなら、この1ビットの画像は赤白になるはずです。宣言は画像データの内部や、あるいはデータを読み込むソフトウェアのどこかでされているはずですが、その場合でも1ドットについてみれば1ビットのデータしかもっていないので、1ビットのビット深度をもつ画像と呼ばれます。

次に、2ビットのビット深度をもつ画像について考えてみます。2ビットのデータというのは、00、01、10、11という四種類の値をもつので、1ドットにつき4色を表現できることになります。例として、赤、茶色、焦げ茶色、群青色の四色を使う場合を考えてみましょう。どの値にどの色を割り当てるかという情報は、先ほどの赤白画像の例と同じようにどこかで宣言されていなければなりません。この例の場合00＝赤、01＝茶色、10＝焦げ茶色、11＝群青色のような宣言をするのですが、このビット配列と色の対応表をカラーマップと呼びます。一方、ドットごとにカラーマップのどの色を使うかの宣言部分は、たとえば赤が3ドット並んだ後茶色のドットが1ドットある場合、00、00、00、01のようになります。この宣言部はインデックスと呼ばれ、このようなカラーパレットとインデックスを使った表現方式をインデックスカラーと呼びます。

インデックスカラーの特長として、画像ファイルのサイズに見合った効果的な色表現ができることが挙げられます。たとえば青空を撮影対象とした写真では、使われている色はほとんど青や水色です。もし8ビットのビット深度をもつ画像が、赤から青、緑までまんべんなく色を備えていたとしたら、その中で使う色はたかだか10種類くらいで、残りの200色以上の定義色が無駄になってしまいます。理想としては青系統の色で数十段階用意されていた方が、より自然に青空を表現できます。その点インデックスカラーではカラーマップに自由に色を当てはめることができるので、青空の画像のような例では8ビット、つまり256色でも後述のフルカラー画像と遜色ない表現が可能になります。

インデックスカラーは確かに少ないビット数での色表現に向いていますが、画像のビット深度が大きくなるにつれ、今度はカラーマップの定義部分が無視できないサイズになってきます。理屈では24ビットのビット深度をフルに使う場合、たとえ青空のみの画像でも1680万色弱を定義しなければなりません。そこでビット深度の大きい画像では、ドットあたりのビットデータを3等分し、rgb（赤、緑、青）それぞれの色を段階的に定義、その混色で色を作り出すという方法がとられます。この方法はダイレクトカラーと呼ばれ、特に24ビットをrgbの各色8ビットずつで分割し定義したものはフルカラー画像と呼ばれ、標準的なフォーマットになっています。

GIFとPNGの採用方式の違い

さて、GIFとPNGの比較に戻ります。GIFが通信環境の貧弱な時代に策定された形式であることは先述のとおりですが、そのため採用されている色表現の方式はインデックスカラーです。一方のPNGでは、GIFの代替フォーマットとして普及を狙ったという経緯から、8ビットのPNG-8でインデックスカラーを採用しています。PNGはGIFに比べてサイズが大きいというイメージがありますが、GIFと同じ256色に減色を行うPNG-8で保存すれば、サイズは多くの場合PNGの方が小さくなるようです。

PNGはまたダイレクトカラーもサポートします。ビット深度に応じてPNG-24、PNG-48などフォーマット名に接尾語がつきますが、よく使われるのはフルカラー画像のPNG-24およびPNG-32です。ただしソフトによってはこうした接尾語つきの呼び方を使わず、一様にPNGとして扱ったり、PNG-32をアルファチャンネル付き24ビットPNGと表現したりと呼称に揺れがあるので、WEB上の解説でも混乱が生じているという印象があります。今回のエントリでビット配列にまで踏み込んだ解説を行ったのは、そのあたりの混乱をある程度解消することを狙ったものですが、次回のエントリの透過の説明とあわせて、呼称の揺れに対してある程度のあたりをつける材料となってくれることを期待しています。

Tweet