クリックしてもなかなか読み込みが終わらないサイト、見たことありますよね。
気になって見てみようと思ったけど…もういいや。経験ある方多いと思います。
表示速度が1秒だったものが…
→ 3秒に落ちると直帰率は32%
→ 5秒に落ちると直帰率は90%
→ 6秒に落ちると直帰率は106%
との調べがでているようです。
Think with Google より :
https://www.thinkwithgoogle.com/marketing-resources/data-measurement/mobile-page-speed-new-industry-benchmarks/
サイト速度が検索順位にも関わっているようです。
せっかく作ったサイトが見られないのは勿体無いですよね！
サイトが重たくなる原因としてよく挙げられるのが画像データ。なのでその点から見直してみましょう！
ブラウザで画像圧縮
WEBサイト上には無料で画像データを圧縮してくれるツールも多くあります。これは圧縮率も変わってくるのでは…？？ということで、よく使われているサイトを比較してみました。
が、結果からいうと好きなサイトでしていいと思います。
今回圧縮してみた画像はこちら。
京都にあるフクロウの森 ホワイトくんです！
イケメン!! しかもなんと触れ合えます！ふわっふわの羽毛が堪りません!!
209KBあります。
TinyPNG
54.5KBまで圧縮できました！元の画像が209KBではなく214.9KBとなっていたので、他画像でも試したのですがどれも元画像より表示が大きかったので仕様かもしれません。
PNG、JPEGに対応しています。保存先はローカル・Dropbox。
iLoveIMG
55.02KBまで圧縮できました。 PNG、JPEG、GIFに対応しています。また、同サイトでPNG画像をJPEGに変換もできるのが便利です。 保存先はローカル・Dropbox・GoogleDrive。
まとめ
画像をブラウザで圧縮すると画質を保ったまま大幅にデータサイズを小さくできます！
WordPressの場合プラグインを入れると画像をアップロードするだけで自動で圧縮してくれて便利です。また、画像のメタデータ(撮影情報)を消すこともでき、圧縮データもさらに少しだけですが軽量化が可能です。