

画像の拡張子の違いがわからない
そもそも保存形式ってなに?

Webで使われているのは主に3種類だけ
特徴を知れば使い分けができるよ
本記事の内容
- 拡張子のメリットとデメリット
- 特徴を知って使い分ける
こんにちは、リド(@Lido_blog)です。
前職のデザイナーを経て、現在はブログ運営をしています。
ブログで使用する画像について悩みを解消しましょう。
本記事は「ブログで使用する画像の保存形式と拡張子の特徴」について解説します。
ブログで使う画像の拡張子はこれで悩まない!

結論、
ブログで使用する拡張子は「JPG」
これでOKです。
保存形式には特徴があり、
まずは拡張子の違いについて知りましょう。
ファイルの拡張子の特徴とは?

拡張子とはファイルの保存形式のこと。
画像には「名前.jpg」の「.jpg」の部分が拡張子にあたります。
保存形式にはさまざまな種類がありますが、用途で使い分けることが大切です。
それぞれのメリットとデメリットを理解して使用しましょう。
Web上で使用される形式は主にJPG、PNG、GIFの3種類です。

たった3つだけなので、特徴と使い方をマスターしよう
【 保存形式1 】JPG : ジェイペグ
「JPG」「JPEG」は同じ保存形式です。
主に画像や写真に使用されます。

カメラで撮った写真でよく見る保存形式だね
メリット
- 約1677万色表現できる
- グラデーションが綺麗
- 高画質で容量が小さい
- 圧縮率が調整できる
デメリット
- 保存を繰り返すたびに劣化する
- 圧縮するごとに劣化する
- 透過できない

保存による画像の劣化に気をつけて

編集の仕方や保存するタイミングが大切
【 保存形式2 】PNG : ピーエヌジー、ピング
PNGはweb用に作られた拡張子。
GIFの進化版として新しく開発されました。

写真の切り抜きはPNGだね
実はpngの中には「PNG-8」と「PNG-24」があります。
PNG-8は8bitで256色
PNG-24は24bit1670万色
色数の違いがあります。
メリット
- 最大約1670万色表現できる
- 透過、非透過が可能
- 圧縮から元の画質に復元可能
デメリット
- 保存容量が大きい
- CMYK(紙用の色設定)には非対応
- 印刷に不向き

綺麗な画像だけど容量が重いのが難点

透過、切り抜き画像のみ使おう
【 保存形式3 】GIF: ジフ
簡単な動画制作に向いています。
TwitterのGIF動画などが有名ですね。
「GIF」と「PNG-8」は同じ256色。
画像としては、ほぼ同じ性質を持っています。

自作のGIFアニメを見かけるね
メリット
- 簡単が動画ができる
- 透過や非透過が可能
- 比較的軽い
デメリット
- 最大256色しか対応していない
- 色数が多い画像は向かない

アニメーションが特徴だね

レビュー記事でGIF動画を使用するとわかりやすいかも
保存形式の適切な用途は?
メリットとデメリットを踏まえた上で適切な用途を解説します。
多くのサイトを見渡すと画像は「PNG」か「JPG」の2種類が使われています。
「GIF」は動画以外ではあまり見ることがなくなりました。
「JPG」は写真画像やイラスト
「PNG」は透過するロゴなどの装飾的な画像
「GIF」は短い動画
ファイルの保存形式によって「得意・不得意」があるので、使い分けられると良いでしょう。

必要に応じて拡張子を変えよう
ブログで使用する拡張子は?

透過する画像ではない場合、高画質で容量が小さいJPGがおすすめです!
しかし、上書き保存を繰り返すと劣化するデメリットもあるので扱いには気をつけよう。
ブログでは画像を使用するので、JPG一択でしょう。
使用用途に応じて使い分けることで無駄な容量を減らし、ブログ自体を軽くなればユーザーに心地よい体験を提供することができます。

見直してみよう!
では、今日はここで終わります。
コメント