写真の最適化やプラグインについて

Smush – Lazy Load Images, Optimize & Compress Images

一般的にページリソースの大半は画像や動画が占めています。かといって軽量化するために画像や動画を完全に消去してしまうわけにもいきませんので、ページのデザインを変えることなく少しでも軽量化を図る手段を考えます。

最も有効なのは画像を最適化することです。最適化の第一歩は「あまり画像を多用しない」ということになります。画像使用の目的はイメージ戦略ですから、他の方法（CSSによるエフェクトやアニメーションなど）でも代用できるなら、極力画像は使わないということが最良の最適化方法になります。

本当に必要な画像ならまずその形式を考慮します。進化する高解像度のディスプレイ上に表示されても画像が粗くなることなく、かつ軽量化を実践するには画像形式は重要です。

画像がベクタ方式であればSVG形式で、ラスタ方式であればWebP形式、またはPNG、JPEG形式を選択します。また画像に付与されている冗長なメタ情報（撮影日、撮影者、撮影地、色深度指定等々）なども削除して画像そのもののデータ量を軽減します。

さらに画像サイズも同じイメージのものを複数サイズ用意しておき、デバイスによって最適な画像を読み込むようDPRで振り分けるよう指定することも可能ですが、この辺りは作業する人の知識とスキルによっても変わってきます。

「過大なネットワークペイロードの回避」とは？改善方法も解説【PageSpeed Insights】

画像を最適化するプラグイン

・WebP（ウェッピー）と呼ばれる次世代フォーマットへの変換にも対応
※WebP形式は当初Google Chromeしか対応していないマイナーな形式でしたが、2020年からiOS標準ブラウザであるSafariでもサポートされるようになったため、今WebP形式に対応するメリットは非常に大きいです。

・日本語対応

・撮影時刻や位置情報といったメタデータ（EXIF）の削除にも対応

・一枚あたりの圧縮率は小さい

・他のプラグインと比べ圧縮率が高め

・月25MB分まで」という制限があり、仮に画像一枚を100KBだとするなら250枚まで圧縮

・画像数の多い記事を頻繁に作成するようなサイトには向きません。

・メディアライブラリ以外の特定のフォルダを圧縮対象として指定することができます。

・

「１ファイルにつき5MBまで」「一括の処理は50枚まで」といった条件はありますが、日や月ごとの制限はありません。

また、わずらわしいアカウント登録やAPIキーの取得が必要ないため、初心者でもインストール後すぐに使えるのもSmushの魅力

・無料版ではフルサイズの最適化に対応していない点

・「大サイズ」や「サムネイルのサイズ」等、WordPressでリサイズされた画像ファイルのみ圧縮されます。

・Imagifyと同様に圧縮レベルを調整できるプラグイン

・外部サーバーでの圧縮処理やメタデータの削除など、パフォーマンスを改善する上でほしい機能が充実

・利用制限が厳しく、無料版では月100枚まで

・プレミアム版はWebP形式に対応

・圧縮率が非常に高く、50％前後ほど容量を軽減

・無料版では月間で圧縮できるのは画像500枚まで

・プラグインで圧縮する際にはTinyPNGのサーバーで処理されるため、自サイトのサーバーに負荷がかかりません。

・通常の方法よりも圧縮が完了するまで時間がかかるため、大量の画像をまとめてアップロードする際には注意が必要

EWWW Image Optimizerを使用してみた。