PCでのお仕事をしているとデザイナーに限らず画像ファイルを扱うことがあるのではないでしょうか。画像ファイルは視覚的に見ている方にイメージを伝えてくれる要素です。そんな画像ファイルもPNG、JPEGといった様々な形式があります。
今回は画像ファイルの形式の種類、それぞれの特徴を解説していきます。何気なく使っている画像ファイルについて理解を深めていきましょう！
画像の種類と特徴
画像には
- ビットマップデータ形式
- ベクターデータ形式
の2つの形式が存在しさらに拡張子に種類分けされています。
形式と拡張子それぞれの特徴をご紹介していきます。
ビットマップデータ形式
ビットマップデータ形式の特徴として
- ピクセルの概念で正方形の点が集合して構成されたもの
- 拡大すると見た目が荒くなる
- 写真など細かな色合いやグラデーションを表現する際に向いている
といったことが言えるでしょう。
種類としては
- JPEG
- GIF
- PNG
- WebP
があります。JPEG、GIF、PNGは知っているという方は多いのではないでしょうか。それではそれぞれの特徴を解説していきましょう！
JPEG
JPEGは色鮮やかな色数の多い写真に最適な画像ファイルです。特徴として
長所・・・PNGファイルに比べ、ファイルサイズが小さく圧縮処理をする際には比率を指定可能
短所・・・上書き保存を繰り返すと画質が落ち、画質を1度下げると元に戻せない
があります。
GIF
GIFは図形、アイコン、ロゴ、アニメーションとして利用したい場合に最適な画像ファイルです。特徴として
長所・・・ファイルサイズが軽く、透過とアニメーション設定が可能
短所・・・256色までしか表現できず、高精細なディスプレイでの閲覧で劣化しやすい
があります。
PNG
PNGは色数の多い写真や透過をさせたい画像に最適です。特徴として
長所・・・透過とアニメーション設定が可能であり、256色で表現するPNG-8とフルカラーで表現できるPNG-24がある
短所・・・JPEGに比べ、ファイルサイズが大きい
があります。
WebP
WebPは色数の多い写真や透過をさせたい画像に最適です。特徴として
長所・・・透過とアニメーション設定が可能であり、同じ質のPNG、JPGに比べファイルサイズが小さい
短所・・・全てのブラウザに対応していない
があります。
ベクターデータ形式
ベクターデータ形式の特徴として
- 点の座標や結ぶ線などの数式データで構成されているもの
- 拡大しても綺麗なままを保持する
- 線や面を扱うイラストやアイコン、テキストを表現する際に向いている
といったことが言えます。
種類としては
- SVG
があります。それでは特徴を解説していきましょう！
SVG
SVGはロゴ、アイコン、図形、アニメーションとしたい画像に最適です。特徴として
長所・・・アニメーションを設定でき、拡大しても荒くならないため高精細ディスプレイに向いている
短所・・・複雑な形状の画像だとファイルサイズが重くなる
があります。
まとめ
今回は、画像ファイルの種類・特徴を解説してきました。普段何気に使っている画像ファイルにも長所と短所があります。画像ファイルの特徴を把握してファイル形式を使い分けてみてくださいね！最後までお読みいただきありがとうございました！
