画像形式

ネット上で使用出来る画像は

  • Jpeg(Joint Photograph Experts Group)
  • GIF(Graphocs INterchange Format)
  • PNG(Portable Network Graphics

Webで使用する画像は最終的に四角いビットマップデータとして書き出す

それぞれの特徴

    • 圧縮方法
    • 透過
    • 扱う色数

JPEG

  • 圧縮
    • 元に戻せない
  • 透過
    • なし
  • 色数
    • 1670万色 24ビット

ほか
写真など色数の多いものに適している
アイコンやアニメの平坦な画像をJPG保存すると、にじんだように汚くなる

GIF

  • 圧縮
    • 元に戻せる
  • 透過
    • 透明色を1色指定できる
  • 色数
    • 256色 8ビット

ほか
アニメーションにできる
アイコンやボタンに適している
グラデーションや、写真の表現には色数が足りなすぎる

GIFのファイルサイズを小さくする

  • 色数を減らす
  • 水平方向に同じ色が連続するように、1ピクセル単位で画像を修正する
    1. 画像の面積を小さくする
    2. 使用する色数を減らす
    3. 使用する色数がおなじでも、各単色面の面積が大きくなるようにする
    4. できるだけ水平方向に同じ色のピクセルが連続するようにする
    5. GIF画像は1ピクセル単位で制作・修正するものだと覚悟する

PNG

  • 圧縮
    • 元に戻せる
  • 透過
    • 複数の透過色
  • 色数
    • 8bitと24bit両方可能

ほか
フルカラーのファイルサイズはJPGより大きい
アニメーションは不可
ブラウザの対応は完全ではない・・・が対応は出来る