WEBサイトにおいて、ページの表示速度は非常に重要です。
表示に時間が掛かると大多数のユーザーが離脱してしまうというデータもあります。
WEBサイトの表示速度を上げるための有効な手段として、『画像を圧縮する』ことが簡単かつ効果的です。
高い画質を保ったまま画像のファイルサイズを圧縮できるサイトは、TinyPNGが最も有名ですね。
TinyPNGと同じ画像圧縮サイトとして、『画像圧縮AC』というサイトが新たにリリースされました。
名前でピンときた方も多いと思いますが、「写真AC」や「イラストAC」を運営している、ACワークス株式会社の新サイトです。
早速使用してみたので、TingPNGとの違いをご紹介します。
画像圧縮の必要性
冒頭でも書きましたが、WEBサイトの表示速度というのはユーザビリティ的にもSEO的にも重要とされています。そしてその表示速度を上げるための有効手段として、『画像を圧縮する』という方法があります。
PageSpeed InsightsというWEBサイトの表示速度を点数で計測できるサイトがあるので、自身のサイトURLを計測してみてください。
点数が低い場合には改善項目が表示されるのですが、その中に「効率的な画像フォーマット」という項目があると思います。
この項目が、「画像を圧縮してくださいね」という意味なのです。
圧縮作業はとても簡単で、「TinyPNG」や今回ご紹介する「画像圧縮AC」のサイトにアクセスして、画像をドラッグ&ドロップするだけ。
画像の画質は高く保ったまま、容量を圧縮してくれます。
この作業をするだけで「効率的な画像フォーマット」項目が改善され、点数も大幅に上がるはずです。
そして点数が上がればWEBサイトの表示速度が上がるので、ユーザーの離脱が防げるわけですね。
WEBサイトの表示速度を上げる方法は、以下の記事で詳しくご紹介しています。
『画像圧縮AC』について
前述したように、画像の画質を高く保ったままファイルサイズを圧縮できるサイトです。
圧縮したい画像をドラッグ&ドロップするだけで完了するのでとても簡単に使用できます。
圧縮後の画質(JPG)
圧縮前(ファイルサイズ:211.9KB)
圧縮後(ファイルサイズ:33.2KB)
圧縮率は『-84%』。
かなり拡大しないと劣化がわからない程度です。
圧縮後の画質(PNG)
圧縮前(ファイルサイズ:27.2KB)
圧縮後(ファイルサイズ:13.8KB)
圧縮率は『-48%』。
写真以外だと画像の劣化が激しいですね。
『画像圧縮AC』と『TinyPNG』の違い
表組にまとめました。
画像圧縮AC | TinyPNG | |
---|---|---|
利用料金 | 無料 | 無料 |
使い方 | 画像をドラッグ&ドロップ | 画像をドラッグ&ドロップ |
一度に可能な枚数 | 25枚 | 20枚 |
一度に可能な容量 | 40MB | 5MB |
処理速度 (※30KB程度の画像5枚で検証) |
約24秒 | 約4秒 |
圧縮率 | ほぼ同等 | ほぼ同等 |
画質 | PNGは劣化が激しい | JPG・PNGどちらも綺麗 |
『画像圧縮AC』と『TinyPNG』どっちを使うべきか
一度に可能な枚数・容量に関しては『画像圧縮AC』の方が優れています。
処理速度・画質に関しては『TinyPNG』が圧勝でした。
特に気になったのは圧縮後の画質。
『画像圧縮AC』のPNGの劣化具合は無視できないレベルまで劣化してしまいました。
WEB制作にはほとんど使用できないレベル。JPGは問題ないのですが…。
結論
ACワークスさんのサイトなので期待していましたが、現状だと『TinyPNG』の方が使い勝手が良いと思います。決め手はやはりPNGの劣化が激しいことです。
ただ、まだリリースしたばかりなので、今後のアップデートで改善されるかもしれません。
そこに期待することにします!