JPEG、PNG、GIFって何が違うの？今さら人には聞けない各ファイルの意味を解説します。

今回のテーマは画像ファイルの種類についてです。

アフィリエイトをしていると、写真、画像を扱う場面も多くなっていきます。アイキャッチ画像や記事中に掲載する画像、また文字だけでは表現しきれない部分（図解など）を画像によって補うということもあります。アフィリエイターとしてのレベルを上げたいなら、画像の使い方のレベルも上げないといけません。

画像に対する知識もいつまでも初心者ではダメで、少しずつ知識を蓄えていく必要があります。

さて、そんな画像ですが、よく見かける画像がこの3種類です。

1. JPEG
2. PNG
3. GIF

画像にもいくつか種類があり、それぞれ特徴があります。そこで今回の記事では、画像の中でも頻繁に使われている「JPEG」「PNG」「GIF」について解説していきたいと思います。画像を扱うための基礎的な話です。是非、参考にしてみてください。

疑問…なぜ画像にはいくつも種類があるのか？

なぜ、画像の形式にはいくつも種類があるのか？

結論はこちら。

JPEG、PNG、GIFの3つは、全ての主要ブラウザで表示できるので、初心者から見るとどれも同じに感じます。ただ厳密に言うと、JPEG、PNG、GIFそれぞれで特徴や専門分野が違うのです。

大切なことは画像の特徴にあった拡張子を選ぶことです。

では、順番に解説していきましょう。

JPEG (Joint Photograph Experts Group）って何なの？

JPEGとは「Joint Photographic Experts Group」という組織の頭文字を取ったものです（これは覚えなくてもいいです）。静止画像データの圧縮方式の一種で、企画を規定した組織の略称が、形式名として使用されています。

JPEGの特徴は圧縮率が高いことです。そのため、フルカラー（約1,677万色）の画像を扱えるため、多くの色数を必要とするデジカメなどの写真を記録する時に使われることが多いですね。他にはグラデーションのように色調が連続して変化するような画像にはJPEGが向いています。

こんな画像はJPEG向きです。

反対にJPEGはアイコンやアニメなどの平坦なイラストには向いていません。これらをJPEGで保存するとにじんだようになり、汚く見えてしまいます。シンプルで色数が少ない場合は、JPEGを使うメリットは少ないということを覚えておいて下さい。

JPEGの特徴1：拡張子がいくつもある

JPEGでは、いくつもの拡張子が存在します。

有名なものは「.jpg」や「.jpeg」などですね。他にも「.jpe」「.jfjf」「.pjpeg」「.pjp」などの拡張子もありますが、全て同じものと解釈して問題ありません。

基本的にはメジャーな「.jpg」や「.jpeg」を使うのが良いと思います。昔は、拡張子は3文字までという制約があったので、その流れで現在でも拡張子を3文字で表記する習慣が残っています。ですから「.jpg」を使用することが多いようです。

またWindowsでは大文字と小文字が区別されません。ですからabc.jpgとabc.JPGも同じものとして認識されます。ただUNIX上では大文字と小文字が区別されるので注意が必要です。ほとんどの方がWindowsかMacだと思うので大きな問題はないかと思います。

JPEGの特徴2：上書き保存で画質が劣化してしまう

JPEGで注意しなければいけないことがあります。

それがJPEGで加工した画像は、上書き保存すると画質が劣化することがあるということです。JPEGは非可逆圧縮（不可逆圧縮）を行うため、画質が劣化してしまうんですね。

非可逆圧縮とは、圧縮前のデータと圧縮後のデータが完全に一致しない圧縮方式のことです。先ほど、色調データの一部を捨てることで圧縮していると説明しましたが、すでにデータの一部を捨てているため、一度圧縮すると元には戻せないということですね。

容量が多い画像データを小さくできるのがメリットですが、圧縮の際に一部のデータを切り捨てるため画質が劣化してしまうのがデメリットになります。

画像を開いたり、画像のコピーを作成したりする時には劣化は起こらないのですが、画像加工ソフトで開き「上書き保存」や「別名で保存」を行う時に、圧縮処理が行われて画質が劣化してしまいます。JPEGではどれだけ低圧縮に設定しても多少の劣化は避けられません。事前の内容量と画質のバランスを見ながら、圧縮比を考えて作業する必要があります。

これを知らずに保存の数を繰り返すと、目に見えて劣化が分かるようになります。数回の保存では劣化は目立ちませんが、画像加工ソフトを使う際は注意した方がいいでしょう。

GIF（Graphics Interchange Format）とは

GIFは「Graphics Interchange Format」の頭文字を取られています。インターネット回線の普及範囲が今ほど大きくなかった時代に、できるだけ容量を減らしつつWebページにも表示できるように開発された画像フォーマットがGIFです。

一時期使用に特許料が要求されたため、使用が激減されたという経緯があります。その特許料の問題が出た時に、PNGが開発されたという流れがあるようです。

GIFの特徴1：データ容量が小さく軽い

GIFは色数が256色までと少ないですし、独自の圧縮アルゴリズムを使っているので、データ容量が非常に小さいのが特徴です。さらにWebページとの親和性を高くする設計になっていますから、読み込み負荷が少なくなっています。

GIFで使われている独自の圧縮アルゴリズムは「LZW」と呼ばれ、PNGのランレングス圧縮をさらに効率化した圧縮方法となっています。

GIFは色数に制限がありますので、写真や多彩な色を使うフルカラーなどが苦手です。風景写真をGIFで保存するとわかりますが、色味の汚い画像が出来上がります（違いがわかるので是非試してみて下さい）。なので写真や色あざやかな画像、グラーデーションなどはGIF保存は避けた方がいいでしょう。

反対に強いのがロゴやイラストです。こんな画像がGIFの得意分野です。

データ容量も少ないですから、Webページでよく使われているボタンや背景、枠などは、GIF画像で作ると軽くなって便利です。

GIFの特徴2：透過処理ができる

一部のGIF形式は、透過をサポートしているので、透過処理を行うことができます。ただ、PNGと異なる点は「完全な透過」か「不透明」の2段階のみサポートされています。つまり半透明にはできないということですね。また透過色の指定は1つのみです。

GIFの特徴3：アニメーションを作れる

GIFがよく使われる理由として「アニメーションを作れる」というのがあります。GIFはいくつかの画像を組み合わせてアニメーション（パラパラ漫画）のように見せることができます。ただ、色数は256色までですから、本格的なアニメーションのようなクオリティにはなりません。簡単なアニメーションで視覚的に目立たせる時には、GIFがオススメと言えるでしょう。

PNG（Portable Network Graphics）とは

PNGとは「Portable Network Graphics」の頭文字を取られています。Webでビットマップ画像を扱うファイルフォーマットとして開発されたのがPNGです。

元々はPNGより前にGIFが使われていたのですが、GIFは特許使用の解釈に不安があったため、GIFに替わるライセンスフリーの画像形式としてPNGが開発されました。

PNGの特徴1：データを完全に復元できる

上で紹介したJPEGとは違い、PNGは可逆性圧縮と言われる方法で行われます。そのためデータを復元したい時に、完全に元に戻すことができます。

例えば「青青青青青赤赤赤白白白白白」というデータがあったとします。このままだと13文字の容量です。しかし「青5赤3白5」と表現すると6文字分の削減になります。これがPNG形式の圧縮方法なのです。ランレングス圧縮と言われています。

この方法の場合「青5赤3白5」を「青青青青青赤赤赤白白白白白」に復元することができるわけですね。ただJPEGのようにデータを切り捨てる圧縮方法とは異なり、容量が数倍大きくなってしまうのがデメリットです。他にも「アニメーションにできない」「フルカラーにするとJPEGよりファイルサイズが大きくなる」と言ったデメリットもあります。

特に写真画像の場合は、見た目は変わらなくてもJPEGと比べるとファイルサイズが何倍にもなってしまいます。そのような場合には、PNGはオススメできません（シンプルな画像の場合はJPEGよりもファイルサイズが小さくなることもあります）。

ファイルサイズが大きくなってしまうということは、ページ表示速度も遅くなりますから、ユーザーへのストレスにも繋がります。SEOのことを考えると容量の大きすぎる画像を使うのは避けた方がいいのです。PNGは比較的新しく開発された優れた画像形式ではありますが、すべての面でPNGが良いかというと、そういうことでもありません。

画像の内容やサイズに応じて、JPEG、PNG、GIFを使い分けていくのがベストですね。

PNGの特徴2：透過処理ができる

他にもPNGの特徴として挙げられるのが、画像の透過処理ができるということです。簡単に言うと、背景を透明にできるということですね。透明だけではなく半透明にすることもできるので、この辺りは非常に使い勝手が良いと思います。

PNGが得意なのは透過処理

こんなイメージで透明で処理が出来るので、背景を変えたい時、合成したい時に大活躍です。

また加工を繰り返す画像は、JPEGだと劣化が進んでしまいますから、PNGでの保存が望ましいですね。

まとめ

いかがでしたか？簡単にまとめると、

• JPEG：写真やグラデーションが得意
• GIF：イラスト・図形・色数が少ない画像が得意
• PNG：透過処理・半透明処理が可能・フルカラーが得意

です。

一言で「画像」と言っても、このように形式が分かれていることに驚きますね。今までJPEG、PNG、GIFはなんとなくその場の流れで使っていたという方も中にはいるはずです。それぞれ特徴があるので適材適所で使い分けていくことをオススメします。