Design

【TinyPNG&Optimizilla】無料オンライン画像圧縮ツール

TinyPNG × Optimizilla

こんにちは、Keisuke です。

今回の記事はこんな方向け

  • サイトの表示速度が遅くて困っている方
  • 無料で画像圧縮をしたい方

サイトに画像をアップロードする前に、しっかりと画像の圧縮を行っていますか?

ファイルサイズの大きい画像をアップロードし続けると、サイトが重くなり表示速度がどんどん落ちていき、訪問者の離脱につながります。

実際に Google がサイトの表示速度と訪問者の直帰率の関係性について、 以下のデータを公表しています。

Googleサイト表示速度と直帰率の関係性引用元:Find out how you stack up to new industry benchmarks for mobile page speed

・表示速度が1秒から3秒まで遅くなると、直帰率は32%増加する
・表示速度が1秒から5秒まで遅くなると、直帰率は90%増加する
・表示速度が1秒から6秒まで遅くなると、直帰率は106%増加する
・表示速度が1秒から10秒まで遅くなると、直帰率は123%増加する

引用元:Find out how you stack up to new industry benchmarks for mobile page speed

せっかくサイトに訪問してくれた人が記事を読まずに離脱してしまっては、いくら記事の内容が良くても意味がありません。

そうならないためにも画像の圧縮はしっかりと行っておきましょう。

そこで本記事では、無料オンライン画像圧縮ツール「 TinyPNG 」と「 Optimizilla 」の2つをご紹介します。

Keisuke
Keisuke
画像を軽量化したい方は、ぜひ最後までご覧ください^ ^

無料オンライン画像圧縮ツールとは?

無料オンライン画像圧縮ツールとは、名前の通りオンライン上で画像を無料で圧縮できるツールのこと。

特徴は以下の通り。

  • 無料
  • インストール不要
  • 登録不要
  • 画像の劣化がほとんどない
  • 枚数無制限

面倒なインストールや登録が不要で、サイトにアクセスするだけですぐに使用できます。

Keisuke
Keisuke
では、さっそくツールをご紹介します。

TinyPNG

TinyPNG引用元:TinyPNG

TinyPNG は利用している人も多く画像圧縮ツールとしてはかなり有名。パンダのイラストが目を引きますね。

圧縮率、使いやすさともに文句なしです。

Keisuke
Keisuke
サイト名に PNG と付いていますが JPG も問題なく圧縮できますよ。

以前は PNG のみ対応で JPG は別サイトの TinyJPG で行う必要がありましたが、現在は両方のサイトが PNG と JPG のどちらにも対応しています。

JPG は PNG よりもファイルサイズを小さくできるので、なるべく JPG 画像を使うようにしましょう。しかし、背景を透過した画像やイラストなどは一般的に PNG の方が適切とされています。画像にこだわりがある場合は、使い分けるとよいでしょう。

TinyPNG の使い方

TinyPNGの使い方引用元:TinyPNG

使い方はとてもシンプルで、真ん中の黒枠に画像をドラッグ&ドロップする、黒枠内をクリックしてファイルを選択する、のどちらでもOK。

参考に PNG 画像で試してみたところ上の画像の通り66%も圧縮されました。

保存はダウンロードをクリックして zip 形式にするか、または Dropbox へ直接保存も可能です。

Optimizilla

Optimizilla引用元:Optimizilla

Optimizilla も利用者が多く有名なツールです。

こちらも PNG と JPG の両方に対応しており、画質を維持したまま高圧縮が可能となっています。

TinyPNG と唯一異なる点は、圧縮率を手動で調整できる点。画像によって圧縮率を変えたい時に便利です。

Keisuke
Keisuke
パンダとゴジラで覚えやすいですね^ ^

Optimizilla の使い方

Optimizillaの使い方引用元:Optimizilla

TinyPNG と同じく画像をドラッグ&ドロップするか、アップロードから画像を選択できます。

こちらも参考に同じ PNG 画像で試してみたところ66%も圧縮されました。上の画像を見ていただくと分かる通り、見た目にも変わりはありません。

また、スクロールバーを上下するだけで簡単に圧縮率を変えることができます。

保存は「全てダウンロード」から zip 形式で保存可能。

さらに画像を軽量化してサイトの表示速度を上げる方法

「 TinyPNG 」と「 Optimizilla 」に加えてさらに画像を圧縮する方法としては、プラグインの「 EWWW Image Optimizer 」を併用する方法があげられます。

「 EWWW Image Optimizer 」とは WordPress へ画像をアップロードする際に、自動で画像を圧縮してくれる便利なプラグイン。

WordPress へ画像をアップロードする前に「 TinyPNG 」か「 Optimizilla 」で高圧縮し、アップロード時にさらに「 EWWW Image Optimizer 」で圧縮すれば、画像を極限まで軽量化することができます。

「 EWWW Image Optimizer 」の詳しい使い方は以下の記事をぜひご覧ください。

【画像圧縮プラグイン】EWWW Image Optimizer の設定方法と使い方

Keisuke
Keisuke
画像をより軽くしたい人におすすめの方法。当サイトでも「 TinyPNG 」と「 EWWW Image Optimizer 」を使ってダブルで圧縮しています。

まとめ:【TinyPNG&Optimizilla】無料オンライン画像圧縮ツール

以上、無料オンライン画像圧縮ツール「 TinyPNG 」と「 Optimizilla 」についてでした。

画像のファイルサイズはサイトの表示速度に影響を与える大きな要因のひとつです。

画像をアップロードする前に圧縮作業を毎回やるのは面倒に感じますが、このひと手間がサイトの表示速度改善につながりますので、この機会にぜひ試してみてください。

少しでも参考になりましたら幸いです。

最後まで読んでいただきありがとうございました。

✔️今回ご紹介したツール

ABOUT ME
Keisuke
Keisuke
スペイン滞在3年目。一般企業を退職→バレンシアへ留学→マドリードで就職。WordPressとWebデザインを勉強&仕事受注中。学んだことを当ブログで発信しています。たまにスペインのことも。 訪問国は欧州20ヶ国50都市。