ペコネット

ページの先頭へ
ページの先頭へ
ホーム > ページの制作(ディスプレイ) > 画像のファイル形式

さまざまな画像のファイル形式

HD画像が無圧縮だとファイルサイズは…どうなるか

    HDサイズ(1920ピクセル x 1080ピクセル:参考ページ)の
    フルカラー(24ビットカラー:参考ページ)画像の無圧縮データ量は?

  1. 1920 x 1080 = 2,073,600(ピクセル数)に、1ピクセルあたりフルカラー(24ビット)の情報量がある。
  2. 2,073,600ピクセル x 24ビット = 49,766,400ビット(全データ量)になる。8ビットで1バイトになるので24ビットは3バイトになる。
  3. 49,766,400ビット ÷ 8ビット = 6,220,800バイトになり、1メガバイトは1024キロバイト…1キロバイトは1024バイトなので
  4. 6,220,800バイト ÷ 1024 ÷ 1024 ≒ 5.93メガバイト

HDサイズの無圧縮画像のデータ量は、5.93MBになります。

サンプル画像

そのため、画像のデータを圧縮します。いくつかの方式や、特定の用途にさまざまなファイル形式があります。

さまざまなファイル形式

【JPEG】Joint Photographic Experts Group

拡張子 .jpg .jpeg

デファクトスタンダード

最も一般的な、画像ファイル形式で広く普及している。デジタルカメラで撮影した画像は、通常この形式で保存される。写真やグラデーションなどの画像に向いている。不可逆圧縮なので画質は劣化する。ブロックノイズやモスキートノイズを抑える為に圧縮率を変える事が出来る。透過処理は出来ない。

【GIF】Graphic Interchange Format

拡張子 .gif

透過処理やアニメーション表現が可能。扱える色数がインデックスカラー256色なので、写真などの画像には向いていない。ウェブ標準の画像形式でもあった。PNGに置き換わると思われたものの、SNSなどでアニメーションを見かける機会は少なくはない。可逆圧縮。

【PNG】Portable Network Graphics

拡張子 .png

圧縮による、画質劣化のない可逆圧縮のファイル形式。WWWに関する標準化団体「W3C」によっても推奨されウェブで普及した。透過処理も可能。標準的な使用にはPNG-8(インデックスカラー256色)とPNG-24(フルカラー)がある。

フルカラーのアニメーションに対応したAPNGという形式もある。

【BMP】Microsoft Windows Bitmap Image

拡張子 .bmp

ビットマップという呼称は画像データの表現方式のひとつ(JPEGもPNGもビットマップ)であり、ウインドウズのビットマップ(.bmp)という呼称はマイクロソフト独自のファイル形式の事です。基本的には無圧縮で画像を保存しますので、容量は大きくなります。16色と256色の形式では、圧縮のオプションが選択出来る。

【SVG】Scalable Vector Graphics

拡張子 .svg

ベクターイメージの為、拡大などで描画の劣化がおきない画像ファイル形式。xmlで記述されているのでテキストファイルでの編集が出来てJavaScriptなどとの連携も可能。地図のような画像に向いてる。WWWに関する標準化団体「W3C」によって、仕様が開発され、ウェブで広く使われている。

【RAW】Raw Image format

拡張子 .dng

デジタルカメラや、イメージスキャナなどにおける未現像のデータで、撮像素子から入力された電気信号をそのままデジタル変換したものです。従って画像変換されていませんので保存しただけでは表示する事が出来ません。Adobe Lightroomなどの現像ソフトで画像データとして扱い、圧縮ノイズのない高画質な画像が得られる。

新しめの画像のファイル形式

【WebP ウェッピー】

拡張子 .webp

    Googleが開発しているオープンな画像ファイル形式。「ウェッピー」と読み、表示速度短縮などを目的としている。アニメーションも可能。

  • 対応OS:android(4.0以降)
    windows10(Creators Update以降)
    macOS(BigSur以降)
    iOS(14以降)
  • 対応ブラウザ:Chrome、Firefox、Edge、Safari、Opera

【AVIF】AV1 Image File Format

拡張子 .avif

    NetfilixやAmazon、Microsoft、Googleなどが共同で立ち上げた非営利団体Alliance for Open Mediaにより開発された高画質・高圧縮な形式。アニメーションも可能。

  • 対応OS:iOS(16以降)
  • 対応ブラウザ:Chrome、Firefox、Opera

【HEIF】High Efficiency Image Format

拡張子 .heif .heic

    MPEGにより開発されたJPEGより高画質・高圧縮な形式。iPhoneにおいてはiOS11以降、標準の画像ファイル形式となる。アニメーションも可能。

  • 対応OS:macOS、iOS
  • 対応ブラウザ:Safari

【JPEG 2000】

拡張子 .jp2

    JPEGの後継ファイル形式。

  • 対応OS:macOS、iOS、Linux
  • 対応ブラウザ:Safari

【JPEG XR】

拡張子 .hdr

    HD Photo(Windows Media Photo)を元に規格化された画像ファイル形式。

  • 対応OS:Windows、macOS、Linux
  • 対応ブラウザ:Edge Legacy、IE11