takkネットの3大画像フォーマットである「JPG・GIF・PNG」。mini」や「TinyPNG」といったサービスも浸透してきましたが、WEBデザイナーさん以外には、中々使いこなせないサービスかなとも思います。本記事では、各画像フォーマットの使いドコロのおさらいと、ワードプレスに画像をアップした場合に自動作成される縮小画像との関連などをまとめてみました。簡単にまとめてみます。厳密な仕様はwikiを御覧ください。jpegじぇいぺぐ大体オールマイティにカバーできる圧縮してファイルサイズを小さくできる圧縮すると厳密に元通りにならない(劣化する)gifじふアニメGIFで簡単な動画再生ができるアニメGIF使わないならpngがいい256色までしか使えないpngぴんぐ自然な透過=アルファチャンネルが使える圧縮しても劣化しないのでイラストなどに向く写真の圧縮はjpgよりかなり巨大になる私の使い分け法アニメーションGIFまずgifはアニメーションGIFが使いたい場合のみ。次にpngですが、圧縮しても劣化しないのでイラストやグラデなどのjpgだと劣化が目立つ場合に。あとアルファチャンネルを使いたい場合も頻繁にあります。当ブログ右上の丸いトップに戻る画像など。それ以外の場所は全てjpg。通常のWEBサイトであれば、殆どの箇所でjpgを使うことになります。jpgの圧縮率ですが、大きな画像はその都度調整してファイルサイズを稼ぎます。小さな画像は面倒なので一定値で圧縮しています。ファイルサイズを小さくするクセを画像はHTMLやJavaScriptのテキストファイルに比べると遥かにサイズが巨大です。サイトが重くなる主要な原因になるので、いつも画像がコンパクトになるクセをつけておきましょう。小さくトップページなどで大きな画像を使う場合は、下のサービスでさらにサイズダウンしましょう。比較的最近になって登場したサービスですが、ファイルによっては見た目はほぼ変わらずにサイズは半減したりするので、かなり強力です。サイトで使っている全ての画像に対して行うのは作業コスト的にも負担が大きいので、巨大な画像や、ヘッダーやメニューなど出現頻度が高い画像に利用するのが効果的です。Minimizer上記サイトでサイズダウンしたPNG画像は、アルファチャンネルも保持されますが、PhotoShopで開き直すと正常に読み込まれない場合があるので、現状ではオリジナルを保存しておく必要があります。ワードプレスでの画像の扱いワードプレスの「メディアを追加」ボタンから画像を追加すると、自動的に縮小画像が作成されます。実際にブログに貼られる画像は「フルサイズ」を選択しない限り、この縮小画像です。1.4M自動的に4つの縮小画像が作成されます。miniで圧縮した画像をアップロードしたらどうなるか。miniで元画像をダウンサイズすると3分の1ほどになります。476kbしかし、これをワードプレスにアップロードして作成される縮小画像のファイルサイズは、オリジナルの時とほぼ同じです。miniなどでサイズダウンしても、ワードプレスの縮小画像を使うなら無意味という事になります。miniを使うほどではないと思います。