OWNED MEDIAウェブ制作に役立つコンテンツを発信中!

ビットマップ画像の種類と使い分け

最終更新日:2018.1.7 Update!!
パソコン上やwebで取り扱う画像データですが、いくつか種類があるのはご存知の方も多いと思います。同じ画像でもデータの種類によっていろんな特徴があり、画像の内容や用途など適材適所に使い分けることが大切です。   そこで今回のテーマですが画像フォーマットの種類についてまとめていきたいと思います。実は画像フォーマットにはたくさんの種類がありますが、web用として登場するものに焦点をあてて紹介していきます。  
ビットマップ画像とは
まずはじめに、主にwebで取り扱う画像は全てビットマップ画像と呼ばれる種類にあたります。ビットマップ画像は一つのピクセルが無数に集まって一つのイメージが作られています。モザイク状のタイル画などをイメージしてもらうと分かりやすいかもしれません。このビットマップ画像にはいくつかのフォーマットが存在します。 ビットマップ画像の種類と使い分け  
JPEG(ジェイペグ)
jpg   【Joint Photographic Experts Group】 非可逆圧縮形式の画像フォーマットデータで、一般的にウェブサイトなどでもよく使用されています。デジタルカメラの写真なども、この画像フォーマットであることが多いようです。表現できる色が多く色の階調のなめらかであるため、写真やCGイメージなどに適しています。またファイルサイズも相対的に小さくなるため、大きなサイズの画像はJPEG形式が適しています。  
GIF(ジフ、ギフ)
gif   【Graphics Interchange Format】 可逆圧縮形式の画像フォーマットデータで、上記のJPEGと同じくウェブサイトなどでよく使用されています。特徴としては、透過(完全な透明のみ)が表現できる点と、複数の画像を統合させてアニメーションのような動きのある画像(アニメーションGIF)を作ることができます。表現できる色は256色と限られていますが、データサイズが小さく使用する色が限定的なアイコンやボタンなどサイト内のパーツなどに適しています。  
PNG(ピング)
png   【Portable Network Graphics】 可逆圧縮形式の画像フォーマットデータで、近年になり普及が進んできました。高度な透過(半透明〜完全な透明)に対応し、色数も豊富で幅広い表現ができる点が特徴です。適しているのはやはり透過を生かしたデザインの画像です。しかし、データサイズが比較的大きいので多用すると重くなり、サイトの表示速度が遅くなるので注意が必要です。  
BMP(ビーエムピー)
bmp   【Microsoft Windows Bitmap Image】 圧縮がされていないWindows標準の画像フォーマットデータです。他の画像フォーマットと異なり圧縮がされていないデータ形式なので画質の劣化が無いというのが特徴です。しかし圧縮されていないためにデータ容量が非常に大きく、ウェブサイト内に使用するのは適していません。編集用の画像に使用するのが適した使い方だと言えます。  
TIFF(ティフ)
tiff   【Tagged Image File Format】 圧縮がされていない画像フォーマットデータです。こちらも他の画像フォーマットと異なり圧縮がされていないデータ形式なので画質の劣化が無いというのが特徴です。そして同じく圧縮されていないためにデータ容量が非常に大きく、さらにウェブサイト内で使用することができないフォーマットです。しかし画質の劣化がなく、画質も最も高いため編集用の画像としては最も適しています。       このように画像ファイルはそれぞれ異なる特性を持っています。必要とする用途や目的によって使い分けることでスマートで効率的なサイト制作を目指しましょう。    
  • はてなブックマーク
  • Pocket
  • Linkedin
  • Feedly

この記事を書いた人

Twitter

SPONSORED

    KEYWORD SEARCH

    RECENT POSTS

    合同会社デザインサプライ -DesignSupply. LLC-

    サイト制作・開発 / 各種デザイン制作 / ウェブプロモーション企画

    合同会社デザインサプライ(DesignSupply. LLC)

    Office:大阪府大阪市天王寺区清水谷町3-22
    Email:info@designsupply-web.com
    • Twitter
    • Github
    CONTACT USSCROLL TO TOP
      • Facebook
      • Twitter
      • Github
      • Instagram