SitePoint: New Articles, Fresh Thinking for Web Developers and Designers

YSlow, Stoyan Stefanov氏によればWebページに採用する画像の種類は写真データにはJPEGを採用し、それ以外にはPNG8にするのが妥当だとされている。しかしPNG8に透過データを含める場合には注意が必要だ。Net Applicationsの報告によれば2008年11月現在でIE6のシェアは22%弱はある。純減を続けているとはいえ、それでもなお第2シェアのFirefoxの合計シェア21%弱よりも多い。このIE6はPNG8の透過情報をうまく扱えない。

IE6で透過データを含んだPNG8を表示すると、GIFと同じように透過かそうでないかまで透過表現が低下してしまう。このため透過情報を含んだPNG8をIE6で表示する場合には何らかの追加的手段で改善を促す必要がある。JavaScriptとCSSを使う方法なら次のようなライブラリがある。

• IE PNG Fix v1.0 / 2.0
• IE7.js IE8.js PNG

JavaScriptを使わずに作成するPNG8画像を工夫することでマシな状態にする方法もある。

• Making ‘IE6-friendly’ PNG8 Images, SitePoint

JavaScriptを使ったりCSSを使ってIE6でPNGを表示できるようにしようという試みはほかにもいくつかある。データを編集してマシな表示になるPNG8画像を作成する資料としては、若干古くなるがAdobe Fireworks CS3を使った次の解説記事が有益だ。

• PNG8 - The Clear Winner, SitePoint

特定のアプリケーションの機能に依存した方法ではあるが、依然としてPNG8をIE6向けに編集する方法としての魅力を失っていない。IE6向けのPNG8画像を作る方法として資料に追加しておくとよさそうだ。

JavaScriptおよびCSSを使う方法の方が簡単に扱えるうえに汎用性は高いが、ページで使うJavaScriptやCSSと関係して使いたくないというケースもある。そういった場合には画像を工夫する必要があるが編集に手間がかかるのが問題だ。Webデザイナはこれらドキュメントを参考にしてIE6向け画像作成を検討しておくとよさそうだ。