【2020年最新版】画像圧縮・最適化おすすめツール4選 - inokawablog

【2020年最新版】画像圧縮・最適化おすすめツール4選

なぜ最適化が必要か?

画像の圧縮・最適化とはすなわち、Web ページに配置された画像の読み込み速度を最適化することです。

Webサイトでは画像のファイルサイズは HTML, CSS, Javascript のリソースと比較してもサイズが非常に大きいため、圧縮・最適化されていなければパフォーマンスに大きな影響を与えます。

画像が大きいとサイトの表示速度がめちゃめちゃ遅くなります。画像が大きいと表示されるまで時間がかかるので、ユーザーは画像を見ることなくサイトから離れていってしまうでしょう。

さらに、SEOにも大きな影響を与えます。

そのため、できる限り圧縮・最適化を行いましょう。

 

画像の圧縮・最適化におすすめのものを4つ紹介します。

Optimizilla

私はこのツールを使用しています。非常にシンプルに作られており、誰でも直感的に作られています。

最大20個までファイルをアップロードできます。圧縮率・カラーも簡単に設定できて大変便利で重宝します。

怪獣が可愛いです。

 

Caesium

画質を犠牲にすることなくファイルサイズを圧縮!「Caesium」。

少しだけ使っていたのですが、私は結局Optimizillaに落ち着きました。

圧縮後のファイルサイズを確認する機能や、画像をリサイズして出力する機能等もついており便利は便利です。
対応形式もとても豊富で、入力が BMP / JPG / TIF / PNG / PPM / XBM / XPM で、出力が JPG / BMP / PNGに対応しています。

 

TinyPNG

こちらは点線の枠のところに画像をドラッグ&ドロップするだけです。圧縮率は自動。

一度にまとめて20枚、最大5MBまでの画像を圧縮することが可能です。

このパンダはあんまり好きじゃないです。

 

Squoosh

Googleが作っています。←これだけで安心できるのはすごい。

squooshは迅速にロードできるウェブページを作成するための画像の圧縮やフォーマット変換を実行します。最適な画像フォーマットを選択でき、画像ファイルの品質を大きく損なわないようにしつつ、サイズをウェブ向けに最小化することができます。

サイトにはぐしゃっと潰された缶のイラストがあります。squooshって"ぐしゃっと潰す"って意味ですよね。まんまですね。

特徴として、

  • 処理がめちゃめちゃ早い。
  • シンプルで直感的に使える。
  • Googleなので安心。

画像を選択すると、このような編集画面に移動します。

右下に設定項目がいくつかあり、サイズを変更できたり、形式を選べたり、quality(質)を設定できたりします。"Show advanced settings"にチェックを入れるとさらに細かい項目を設定できます。便利すぎる。

 

おそらくこれが最強です。圧倒的です。

 

 

しかしちょっと待ってください。

シンプルにサクッとまとめてある程度の圧縮をかけたいという人はOptimizillaがおすすめです。おそらく一番簡単に多くの画像を圧縮できます。

squooshのサイトをみてください。"select an image"って書いてあります。squooshは1枚の画像を高速に、綺麗に圧縮します。なので複数を同時に圧縮したい場合はOptimizillaの方に軍配が上がります。

 

 

なので1枚ずつやる場合はsquoosh、大量の画像を扱う場合はOptimizillaというように使い分けをしましょう。

 

まとめ

他にもたくさんあるのですが、使っていていいなと思ったものだけをあげました。

基本的には単体はsuqoosh、複数はOptimizillaが一番良いと思います。

シンプルさってやっぱり大事。Google先生ありがとう。