Webサイトの速度改善のためにデザイナーが真っ先にやるべきこと
それは、Squooshをつかって画像を圧縮すること！
Webページの速度に関しては年々注目度が増しており、SEO的観点、UX的観点、収益的観点どこからみても表示が早いに越したことはありません。
しかし、抜本的な改善を行うためには結構開発コストがかかります。
そこですぐにでもできる改善策として画像圧縮があげられます。
場合によってはこれだけでも大幅に改善することもあります！
Squooshについて
SquooshはGoogleがPWAとして開発した、画像圧縮ツールです。
使い方で迷うことはなく、画像をD&Dして圧縮されたものをダウンロードするだけです。
色々オプションが選べますが、CompressはmozJPEGにするのがおすすめです。mozJPEGとはmozillaが開発したファイル拡張子がjpgのままで画質は(ほぼ)そのままなのにサイズは大幅に減少できる、次世代jpegエンコーダとよばれる形式です。
拡張子がjpgということはソースに手を入れずにすむこともあります。
WebPというGoogleが開発している形式もあるのですが、拡張子が.webpになり、かつIE11に対応していない(表示できない)という問題があります。
WebP表示はpicture要素とsrcsetの組み合わせで解決できるのですがこれはまた別の機会に…。
まとめ
・Squooshを使おう
・まずはmozJPEGでDLしよう
この記事が気に入ったらサポートをしてみませんか？