SeaMonkey教室 - 画像の入れ方 (3) デジタル画像

Last updated 2017/1/1

画像の入れ方 (3) デジタル画像

■１．画素、画素数、解像度

写真とは、小さな光の粒の集まりです。粒に色が付いているか否かでカラーかモノクロになります。粒の大きさや並びにばらつきがあるのがアナログ、大きさが揃っていて整然と並んでいればデジタルの画像です。この粒を画素 pixel といいます。

さて、画素が整然と並んでいれば、数を数えたり、計算することができますからその画像が何画素から構成されているかを表現できます。これが画素数です。また、画素の密度を解像度といい、1インチあたりの画素数、pixel / inch (ppi) で表現されます。解像度が高いと緻密な画像、解像度が低いと粗い画像となります。

注）ディスプレイなどは小さなドットの集まりで文字や絵を投影していますから、同じように画素数と解像度で規格が表現されます。ただし、こちらは一つの点をドットといい、例えば解像度は dot / inch (dpi) として表記されます。くわしくは、画像の入れ方 (2)サイズ編集へ。

■２．BMP (Bitmap)

タテ 400 pixel x ヨコ 300 pixel =　120,000 pixel (= 12万画素)から構成されているデジタル画像を例にしてみましょう。ひとつの画素を1バイトで記録することにすれば、120,000 バイト (120 キロバイト）のファイルになります。1バイトは256ビットという情報量を持っているので、カラーならば255色、モノクロならば、256階調の表現をもった画像として保存できることになります(注１)。

画素の並びそのままに保存した形式を BMPといっています。非圧縮なので、「画素数＝バイト数」になります（注２）。ただし、ひとつの画素を2バイトで保存する形式もありますので、画素数の2倍のバイト数になる場合もあります。2バイトで記録すると 256x256= 65,536 の情報量になるので、カラーならば 65,535色、モノクロならば 65,536 階調で保存できます。

ファイルの拡張子は、.bmp です。

注１）　１バイトは二進表記では8桁の数字であり（= 8 bit ）、十進表記の 0 から 255 の数に相当します。カラーの色情報としてこの1バイトを使う時には、0が無色、255 が黒を示しますが、無色を色数には入れないので、色数は 255色となります。一方、モノクロの階調情報として1バイトを使うときには、無色であっても数にいれられるので、256階調という言い方になります。2 バイト記録 (= 16 bit) の場合も同様で、 65,545 色、65,546階調と表現します。

注２）　画像ファイルの先頭部分には、形式などを記録したブロックがありますので、実際には画素数から換算されるバイト数よりもやや大きめになります。

■３．画像の圧縮保存

BMP形式の画像ファイルはシンプルな構成ですし、画像の劣化もありません。ただし、データとしては、少々無駄が多い形式です。例えば、背景が白い写真であれば、データとしては白色を示す　0　がたくさん並ぶファイルができることになります（注３）。

さて、000000 ......... と 0 が 30 個並んでいるとします。この表記のままだと 30バイトが必要になりますが、0 x 30 のような形式で保存できれば、わずかに 3バイト程度で保存できます。これがデータ圧縮の考え方です。音声ファイルであれ、動画ファイルであれ、こうした考え方でデータが圧縮されているのです。

非圧縮	BMP	拡張子は .bmp
圧縮	JPEG	拡張子は .jpg .jpeg
	GIF	拡張子は .gif
	PNG	拡張子は .png
その他	PSD AI PDF PPT PPTX RAW など

主な画像の保存形式は右表で、それぞれの詳細は以下で紹介します。Web でもっともよく使われるのは、JPEG と GIF です。

注３）　ここでは、16進表記（= 16 bit）で話をしています。コンピュータのメディアなどへの書き込みは2進でされていますが（つまり 0 と 1 のみで）、表記としては桁数がやたら増えるために、16 進を使うのが普通です。すなわち、0-F を数字として使って表記するわけです。ただし、文中の 0 x 30 の 30 などは 0 が 30個という意味なので、ここは個数の表記なので、便宜的に10進で表記しています（16進表記ならば 1D です）。

■４．JPEG (ジェイペグ) 画像の種類

写真の場合は、JPEG という圧縮形式が一般的です。フォトショップなどで、BMPファイルを JPEG に変換する時は、12段階の圧縮率を選択できますが、6-8程度で圧縮するのが普通です（注４）。ただし、JPEG は非可逆性圧縮なので、画像の劣化が起こってしまい、編集などをしなおす時には、元ファイルが必要です。元ファイルを消さないようにしましょう。

圧縮によって、ファイルサイズは BMP よりもぐっと小さくなるため、Web画像の標準ファイルとして使われています。少しでも軽いファイルの方が、データ転送が容易だからです。ただし、イラストや線画にこの圧縮を使うと、単色部分にムラがでたり、線のすぐ外側にボケが出ますので、写真専用といってもよい圧縮様式です。

ファイル拡張子は、.jpg または、.jpeg です。

注４）　圧縮率を替えられるのは、小さな色変化を無視して同じ色が続くことにする、色のグラデーション部分の階調を減らすなどの処理で可能にしています。従って、圧縮率をあげていくと、その分像が粗くなりますし、元画像とはちがうものになってきます。

■５．GIF (ジフ)

グラフやイラストなど、色数が少ない画像は　GIF　が使われます。また、透過GIF、インターレースGIF、アニメーションGIF といった拡張形式もあり、可逆圧縮でもあって、便利なフォーマットです。

一般に、ロゴマークや Web ページのボタンなどのデザインによく使われています。例えば、このページの模式図などの画像はすべて GIF です。また、簡単なアニメーション GIF としては、Web の心得 (2) ロボット対策に実例があります。

ファイル拡張子はいずれも .gif です。

■６．PNG (ピング)

GIF には圧縮アルゴリズムの特許問題が出た時期がありました。そのため、GIF に変わる圧縮形式として開発されたのが PNG です。ウェブでの運用が前提で、かつ画像の劣化がない可逆性圧縮です。ただし、アニメーションはできません。

ファイル拡張子は .png です。

■７．その他の形式

画像を扱うアプリケーションには、それぞれ固有のファイル形式があります。フォトショップであれば PSD、イラストレーターであれば AI、パワーポイントであれば PPT です（注５）。また、一眼レフなどの高級カメラでは、RAWと呼ばれる非圧縮ファイルが使われていることも普通になってきました。従って、こうした画像を web 画像にしたい時には、JPEGや GIF に変換する作業が必要です。くわしくは、画像の入れ方 (2) サイズ編集へ。

注５）　イラストなどでは、線を表現するのに点の集まりではなく、ベクトルという概念で表現することが普通です。これは拡大や縮小しても線のクオリティに変化がない方式だからです。また、レイヤーといってひとつの画像を複数枚からなる画像の重ね合わせとする概念などもありますし、図の中に入れた文字の種類やサイズを画像情報とは別に保存することも必要になる場合があります。こうしたさまざまな情報を漏れなく保存するために、個々のアプリケーションでは固有の方式で保存しています。従って、編集をいつでもできるように、元ファイル（PSDファイルなど）を必ず残すようにします。

とびらへ

前へ　次へ

↑　トップへ