2018年05月10日

画像ファイル形式の種類と特徴について

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

インターネットやパソコン上で扱う「画像」には、様々な形式があるのをご存知でしょうか?
どの形式を選んでもある程度主要ブラウザで表示することはできますが、それぞれに特徴があり、用途によって使い分ける必要があります。

今回は、ウェブサイト制作でよく使われる主な画像ファイル形式とその特徴についてご紹介します。

p40.jpg

画像の形式の見分け方

画像の形式は「拡張子」と呼ばれる記号で見分けることができます。

拡張子とはファイルの種類を識別するためにファイルの名前(ファイル名)の末尾につけられる文字列のことです。
例えば、「.jpg」や「.png」などがあり、そのファイルがどんな形式のデータであるかを表しています。

画像ファイル形式の種類

JPEG

JPEGとは?
JPEG(Joint Photographic Experts Group)は、静止画像のデジタルデータを圧縮する方式のひとつです。拡張子は「.jpg(.jpeg)」。
圧縮率が高く、フルカラー(1,677万色)の画像を扱うことができるので、風景写真など色合いにグラデーションがある画像に適しているファイル形式です。

JPEGは写真に適した画像形式です。人間の肉眼では見えない情報などを大幅にカットした状態で、情報量を圧縮して保存しています。容量が多い画像データをとても小さくできるのがJPEGのメリットです。

デメリットとしては、「非可逆圧縮」を行うため画質が劣化してしまうことです。「非可逆圧縮」とは、一度圧縮すると元には戻せない方法のことです。圧縮の際に一部のデータを切り捨ててしまうため、画質が劣化してしまうので注意しましょう。

PNG

PNGとは?
PNG(Portable Network Graphics)は、ウェブでビットマップ画像を扱うファイルフォーマットです。拡張子は「.png」。
8bit(PNG-8)と24bit(PNG-24)を選択することができます。8bitの場合はGIFと同様に256色でのグラフィックス表示に適した保存ができ、24bitの場合はフルカラーの写真が保存できるほか、透過色を持たせることができます。

JPEGと異なり、保存を繰り返しても画質は劣化しません。また、透過も可能で、画像の透明度を自由に設定できます。
フルカラーで保存したい場合は、JPEGよりも画像サイズは大きくなってしまうため、あまりにも大きい場合はJPEG形式で保存することをオススメします。

イラストやロゴなどの保存はJPEGだと圧縮ノイズが目立ってしまうため、PNGの方が適しています。また、加工を繰り返す画像はJPEGだと劣化が進んでしまうため、こちらもPNGでの保存をオススメします。

GIF

GIFとは?
GIF(Graphics Interchange Format)は、インターネット回線の帯域がまだ現在ほど大きくなかった時代に、容量をできるだけ減らし、かつウェブページによる表示もできるように開発された画像フォーマットです。拡張子は「.gif」。
一時期使用に特許料が要求されたために使用が激減しましたが、このときにPNGが開発された経緯があります。

フルカラーのJPEGとは異なり、最大256色の限られた色数で構成される可逆圧縮形式の画像です。そのため、適した用途は256色以下の色で構成される画像、例えばロゴ、アイコン、ボタン、図版、イラストなどで、2次元の画像に適した形式です。
GIFにも透過機能があり、PNGのように調節はできませんが、指定した色を完全に透過することができます。ロゴやボタンなど背景が不要な画像によく利用されます。

JPEGにない特徴として、背景を透明にした画像を実現できたり、動きをつけたアニメーション画像なども表現することができるため、ちょっとした短い動画はGIF形式で保存されるケースが多くあります。

まとめ

写真などではあまり意識せずに保存することが多い画像データですが、ウェブ制作となるとそれぞれの特徴を理解して用途によって使い分ける必要があります。また、画像の形式は上記3種類以外にもあるので、目的に応じて自分なりに試してみるのもいいかもしれません。

特徴をよく理解し、最適な使い方をしていくことで、ウェブサイトに載せている画像の見栄えがさらによくなるのはもちろん、不必要に大きなデータを使わないことで、読み込み速度をアップさせることにもつながります。

お問い合わせ

【受付時間】平日 9:00~18:00(夏季休暇・年末年始を除く)

1営業日以内にご返信いたします