
こんにちはGaraKutaです。
僕は本業でWEBに携わる仕事をかれこれ15年以上続けています。(だいたいの歳がバレそうですが。)年月ばかり過ぎる中でそれほど経験値は高くないかもしれませんが、そんな中で培った知識が少しでも誰かのお役に立てれば幸いです。
ページの表示速度に問題がないか調べることができるサービス「PageSpeed Insights」は使っていますか?画像サイズを意識しないままWebサイトを運用していると、表示サイズに合わない大きな画像をそのまま使ってしまい、表示速度を遅くしてしまっている可能性があります。
そんな問題を解決する方法は、ざっくり言うと「1. プラグインを使ってアップロード時にファイルサイズを自動的に圧縮」するか、「2. 圧縮サービスでファイルサイズを縮小したものをアップする」かの2択かと思います。
今回は僕が普段から愛用しているものをプラグインから2つ、WEBサービスから2つご紹介します。
なお、それぞれの細かい仕様についての解説はこの記事ではしません。ご興味があるサービスがありましたら、調べて深堀してみてくださいね。
画像ファイルを圧縮するプラグイン
WordPressを使っているならプラグインは最大限活用した方が賢い選択だと思います。プラグインは数が増えれば増えるほど、さまざまなリスクが上がるので、入れすぎには注意ですが。
・EWWW Image Optimizer

EWWW Image Optimizer はインストールしておくだけでアップロードした画像を自動で圧縮してくれるプラグインです。設定は自分用に細かく設定する必要がありますが、メタデータ(位置情報など)の削除や、画像のリサイズなどにより画像の読み込み速度を早くすることができます。
画像の位置情報を見ると自宅がバレちゃう!という心配が無くなるだけでも入れておきたいと思えるプラグインですよね。
・Imsanity

Imsanity は画像のリサイズを指定できるプラグインです。先ほどの「EWWW Image Optimizer」でもリサイズ機能がありましたが、より細かい指定ができるため、僕はリサイズはこっちのプラグインで行っています。どうでもいいですけど、昔は少し不気味なアイキャッチ画像でしたが、普通な感じになったんですね。
画像ファイルを圧縮するWEBサービス
WordPressを使わない静的なページだったり、このブログみたいにwordpress.comを利用していてプラグインが使えない場合でも、以下のサービスを活用すればファイルサイズを抑えた運用ができます。このブログではめんどくさくてサボり気味ですけどね。本当はやった方がいいんだろうな。
・TinyPNG

TinyPNGはpngやjpegなどの画像データを非可逆圧縮で縮小してくれるサービスです。使い方も簡単で「files here」へファイルをぶん投げるだけです。非可逆圧縮なので画像の劣化はほとんどありませんが、驚くほどファイルサイズを縮小してくれます。
・Squoosh

Squooshは非可逆圧縮はもちろん、画質の劣化を許容してさらに縮小したり、画像の拡張子を変更することができるサービスです。
「PageSpeed Insights」の項目の一つに「次世代フォーマットでの画像の配信」がありますが、次世代フォーマットである「WebP」への変換も可能です。WebPを利用する際は対応していないブラウザもあるので、対応していないブラウザ用に別途画像を用意するなど、手間が掛かるのでご注意ください。
【ads】
まとめ
今回は画像の圧縮について、WordPressのプラグインを利用する場合と、WEBサービスを利用する場合とに分けてご紹介しました。どれも本当に普段から使っているサービスなので自信を持ってご紹介できます。画像サイズを圧縮したいけど、何から手をつければいいかわからない、という場合はこの4つから参考にしてみてください。

コメントを残す