BomBox

WordPressでのブログ運営のノウハウやWeb開発、IT関連の情報を発信

アーカイブ

【検証】TinyPNGで画像はどこまで圧縮できるのか?

2016/10/10


アーカイブ

画像を圧縮してファイルサイズを小さくしてくれる「画像圧縮ツール」。その代表格として、TinyPNGというものがあります。TinyPNGはPNG, JPEG画像の必要の無い処理部分を切り取って全体的なファイルサイズを小さくするものです。

今回はそのTinyPNGを使って、画像はおよそどのくらいまで圧縮できるのかを検証してみたいと思います。

スポンサーリンク

検証方法

TinyPNGは圧縮したパーセンテージ(圧縮率)を出力してくれます。この圧縮率の数値を記録してゆくことで、どこまで圧縮できるのかの推移の表を作成することができます。

今回の検証ではTinyPNGで以下の1.5MBの画像を使用します。圧縮を行う回数は10回です。圧縮した画像を圧縮するとどこまでサイズを小さくできるか、という実験です。

検証に使用する画像は以下のものになります。tpsdaveさん、ありがとうございました。

検証開始!

1回目の計測結果

64%圧縮してくれました。サイズにして970KB削減されました。

TinyPNG 64% compressed

さすがに10回分を書くのは大変なので、1, 5, 10回目の計測結果を載せたいと思います。

5回目の計測結果

6%圧縮してくれました。だんだん減っていますね…。トータルでは29KBの削減です。

TinyPNG 6% compressed

ラスト10回目!

10回目です!3%の圧縮率、トータルで13KB削減してくれました。

TinyPNG 3% compressed

さて、気になるファイルサイズはというと…

総合計測結果・グラフ

最初の画像(1.5MB)

http://demowp.webcrow.jp/demo/before.jpg

10回の圧縮を行なった画像(454KB)

http://demowp.webcrow.jp/demo/after.jpg

表示速度に圧倒的な差があることがうかがえます。画像によっては1ケタ級KBまで圧縮できるかも。

まとめ

本当は80KBくらいまで行けると思っていたのですが、写真が写真だけにちょっと無理だったようです。イラストや色数がそこまで多くない画像だったら行けると思います。

また、TinyPNGはわざわざサイトにアクセスしなくても使えるようにWordPressプラグインが公式ディレクトリにて配布されています。

使い方や設定はこちら

ちなみにEWWW Image Optimizerは確かに圧縮してくれますが、本当にぜんぜん圧縮できません。ちょーっとだけです。それに比べてTinyPNGは画質を損なわないままサイズを小さくできます。

ぜひブログ記事のサムネイルや記事中で使う画像をアップロードする前に、TinyPNGで圧縮してからアップロードしてみてはいかがでしょうか。表示速度の改善にも大きくつながりますし、おすすめですよ!(´ω`)

Web開発が大好きです。主にHTML+CSS、Bootstrapを使っています。仮想通貨関連も最近はいじくりまわしている。

-ウェブサービス