豆知識

画像フォーマット

現在、Web上で一般的に使われている画像形式は次の3種類。

  • GIF形式
  • PNG形式
  • JPEG形式

GIF - Portable Network Graphics

LZW圧縮の特許関係でいろいろと問題になった画像形式ですが・・・現在はその特許も失効となっており、自由に使用できる画像形式です。

GIF形式の特徴は

  • 256色までのインデックスカラーが扱える
  • 透過色を指定できる
  • アニメーションGIFを作成することができる

インデックスカラーでは、2色、4色、8色、16色、32色、64色、128色、256色のいずれかのパレットを選択することが出来ます。

主に、幾何学的なイラスト・バナーなどに利用されます。

GIF形式に変換する際には、減色を行う必要があります。減色にはWeb作成に役立つソフトで紹介をしているYukariを利用するときれいに仕上がります。

また、アニメーションGIFを作成する場合は、以下のソフトを利用すると良いでしょう。

natm アイコン natm
アニメーションGIFの作成に必要な機能は全て揃っている。ただし、元の画像ファイルは他のソフトで作成しておく必要がある。

PNG - Portable Network Graphics

PNG形式の特徴は

  • 最大48bitのRBGカラーのサポート
  • 16bitのグレースケールカラーのサポート
  • αチャンネルのサポート
  • 256色インデックスカラーのサポート
  • 透過色を指定できる

などなど。このほかにもいろいろな機能に対応しています。

特に魅力的なのは、αチャンネルの対応です。αチャンネルとは、RGBの他に透明度を表す情報のことで、αチャンネルを利用することで、半透明な画像を作成することが出来る。

Firefox, Safari, OperaなどのブラウザはPNG形式に完全に対応しています。また、最新版のInternet Explorer 7では、PNGのαチャンネルもサポートしました。

Internet Explorer 7はWindows XPとWindows Vista向けのリリースとなっており、XP以前のOSの場合はPNGのαチャンネルには未サポートのInternet Explorer 6が最終バージョンとなります。

現状だと、Internet Explorer 6を利用しているユーザーもまだ多いため、Web上でPNG形式を使用するのならば、24bitもしくは256色のインデックスカラーのPNGを利用のが良いでしょう。

PNG形式が得意とするのは、GIFと同じく幾何学的なイラストやバナーなど。また、小さめの写真であればJPEGではなくPNGを利用しても良いかもしれません。

減色にはWeb作成に役立つソフトで紹介をしているYukariを利用するのが良いでしょう。

JPEG - Joint Photographic Experts Group

JPEG形式の特徴は

  • 24bitのRBGカラーをサポート
  • 圧縮率が可変である
  • 非可逆圧縮形式である

JPEG形式では、保存時に圧縮率を自由に設定することが出来ます。圧縮率を上げればファイルサイズは小さくなりますが、その分画質は劣化してしまいます。

また、非可逆圧縮を行っているため、一度JPEG形式で保存した画像をもう一度編集ソフトで開き、JPEG形式で保存を行うと画質はさらに劣化してしまいます。

JPEG形式が得意とするのは、写真や絵画など。特に、高解像度の写真や絵画などの場合にはかなり有効でしょう。

圧縮率は、画質と相談しながら決めるのが良いでしょう。

その他の形式

Flash

最近、企業ではFlashを使用したページが多いです。Flash形式の特徴は

  • ベクターデータで表現される
  • 音楽ファイルや画像ファイル等を埋め込むことが出来る
  • 動きのあるコンテンツを作成できる

ただし、Flash形式の作成にはMicromediaのFlash ProfessionalもしくはFlash Basicが必要となります。

情報の確認不足です。Flashの仕様は公開されており、オープンソースのFlash(正確にはAction Script)コンパイラのMTASC等が存在しています。

また、ParaFlaSuzukaという日本製のFlash作成ツールも公開されています。かなり本格的なFlashを作成できるようなので、興味がある方は試されてみてはいかがでしょうか。

SVG - Scalable Vector Graphics

ベクターグラフィックス形式。全て、XMLで記述されている。したがって、(一応)テキストエディタでも編集可能。

ブラウザの対応状況ですが・・・Internet Explorerでは、Adobe SVG Viewerが必要です。また、完全ではありませんが、Firefox, OperaはSVGをサポートをしています。

Adobe llustratorやInkscape等がSVG形式での保存に対応しています。

MNG - Multiple-Image Network Graphics

GIFアニメーションのPNG形式版。・・・Mozilla, Netscapeが対応している模様。

PNG形式のメリットを生かしたアニメーションを作成できる。

おそらく、これからも、普及はしないでしょう。