画像拡張子・ファイル形式の種類一覧!JPG・PNG・GIF等違いを比較


画像を保存する時、どのファイル形式を選べば良いか迷った経験はありませんか?それぞれのファイル形式や拡張子の違いを知らないと、JPGなどの有名な形式ばかりにしがちですが、ファイル形式ごとの違いを知って、様々なファイル形式を活用できると良いですよね。今回は、画像のファイル形式とその拡張子一覧などについてご紹介していきます。

画像のファイル形式・拡張子とは

まず、画像のファイル形式・拡張子とは何かをご説明します。

画像ファイル形式

画像ファイル形式とは、画像を保存するファイルの種類のことです。画像フォーマット、または画像ファイルフォーマットと言うこともあります。

画像拡張子

ファイル名の末尾の.(ドット/ピリオド)以降の部分を拡張子と言います。拡張子は、ファイルの種類を判別するために付けられるもので、たいてい英数字3文字で表されます。

拡張子は、「.html」、「.jpeg」などに見られるように、もともとは4文字で表記されていたのですが、Windows 95以前のMS-DOS(マイクロソフトが開発した16bitのOS)やWindows 3.1では、3文字以内で表記しなければならなかったため、今でも「.htm」、「.jpg」などと、3文字で表されることが多いです。

また、OS(オペレーティングシステム)は、画像拡張子によって画像ファイルをどのプログラムで開くかを決めます。

ベクター画像とビットマップ画像

画像の種類には、ベクター画像とビットマップ画像があります。

ベクター画像

ベクター画像に適しているイラスト

ベクター画像(Vector graphics)とは、画像の直線や曲線、色などをベクター計算という数式で描くものです。画像を拡大縮小しても、数式の値を変えながらその都度再描写するため、画質が劣化しません。

ベクター画像は、ロゴや文字、イラスト、図表などに最適です。逆に、風景などの複雑な画像には向いていません。ベクター画像を描ける代表的な画像編集ソフトとしては、AdobeのIllustrator(イラストレーター)があります。

ビットマップ画像

ビットマップ画像に適している風景の画像

ビットマップ画像(bitmap graphics)とは、正方形の点(ピクセル)の集合で構成された画像です。ベクター画像は点と点を結ぶ線が画像を構成するのに対し、ビットマップ画像はピクセルの塗りつぶしが画像を構成します。

画像を点状の画素の集合で描いているので、その画質は、解像度(一定の長さに存在する画素数の密度)で決まります。

そのため、画像を拡大すると、足りないピクセルを補完するため、曲線や斜め線の部分でギザギザ(ノイズ)が目立つようになります。ビットマップ画像は、グラデーション画像や、複雑な色の変化がある写真などに適しています。

ビットマップ系の画像編集ソフトとして有名なものに、AdobeのPhotoshop(フォトショップ)があります。ビットマップ画像は、ラスター画像と呼ばれることもありますが、両者は全く同じものという訳ではありません。

画像のファイル形式・拡張子一覧

JPG(Joint Photographic Experts Group)

デジタルカメラ

読み方 ジェイペグ
形式 ビットマップ
拡張子 .jpg/.jpeg/.JPG/.JPEG/.jpe/.jfif/.pjpeg/.pjp
用途 写真

【特徴】 データの容量が小さい/フルカラーなので色数の多い画像に最適/上書き保存で画質が損なわれる/圧縮率を指定できる/拡張子の数が多い

JPGとは、静止画像データの圧縮方式で、BMP、GIFの次に規格されました。JPGは、BMPでは容量が大きすぎ、GIFでは色の種類数が少なすぎることから、容量が小さく、色数も多いJPGが作られました。

データを整理して容量を小さくするGIFに対し、データを切り捨てることで容量を小さくするのがJPGです。JPGの圧縮は、まずブロック(8×8ピクセルの正方形)に分割し、画像の色変化の情報の中から、なくても人の目で見て違和感を感じないものを切り捨てることで行います。

圧縮率が高く、フルカラー(約1,677万色)の画像を扱えるため、デジカメ写真の保存に使用されることが多くあります。メリットは、容量が多い画像データを小さくできる点ですが、一方で不可逆圧縮を行うため、画質が劣化してしまうというデメリットもあります。

※不可逆圧縮とは、一部のデータをカットして圧縮する方法です。一度圧縮すると元には戻せません。

圧縮率は指定することができ、1/5~1/30の圧縮が可能です。JPGはビットマップ画像なので、急な色変化があるロゴやイラストには向きません。

PNG(Portable Network Graphics)

PNGのリスのイラスト

読み方 ピング
形式 ビットマップ
拡張子 .png
用途 イラスト・ロゴ

【特徴】 データを完全に復元できる/フルカラー/透過処理ができる/Web上で使える

PNGとは、WEB上で扱えるファイル形式です。PNGは、GIFが特許問題によって自由に利用できなくなった際、GIFに代替する画像ファイル形式として開発されました。

GIFのように透過機能を持ちながら、GIFのような256色の制限がないので、GIFの代替でありながらGIFよりも性能が高いと言われています。PNGという名前には、”PNG is Not GIF”という意味もあります。

1,677万色のフルカラー対応で、グラデーションや色数の多い画像に適しています。画質は綺麗ですが、JPGやGIFに比べるとデータ容量は大きいです。

PNGは、可逆性圧縮なので画質が劣化せず、データを復元する際には完全に元通りにすることができます。JPGだと上書き保存で画質が劣化するため、加工を繰り返す場合はPNGで保存すると良いです。

透過処理とは、ある色に透過色を指定することで、透明にすることができる処理のことです。背景などを透明にすることができます。

GIF(Graphics Interchange Format)

猫のGIFアニメーション

出典:iconka

読み方 ジフ/ギフ
形式 ビットマップ
拡張子 .gif
用途 イラスト・ロゴ・アイコン

【特徴】 データ容量が小さい/最大256色/透過処理ができる/アニメーションを作ることができる

GIFとは、容量が小さく、Webページでの表示スピードが早いファイル形式です。GIFは何度か規格が作り直されたため、「GIF87」、「GIF87a」、「GIF89a」の3種類の形式が存在します。

データの容量はとても小さく、アニメーションを作ることもできますが、不可逆圧縮なので画質は劣化してしまいます。かつて使用に特許料を求められた時期があり、使用者が激減したことがありましたが、現在では特許が失効しており、自由に使うことができます。

また、対応している色数は256色と制限があるため、多くの色数が必要な風景写真などには向きません。逆に、単色が多いロゴやイラストなどには向いています。色数が少ないため、フルカラーから圧縮すると元に戻すことができません。

SVG(Scalable Vector Graphics)

読み方 エスブイジー
形式 ベクター
拡張子 .svg/.svgz
用途 シンプルなイラスト・ロゴ

【特徴】  テキストデータ/アニメーションを作ることができる

SVGは、XML(eXtensible Markup Language:拡張可能なマークアップ言語)で記述する2次元のベクター画像のファイル形式です。

W3Cによって開発され、2001年にリリースされましたが、Internet ExplorerがSVGをサポートしていなかったことなどから、しばらくはあまり注目されませんでした。しかし、FireFoxやChromeなど、様々なブラウザーでのサポートが進み、現在ではよく使われるファイル形式となっています。

SVGは、画像でありながらマークアップ言語で記述されるテキストデータなので、テキストエディターで編集することができます。また、JavaScriptと併用すれば、アニメーションを作ることができるという特徴もあります。

保存形式は、SVGだけでなく、SVG圧縮(SVGZ)もあり、ファイルサイズを50~80%小さくすることができます。しかし、その場合はテキストエディターで編集することができなくなります。

SVGはベクター形式なので、イラストやロゴに向いてますが、複雑なイラストだとファイルサイズが大きくなってしまうので、あまりおすすめできません。

TIFF(Tagged Image File Format)

読み方 ティフ
形式 ビットマップ
拡張子 .tif/.tiff
用途 写真・大きな画像

【特徴】 高画質/容量が大きい/フルカラー/Web上では使えない

画像ファイルの先頭にタグを付けて、複数の画像をひとつのファイルとして保存(マルチページファイル)できる画像ファイル形式です。タグが付いているので、データの属性が分かります。

1986年、異なるOSやパソコンで画像ファイルを交換できるようにするため、MicrosoftとAldus(現Adobe Systems)によって開発された形式です。

可逆性圧縮のため、画質の劣化はありません。1,677万色のフルカラー対応で、色の制限は少ないですが、容量は大きいです。タグ機能をサポートしないグラフィックソフトでTIFF形式の画像ファイルを開くと、タグ情報が無視されたり、ファイルを開けなかったりすることもあります。

TIFFは、デジタルカメラの写真の記録などに使われることもありますが、容量がかなり大きくなるので、プロでなければJPGで十分かもしれません。ウェブでは扱えない形式なので、ブログなどにアップする場合にはJPGなどのファイル形式に変換する必要があります。

EPSF(Encapsulated PostScript File/Format)

読み方 イーピーエスエフ
形式 ベクター
拡張子 .EPS
用途 ロゴ・イラスト

【特徴】 フルカラー/Web上では使えない

EPSFは、Adobe Systemsが規格したポストスクリプト(ページ記述言語)をベースに開発されたファイル形式です。EPSファイルとも呼ばれます。EPSFでは、ベクター画像だけでなく、ビットマップ画像も保存できるようになっています。

PICT(QuickDraw Picture)

読み方 ピクト
形式 ビットマップ
拡張子 .pict
用途 画像を転送するための中間ファイル

【特徴】 フルカラー/Web上では使えない

PICTは、Mac OSの標準画像ファイル形式です。ビットマップ画像と簡単なベクター画像、テキストが混在しています。そのため、ベクター画像を描けるグラフィックソフトで保存したPICT形式の画像ファイルを、ビットマップ系グラフィックソフトでは、ビットマップ画像として開くことができます。

※Mac OS Xでは、標準画像ファイル形式としてPDFが採用されています。

BMP(Microsoft Windows Bitmap Image)

読み方 ビーエムピー/ビットマップ
形式 ビットマップ
拡張子 .bmp/.dib
用途 イラスト

【特徴】 フルカラー対応/高画質/容量が大きい/最も歴史ある画像ファイル形式/Web上では使えない

MS-DOSの時代からあるWindowsの標準静止画像ファイル形式です。1981年、IBMが開発した「IBM PC」に搭載するために作られたOSで、最も歴史あるファイル形式です。

BMPは基本的に無圧縮なので、画質は劣化しません。1,677万色のフルカラー対応で、高画質である一方、データの容量は大きいです。そのため、メール添付には適していません。

ICO

読み方 アイシーオー
形式 ビットマップ
拡張子 .ico
用途 アイコン

MicrosoftのWindowsでアイコンに使用されるファイル形式です。

ICNS

読み方 アイシーエヌエス
形式 ビットマップ
拡張子 .icns
用途 アイコン

ICNSは、AppleのMac OS Xでアイコンに使用されるファイル形式です。

最も画質が良い画像ファイル形式・拡張子は?

スマホで海と空を撮影する人の手

今回ご紹介した画像ファイル形式、拡張子を「画質の良さ」で比較すると、このようになります。
GIF<JPG<PNG<TIFF<BMP=PICT=EPSF=SVG
無圧縮のBMP・PICT・EPSF・SVGは最も画質が良い一方、容量が小さく、使える色に制限のあるGIFの画質はやはり劣ります。

画像ファイル形式、拡張子ごとに、画質やファイルサイズが違い、それぞれに適した用途があるので、ぜひ色々なファイル形式を使い分けてみてくださいね。

無料でホームページを作れる「ペライチ」

誰でも簡単にホームページ作成を!「ペライチ」

HTMLやCSSでお悩みなら簡単ホームページ作成サービス「ペライチ」におまかせください。
特別な知識は必要ありません。好みのテンプレートを選ぶだけで誰でも簡単にホームページを作ることが出来ます。
誰でも簡単にホームページ作成を!「ペライチ」

ホームページ大学編集長/フリーライター ウェブデザインや動物、美容、ダイエット等幅広いジャンルの記事を手掛ける。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする