> ホーム > マルチメディア > 画像形式について

画像形式について

ラスタデータとベクトルデータ

コンピュータ上の2次元の画像データ、すなわち「絵」には大雑把に分けて2種類あります。一つはベクトルデータ、もう一つはラスタデータ(ビットマップデータ)です。

ベクトルデータとは、計算によって描かれているグラフィックデータのことで、拡大縮小を行っても絵が粗くなることはありません。この形式ではその「絵」について、線の位置、長さ、太さ、カーブの角度のデータを持っていて、画面やプリンタに出力するときに、指定の位置に大きさ、長さ、太さなんかを計算で変化させてるってことです。(角度は変わりませんやね。拡大縮小の基本。)こうしてやると画面で 50% の大きさで表示しても、100% で表示しても、でっかく印刷しても同じように見せることができます。分かりやすい例で言えば、イマドキのワープロソフトは文字をいくら拡大してもギザギザになったりしませんね。あれがベクトルデータです。(こんな説明をしても昔のギザギザ文字を知らない人たちには通じないよなぁ。)

デザインの世界ではこのベクトルデータってのは重宝しまして、拡大縮小が自由自在ってことは、例えば一つのデザインを完成させたら、それを新聞広告にもおっきな看板にも小さなシールにもそのまま使えるんですね。ということはベクトルデータをコンピュータ上で作れば、画面で見るときも雑誌に印刷するときも、ポスターに印刷するときもそのデータをそのまま使えるってことなんですね。まさにデジタルさまさまって感じです。

100% の表示 200% の表示

対してラスタデータはすべて点の集合です。よくパソコンでは画面のサイズが 1024*768 であるとか、プリンタの印字品質が 600dpi であるとか言われますが、これは「点の数」を表しています。コンピュータってのは画面に出すときも印刷するときも最後はたくさんの点の集合で文字や絵を表していますが、その点の集合をそのまま扱うのがラスタデータです。

100% 400%

ラスタデータの場合、拡大するときに「点」の数を増やさないと、点がそのまま大きくなるので、絵がガタガタになります。ガタガタにしないようにするには点の数を増やさないといけません。例えば画面で見てちょうどいいデータと、印刷してちょうどいいデータはその大きさがまったく違います。画面は大きくてもせいぜい 1600×1200 くらいまでしか普通は使えませんが、これを 300dpi のプリンタで印刷したらせいぜい 5cm×4cmくらいにしかなりません。名刺より小さいサイズです。(ところで人間の目の限界は何dpiでしたっけ?)

しかし、点が増えるってことはそれだけ情報量が増えるということで、大きな画像データになればなるほどファイルサイズが大きくなります。この辺がベクトルデータとは違うところです。

一部、理解しやすさのために正確さを欠く記述になっています。それが分かる人はわざわざこのページを読まないと思いますが、分かっていても黙っておいてください(^^;

詳しい話は SFC の「1.1 画像ファイルの性質」なんかが参考になります。ちょっと説明が難しい感じはしますけど。

[ ↑ content ↑ ]

ラスタな仲間たち

システム標準の画像形式

BMP

Windows や OS/2 で使われる画像形式で、モノクロ2色、4bit, 8bit, 24bit の4つのモード(色数の種類)があります。基本的には圧縮していませんが、RLE という、JPEG と違い情報の間引きを行わない圧縮を施すこともできます。

BMP は内部で特殊なことをほとんどしないので Mac とのデータのやり取りなど、広い範囲で使えると思います。

拡張子はフツー、.bmp。 ただ、Device Independent という部分を強調するために .dib である場合もありますが、ほとんど見かけません。

PICT

Macintosh で標準的に使われる形式です。ラスタデータに分類していますが、実はベクトル画像も扱え、JPEG圧縮もサポートしている、かなりなんでもこいな形式です。Mac 内部での画像処理に依存しているので、基本的には Mac 依存ですが、Mac 出身のソフトでは Windows 版も対応しているのが多いので、今はそれほど Mac 以外のプラットフォームでも扱いに困らないと思います。(ただし、ラスタデータに限った場合。ベクトルが入るとやはり Windows では扱いに困ります。)

Mac では拡張子はつけませんが、拡張子は .pct, .pict, .pic 辺りかな。

XBM, XPM

X Window System で使われている画像形式で、XBM はモノクロ2色、XPM はそれ以上、という風に分かれています。圧縮はなし。

UNIX の形式らしく、直接 C 言語に取り込める形式になっています。普通のユーザーにとっては別にありがたくもなんともないですけどね。拡張子は .xbm, .xpm

IRIS RGB

グラフィックに強いワークステーション用 OS、IRIX で使われている形式。ま、お目にかかる機会はほとんどないので気にする必要はないでしょう。拡張子は .rgb

[ ↑ content ↑ ]

Web に使える形式

基本的にシステム標準の形式は Web には載せられません。

GIF (ジフ。ギフと読む派閥もあるらしい。)

256色までしか使えない。イラストなどの同じ色が連続する画像に向く。

写真などは数万色使わないと正しく表現できないため不向き。無理に減色して GIF 形式で写真を表すことも不可能ではないが、圧縮率も悪くなるし、上手に減色しないとあまりきれいに見えないので素人はやめた方がよい。よほど色がはっきりしたシンプルな写真なら挑戦してみるのも一興。

複数の絵からパラパラアニメを作ることができる。画像の扱えるブラウザならほとんど表示可能。画像ファイルの拡張子は .gif

JPEG (ジェイペグ)

JPEG画像

写真などのフルカラーの自然画に向く。自然画というのは聞き慣れない言葉かもしれないが、イラストでは同じ色で表現されるようなところでも微妙に色が変化している画像のこと。普通、人間が考えている以上に自然界の色の状態は、2次元の画像に変換したときには複雑に変化している。コンピュータで生み出した立体画像が妙にのっぺりして見えるのはその辺りの微妙さが再現できてないから。

くりかえすと、JPEG 形式に向いている画像は写真やスキャナで取り込んだ画像のこと。

ただしこの形式は人間の目の錯覚を利用して画像情報を適当に間引きする(したがって不可逆変換である。一度圧縮すると画質が劣化して元には戻らない。)ので、同じ色が広い範囲に渡る場合、モアレと呼ばれるにじみのようなものが出てきて汚い感じになってしまう。あくまで自然画の圧縮に使うのがよい。また、圧縮率が変更できるので、画像の劣化とファイルサイズのバランスを考えて圧縮率を設定するとよい。もう少しだけ詳しい話は「JPEG画像の『品質』」をどうぞ。

画像の扱えるブラウザならほとんど表示可能。JPEG の画像ファイルの拡張子は .jpg.jpeg

(ほんとーは、JPEG というのは「不可逆圧縮の画像形式のことではない」のです。Intel(R) JPEG ライブラリの概要とかを読むと詳しいことが分かります。http://www.jpeg.org/とかでもいいです。(2001.08.追記)JPEG2000 という規格も出てきて、これはさらに圧縮率も高くなり、可逆圧縮もサポートしているとのことです。ただし、現在のブラウザではそのままでは表示させることができません。)

PNG (ピン、ピング。でも個人的にはピーエヌジーと読むのがいいように思う。)

フルカラーに対応しつつ、JPEG と違い、可逆圧縮で、なおかつ GIF より高い圧縮率を持つ画像形式。いいことずくめのようだが、GIF と違いアニメーション機能はないし、可逆圧縮のため、写真などは JPEG ほど軽くならない。

Mac版 IE 4.5 はじめ、多少古いブラウザや設定の古いサーバでは表示できないが、ブラウザは Mac版 IE 4.5 を除いて、Netscape 4、Internet Explorer 4 以降なら表示可能だし、今やかなりの数のグラフィックソフトが対応しているので、そろそろ普及したと見ても問題ないだろう。(2001.04.現在)

画像ファイルの拡張子は .png

もう少しだけ詳しい話は「Let's PNG!」参照のこと。でももうこの記述は古くなってきてます。特許のことなど、もっと詳しい話は「わかりやすい PNG の話 for Web」がオススメです。このページは勉強になりますね。

[ ↑ content ↑ ]

その他

TIFF

ラスタデータを様々なコンピュータの間でやりとりすることを目的にした形式で、画像の前に様々な属性(タグ)を持てるようになっています。しかし、あまりにその情報が多くなりすぎたためか、まともにタグに対応していないソフトも多いようです。

DTP の世界では標準的に使われているようです。拡張子は .tiff, .tif が一般的。

PSD

超有名な画像ソフト、Adobe Photoshop 独自の形式。ただ、仕様が公開されているのか、Photoshop 2.5 形式には多くのソフトが対応していますので、Photoshop 専用の様々な情報はともかく、1枚の絵として扱うだけなら、意外に使えます。

拡張子は .psd

[ ↑ content ↑ ]

ベクトルな仲間たち

お手軽共用フォーマット

システム標準の形式ってのがあるんです。クリップボードなんかもそうですよね。

WMF (Windows Meta File)

Windows の内部処理を具体化した画像形式です。まぁ細かいことはともかく、こいつを経由することである程度ベクトルデータを他のソフトに使いまわすことができるようになります。

同時に、EPS などの形式でなくとも、Windows 同士であればこのデータをネットで送ればベクトルデータを手軽に離れた人と共有することができます。もちろん EPS の方が厳密なんですけどね。

私は普段、クラリスワークスを使って文書を書き、図形を書いているのですが、(正確には文字を打っているのはアウトラインプロセッサやエディタ上でですが)このドローデータを PowerPoint や Illustrator に持っていくには一度 Windows Meta File に書き出すとよいようです。ま、Illustrator に持っていってしまうと、元の画像のデータの荒さが若干目に付きますが、それでもベクトルデータがそのまま使えるメリットはかなり大きいです。方法は簡単、

これでオーケー。クリップボードを経由してもドローデータをやりとりできるソフトもあるにはあるのですが、この方が確実です。手元で試したソフトではこんな感じになりました。

  インポート エクスポート 備考
インスピレーション v6 ×Illustrator で読み込むと文字がずれる
Illustrator 9  
クラリスワークス 4  
PowerPoint 2000  

PICT でもドローデータを保持できるようなんですが、クリップボードを経由するのと結果は同じなんですよね。ま、同じでない方がそもそもおかしいんですけど。クリップボード経由でやりとりできないものは諦めるか、Adobe 製品で読み込むなら PDF 経由という大技もあります。ただ、インスピレーションで作るデータが、どうも標準的なものとは違うらしく、クリップボード経由でも文字がずれちゃったり、PDF 経由でもそもそもドローデータにならなかったりします。むつかしいですね。あと、Adobe なソフトはフォント周りがちと厳しいです。とにもかくにも MS のプロポーショナルフォントは避けた方がいいようですね。

これで、WMF を利用すれば、印刷データも、ベタ画像も、ベクトルグラフィックスも、まずはクラリスワークスで作ることができるってことが分かりました。印刷はそのまますればいいし、その後 Web に貼り付けるためのベタ画像にも応用できる。うーん、バッチシだ。

また、クラリスで作成し、そのまま PDF にしたデータも、Photoshop を使えば好きな解像度で取り出すことができ、Illustrator を使えばベクトルグラフィックスのまま取り出せます。Illustrator で SVG や Flash 形式で保存すれば、WWW 上にもベクトルグラフィックスで配信できますから、これはかなりよいですねぇ。

PICT

Macintosh の描画処理を内蔵しているフォーマット。ラスタデータのところでも登場しましたが、ベクトルデータも対応しています。

ただ、WMF よりもベクトルデータの扱いが得意でないらしく、このフォーマットに書き出してもうまくベクトルデータが渡らないこともあります。ラスタデータもベクトルデータも扱えるのですが、BMP + WMF の Windows の方がデータの受け渡しは確実ですね。

[ ↑ content ↑ ]

Web 向けの小さなベクトルグラフィックス

最近、Web 上のグラフィックスも、ベクトル化の流れにあるようです。今のところ(2001.01.現在)ベクトルグラフィックスを標準で扱えるブラウザはなく、すべてプラグインに頼る必要がありますが、ここに挙げる形式のプラグインをインストールする価値はあると思います。

PDF(Portable Document Format)

PDF って、ワープロ文書だけじゃなくて図形データも拡大縮小を前提としたデータになっています。Bitmap を貼り付けた場合はだめですけど、ベクトルデータを PDF にしていれば、PDF 上のグラフィックスもベクトルグラフィックスになっています。(PDFの作り方によってちょっと違うかも。)ま、基本は PostScript ですからね。PDF は。

ビットマップの場合も Single Image PDF など(私もよく分かっていないのですが)、ページレイアウトと関係のないものもあります。PDF Writer、Distiller で画像の圧縮率を変更することでサイズの調整ができます。もちろん、拡大表示、印刷に耐えられるクオリティを目指した方がサイズは大きくなりますが、それでも一般的な図形データくらいならかなり小さくなります。PDF って奥深いですよね。たぶん PostScript が奥深いんでしょうけど。

もっと突っ込んだ話は「PDF職人への道」を参照してください。

SVG(Scalable Vector Graphics)

XML ベースの、テキストで記述されたベクトルグラフィックフォーマットです。基本的には PS と同じ発想ですね。XML ベースなので Web への応用に向いているし、JavaScript などのスクリプティング言語で制御可能です。ということは GIF アニメよりも大胆に、Flash と違い plug-in を使わずにダイナミックなアニメーションやインタラクティビティを持たせることができる。ようになるはずです。現在(2001.01.)のところはまだブラウザが対応していないので予定、としか言えませんけど。もちろんベクトル形式なのでそのまま解像度の異なるプリンタで印刷してもきれいに出力できます。まさに PDF の発想を持った、統一規格の画像形式です。

この先進のグラフィックについて参考 URL は以下の通り。

[ ↑ content ↑ ]

Flash

Web な世界ではむしろ Adobe より Macromedia かなーという感がありますね。プロ御用達のソフトハウスです。Shockwave って言葉を皆さんもそこかしこで目にしていると思いますが、それを作っているところですね。ここのソフトは Adobe の PostScript な Publishing の発想ではなく、インタラクティブなアプリケーションの発想から出てきているため、WWW の装飾には持ってこいとなっています。

さっき挙げた Shockwave ですが、もともとはマルチメディアな CD-ROM 作りに向いていたマルチメディアオーサリングソフト、Director の作り出すものなのですが、最近では Director Lite の登場もあり、インタラクティブな Web アプリのキーとなってきています。JavaScript & CGI は特別なプラグインを必要としませんが、JavaScript の互換性のなさや CGI ではサーバとのやりとりに時間が掛かることがネックとなりますしね。

で、その Shockwave をさらに Web 用にしたようなものが Flash です。(思いっきり語弊があると思いますが、ほかに適切な説明を思いつきません。)主に GIF より高精彩で複雑なアニメーション、インタラクティビティの提供に利用されます。CGI のユーザーインターフェイスを Flash で実装することで Web を高度なアプリケーションに化けさせることができます。Flash は自身のアニメーションを制御するスクリプトを搭載するようになったので、アニメーションやムービー作成ソフトという雰囲気ではなくなってきました。

で、この Flash はアニメーションしなくても静止画として利用できるんです。そのとき、拡大縮小を自在に行えるベクトルグラフィックスとして利用することができます。Flash は他のプロ用アプリに比べても安いし、けっこう使えると思います。Flash より Director Lite の方が安いけど。(最近は Adobe の Illustrator でも Flash の静止画を扱えるようになってきていますね。)

ちょっと調べると、この FLASH形式は仕様が公開されているらしく、いろんなソフトで対応が広がっていますね。Illustrator 9 でも直接書き出せるし、オンラインソフトでも対応しているものが出てきています。

[ ↑ content ↑ ]

プロフェッショナルな形式

プロフェッショナルな、というのはそれほど深い意味はなくて、要するにプロの世界でよく使われていて、その形式を扱うソフトがちょっと値が張る、という程度の話です。

PostScript系ドローとEPS形式

これは Photoshop や Acrobat で有名な Adobe Systems. の作った規格で、DTP 業界ではこの形式に則ることが標準となっているものです。PostScript というのは、追伸のことではなくて、「ページ記述言語」と呼ばれるもので、データをそのページのどこに配置するかを規定している言語です。なんと中身はテキストファイルになっていまして、このテキストファイルにしたがってページプリンタやイメージセッタがデータを正確な位置に印刷してくれるわけです。

最近は一般にもページプリンタが普及してきていますが、やっぱり高いやつは高いです。で、そのページプリンタを高くする一つの要因がこの PostScript です。普通、プリンタというのはメーカーや機種によって出力のクセが異なりますが、この PostScritpt に対応しているプリンタに PostScript 形式のデータを送ってやれば、どのプリンタでもだいたい同じに仕上げることができるのです。だから DTP 業界の標準になってるわけです。この形式にしておけば、自分の会社のプリンタで出したものと、印刷所で出力したものとの間に大きなイメージのずれが出なくなります。ということは印刷所とデザイン会社の間を何度もゲラが飛び交う必要がなくなるわけです。PostScript にはこのようなメリットがあります。

で、こうした PostScript 形式のデータを扱えるドローソフトを PostScript 系ドロー、扱えないものをただのドローと呼びます。例えば私の愛用しているクラリスはただのドロー、Adobe Illustrator は PostScript 系ドローです。

PS(PostScript)系のドローソフトは EPS(Encapsulated Post Script) という形式で図形データだけを出力することもできます。この形式はページ全体を扱うものではないので、他のワープロソフトなどに貼りこむことが可能になります。(もともとの PostScript はページ全体を扱うものなので、ワープロとのデータのやりとりには向かない。)こうすると何が嬉しいかというと、ワープロ付属のチャチなお絵描き機能にはできない高度な技を、その美しさを保ったままワープロソフトに持ってくることができるわけです。

もちろん、そのためにはワープロソフト側が EPS 形式に対応していないとだめですが、最近の Office などはたいていできるようです。また、本格的なレイアウトソフト(PageMaker、QuarkExpress など)ではもちろん対応しています。

こういう機能が使えない、例えばクラリスのようなドローの場合はそのデータはただのビットマップ(点の集合)としてしかワープロソフトに伝わりません。ということは、高精度なページプリンタなんかではそのアラが目についてしまうんですね。これを防ぐため、とういわけではないですが、クラリスの場合はワープロも何もかも入っている統合ソフトなので、ドローのデータをそのきれいさを保ったままワープロに持っていける、というわけです。Word 付属の図形ツールなんかもそういう理屈です。互換性はないけれども、一つのソフトの中でならきれいだよ、ということですね。

まだまだパーソナルユースでは PostScript は高嶺の花ですねぇ。

[ ↑ content ↑ ]

CADなDXF形式

もうひとつ、ベクトルグラフィックスという呼び方では馴染みがないと思いますが、CAD なんかもそうですね。拡大縮小を前提にしたベクトル形式の図形データです。

CAD は、これまで触れてきたワープロや DTP の世界とはかなり異質な世界です。そこには文章が入る余地は基本的にありませんし、出力もページプリンタなどではなくプロッタと呼ばれるペンで描くタイプのプリンタを使いますし、その出力サイズもパソコン用のプリンタとは比べものにならないくらいに大きいものになります。ま、要するにあんまり一般のパソコンユーザーの目に触れることはないんですが、考え方を変えると、このデータを使いこなせればけっこう便利なんじゃないかなぁーとも思います。CAD には CAD の、DTP にはない独自のノウハウがありますからね。むしろそのノウハウの方が一般のユーザーに馴染みやすいかもしれません。例えば線の端と線の端が離れないようにする処理なんかは、DTP の「整列」よりずっと普通の感覚に近いように感じるのですが、どうでしょうか。

問題は CAD で使われているデータ形式を我々が扱えるかどうかですね。

CAD界のデータは Adobe や EPS ではなく、AutoCAD というソフトのデータと互換性のある DXF 形式が一般的です。これもいわゆるデファクトスタンダードってやつで、この形式を扱えない CAD はもぐりと言ってよいでしょう。しかし、この形式を読めるワープロソフトっていうのは、私は聞いたことがありません。残念ながらこの辺が実に難しいところです。

ということは、長文の中の図形に CAD のデータをそのまま活かす方法は、現在(2001.01.)のところ残念ながらありません。しかしレイアウトソフトはかなり DXF 形式との親和性を高めてきています。具体的にはこの辺でしょうか。

林檎環境だとやっぱ Adobe ですか? あんまり調べてませんけど。あと、おまけ。

[ ↑ content ↑ ]