見出し画像

知ってたら得する！画像ファイルの見分け方

haribo

はじめに


こんにちは！
今週の投稿は画像ファイルについて特集します😺

私自身、研修を受けるまで画像の画質やデータ量なんて気にしたことがありませんでした。大学時代にプレゼン資料を作っていた時、画像の背景が中々透過されずに編集に手こずったときや、画像のデータ容量が大きく、スライドに貼り付けられなかったときなど、思い返してみれば、訳も分からないまま画像に不便さを印象付けていた気がします。

しかし、研修を経て、画像ファイルの種類とその特徴を知っているだけで、状況に応じた効率的な画像の使い方ができることを知りました！
もっと早く知っておけばよかったと後悔したので、忘れないように投稿します😃

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

・画像ファイル
皆さんが撮影した写真や検索して保存した画像をどのように保存するか表したものです。例として、「JPEG」「PNG」「GIF」「TIFF」などがあります。

・拡張子
どんな画像ファイル形式なのかを表したものです。例として「.jpg」「.mp3」「.html」などがあります。
（わかりやすく示すとするならば、画像ファイルの「.(ピリオド)」以下の部分）

画像ファイル形式の種類

画像ファイルにはどのような種類があり、メリットデメリットにどんな違いがあるのか、一つずつ説明していきます。たくさん種類があるので今回は特に利用されている「JPEG」「PNG」「GIF」「TIFF」を紹介していきますね！

JPEG（ジェイペグ）

「Joint Photographic Experts Group」の略
拡張子は「 .jpg (.jpeg) 」
もっとも標準的な画像ファイル形式として知られおり、もっとも流通している画像ファイル形式です。

メリット

  • データ量が大きな画像を小さなファイルサイズにできる。　　

  • フルカラー1670万色に対応。グラデーションなどの繊細な色の変化を美しく表現できる。

デメリット

  • 一度画像を圧縮すると元に戻せず、保存を繰り返すたびに徐々に画質が老化する。（元に戻せない圧縮方式は非可逆的圧縮方式と呼ばれる）

  • 画像の透過ができない。

PNG（ピング）

「Portable Network Graphics」の略
拡張子は「.png」
WEBで使用するために開発された画像ファイル形式です。

メリット

  • フルカラー280兆を超える色数に対応。グラデーションなどの繊細な色の変化を美しく表現できる。JPEG以上の色彩表現が可能。

  • 画像の透過が可能。画像を半透明にして透かして表現ができる。

  • 画像を圧縮しても画質が老化しない。（復元可能な圧縮方式は可逆圧縮方式と呼ばれる）

デメリット

  • 画質が老化しない代わりに、データ容量が多くなり、ファイルサイズも大きくなりやすい。

GIF（ジフ）

Graphics Interchange Formatの略
拡張子は「.gif」
ロゴやアイコン、ボタンなどの簡易的なイラストに適した画像ファイルです。

メリット

  • 画像を圧縮しても画質が老化しない。（可逆圧縮方式）

  • 簡単なアニメーション画像の作成が可能。

  • 画像の透過が可能。（半透明は表現できない）

デメリット

  • 最大256色で表現されるため、色数の多い画像やグラデーションに不向き。

TIFF（ティフ）

Tagged Image File Formatの略
拡張子は「.tif（.tiff）」
解像度を必要とする画像に使われることが多い画像ファイルです。

メリット

  • フルカラー1670万色に対応。

  • データ容量が大きい。

  • 画像を圧縮しても画質が老化しない。（可逆圧縮方式）

デメリット

  • 高解像度を必要とする画像はデータ量が大きくなる。

  • Web非対応。

まとめ

ここまで画像ファイルの種類について説明してきました。画像ファイルによってメリットデメリットが全然違いますよね🤨
ザっと表にしてまとめてみました！

結論としてweb上でどのような場合にどの画像ファイルを使えばいいのか例を挙げて簡単に考えてみると・・

大きくこんな感じの見分け方がよいかなと思いました！
もちろん状況によってファイルの大きさや画像の色数も変わってくると思うので、もしファイルが大きければサイズを小さくできるJPEGを選んだり、繊細な色を表現したいと思ったら280兆の色数に対応しているPNGを選んだりと、状況に応じて画像ファイルを利用していくのが良いと思います！

Webディレクターの仕事に限らず、多くの場面で知っていたら役に立ちそうな知識ですよね！「JPEG」「PNG」「GIF」「TIFF」だけでなく、ほかにも多くの画像ファイル形式があるので、その特徴の知識を入れるとともに状況によって使い分けられるようになりたいです😺❗








この記事が気に入ったらサポートをしてみませんか？