WordPressでサイト運営するなら対策したいのが画像やGIFアニメの圧縮です。当サイトでもできる時に画像圧縮作業をしています。
画像を圧縮するためにツールは色々ありますが、私が思うに一番適しているのはWEBサービスだと思います。
WordPressには「EWWW Image Optimizer」という画像圧縮のためのプラグインがあり、私も以前使っていましたが、数か月ほど使いどれほどの圧縮率なのか確認してみたところ画像によっては思っていたよりも圧縮されていないものもあり、phpMyAdminで確認したところ「ewwwio_images」というおそらく「EWWW Image Optimizer」関連と思われるであろうデータのゴミのようなものも発見したのでプラグインからWEBサービスに切り替えました。
その後、画像圧縮のWEBサービスをいくつか使ってみましたが一番しっくりきたのがOptimizillaというサービスでした。もちろん圧縮率が高く、このOptimizillaを使えば設定次第で思い通りの容量までデータを削減することができるという優れものです。
関連記事 : 画像圧縮・WEBサービス「Optimizilla」でサイト高速化
画像のデータ容量を削減することでページの読み込み速度を改善することができるので、結果としてGoogle検索の評価アップにつながる可能性があります。
目次
GIFアニメ
ところで当サイトではたまにGIFアニメを使用しているのですが、このファイル容量を確認すると凄く重いのがわかります。GIFアニメをツールで作成するときは2フレーム (数値が多い程容量は大きくなる) と少なめにしているのですが、それでも200KB～6MB (6000KB) という大きいものだと画像では考えられない容量になることもあります。
高圧縮後の画像サイズが1枚 10KB以下～多くても60KB程ですから、GIFアニメがどれだけ重いのかってのが実感できますね。
今まで考えもしなかったのですが、JPG・PNGを圧縮できるのなら画像の寄せ集めで作られたGIFアニメも当然圧縮できると考えますよね。探したら案の定、GIF圧縮のためのサービスがありました。
GIFの圧縮も画像圧縮のようにいくつかWEBサービスが提供されているようですが、こういったサービスにありがちなのがどこを使ったらいいのかわからないというところ。無料なのか有料なのか、機能面といったサービス選びです。
今回、GIF圧縮サービスを使った後の圧縮率がどれほどのものなのか確認できるためにこちらのGIFを用意しました。
圧縮前の容量が209KB。これがどれほどまで圧縮できるのか見てみましょう。
| 圧縮前 | 209KB |
iLoveIMG
まずはこちらのiLoveIMG。検索したら一番トップに出てきたサービスなので物は試しと使ってみました。使い方は簡単、真ん中の「画像を選択」の位置に圧縮したいGIFをドロップ＆ドラッグして「画像の圧縮」を選択するだけ。
するとほら。たったワンプッシュで209KBから147KBに見事圧縮されました。あとは「圧縮された画像をダウンロード」するだけです。
圧縮後のGIFファイル名が「元ファイル名-compressed.gif」となります。
Compressor.io
お次はこちらCompressor.io。英語表記ですが知名度のあるサービスのようです。使い方は「TRY IT!」を選択。この画面に切り替わるので圧縮したいGIFをドロップ＆ドラッグします。
さあどうなるのでしょうか。それほど待たずに完成したようです。
おっ、138.62KBです。まだまだ容量が気になりますが高い圧縮率のようです。
Compressor.ioも「元ファイル名-compressed.gif」になるようです。
EZGIF.COM
そして次はこちらのEZGIF.COM。英語表記ですし一見どこをどういじればいいのかわからないですが、上メニューから「GIF Optimizer」を選択します。
「ファイルを選択」から圧縮したいGIFファイルを選択 → その下の「Upload!」を選択します。
今までのワンプッシュタイプのGIF圧縮サービスと違い、多機能な印象です。
まずデフォルトの「Lossy GIF level 30 (slight)」→「Optimize it!」で確認してみましょう。
147KBになりました。
他の設定もいろいろ試してみてもっと高圧縮にしてみましょうか。なんか凄そうな「Lossy GIF Level 140 (heavy)」にしてみました。
おっ、これは。128.77KBですか。これはなかなかの高圧縮です。画像に比べるともちろん軽いわけではないですが無圧縮のPNG画像で色が比較的多く使用されている画像だとこの位の容量になります。
これをダウンロードしたい場合は右下の「save」を選択します。ファイル名は「ezgif.com-optimize.gif」になるようです。
resize
さらに圧縮できるような気がするのでしてみましょう。
「resize」を選択。大きさが「712x480px」と中途半端だったのでこれを「640×430」にします。
とと、これは逆に重くなってしまいましたぞ。400KB超えてしまいました。上書きされて重くなってしまったのかなんなのか…。
他もちょこちょこいじってみましたが圧縮に関係しているのは「optimize」のようです。もしかしたら「resize」してから「optimize」した方が良かったのかもと思いましたがそこまでの気力がわかずここで断念。
とりあえず「Lossy GIF Level 140 (heavy)」で圧縮すればかなりの高圧縮だということはわかりました。
まとめ
EZGIF.COMは自由度が高かいし高圧縮だったのですが、使いやすさで選ぶとなるとやはりCompressor.ioやiLoveIMGでしょうか。
これらのWEBサービスで重いGIFデータを軽く圧縮してみましょう。