サイトに使用する画像で必ずで来るものとして、
.jpg、.png、.gif これらの拡張子の画像が挙げられます。
アニメーションだとsvgがありますが、
代表的な上記３種類についてご紹介いたします。
.jpg画像の特徴
写真などの豊富な色数が必要な要素にはJPEGが適しています。
画像編集ツールにより適切な圧縮画像を書き出すことができますが、
加工して保存する度に画質が落ちていくというデメリットがあります。
JPEG画像の質を間引くことでサイズを小さくしているという理由があります。
そのため、
元画像にはこの形式は用いず、
WEBコンテンツ用として書き出すのが一般的な利用方法です。
.png画像の特徴
透過したい箇所がある場合や、劣化させたくない画像素材の保管に適しています。
JPEGの場合、
透過させた部分は白くなって保存されますが、.pngの場合はそのまま透明で使用できるので、
サイトの要素と重ねたりなどの表現にも使い回しがききます。
.gif画像の特徴
GIFアニメという言葉もかなり聞き覚えがある方もいると思いますが、
GIFは情報通信向けに作られた画像形式とのこと。
WEBコンテンツで利用できる色数はGIFの場合２１６色程度とされています。
まとめ
素材画像として残しておきたいのが.png
編集して書き出す際に、.jpgや.gifにすれば、
また違う加工をしたいというときにpngを使って画像を劣化させずに加工することができる。
加工したものはWEBコンテンツに合わせて利用する。
