サイトの表示速度を上げるために画像を圧縮してアップロードするのはWordPressの教科書に書いてあります。ただ、殆どの場合で実は意味がないんです(‘◇’)ゞ
本記事では、画像を圧縮してアップロードする効果が無い理由とその対策を解説します。
圧縮して画像をアップロードしても効果が無い理由
WordPressではアップロードしたオリジナルの画像は「フルサイズ」という分類になっています。ただ、実際にサイトに表示するのは、「サムネイル」「中サイズ」「大サイズ」という場合が殆どだと思います。しかし「サムネイル」「中サイズ」「大サイズ」のサイズは無圧縮の場合と変わらないんです。
検証結果を見てもらうと分かり易いと思います。
左側が、無圧縮でアップロードした場合の結果です。右側が圧縮した後にアップロードした結果です。OriginalData.pngというのがアップロードしたオリジナルのファイルでその他が、自動生成された画像データになっています。「サムネイル」「中サイズ」「大サイズ」以外にもテーマで利用している画像もあるので合計で11個の画像が自動生成されています。驚きの結果でしたが、無圧縮の場合の方が自動生成画像の容量が少なくなっています。
もう少し詳しく纏めてみました。アップロードしたオリジナルのデータの容量は-77%となっていますが、自動生成画像は+2％～+4%となっています。繰り返しになりますが、圧縮した場合の方が自動生成画像データが増えています。
自動生成画像は圧縮の余地があるのか検証してみました。TinyPNGで処理してみたら70%近く圧縮することができました。
結論
アップロードした画像ファイル（いわゆるフルサイズ）をサイト内で利用するのであれば、圧縮してアップロードするのは効果があります。ただ、サイト内で自動生成画像のみを利用している場合は、頑張って画像を圧縮しいアップロードしても意味がありません。（ひと昔前はサーバーのストレージを節約できるというメリットがありましたが、最近はサーバーのストレージ容量が大きいので節約の意味がほぼ無くなりました）
自動生成画像も圧縮する方法
自動生成画像含めて全て画像圧縮するのがサイトにとっては望ましいです。ではどうすれば良いのか纏めてみました。
サーバー上の自動作成画像を直接圧縮
自動作成画像は以下のフォルダ内に格納されていますので、FTPで直接サーバーにアクセスして好みの圧縮ソフトで圧縮してください。ローカルに一度ダウンロードして圧縮してまたアップロードといった流れになります。この方法は分かり易くプラグイン等に頼らないんでバグったりする心配がない点ですが、デメリットとしては「メンドクサイ」
/wp-content/uploads/
例：2019年1月にアップロードした画像はuploadsの直下に作成された/2019/01に格納されています。
/wp-content/uploads/2019/01
プラグインで画像圧縮をする（筆者利用）
Compress JPEG & PNG imagesというプラグインを利用することで、外部のサーバーを利用して自動生成画像も含めて全て圧縮可能です。メリットとしては、何も考えずにアップロードするだけで全て事足りるわけですからとにかく楽ちんです。また、外部のサーバーの処理能力を利用するのでWebサーバーへの影響がありません。デメリットとしては、月５００枚までは無料ですが、それ以降はお金がかかる点です。私の環境では自動生成画像を含めると１２画像もあるので、実質１か月で 500/12 = 41.66667 41枚までしか圧縮ができません。利用しない自動生成画像を除外して節約すれば良いという意見もありますが、環境に応じて画像が変動するので使われない自動生成画像を割り出すのは困難かと思います。
下図はCompress JPEG & PNG imagesの設定画面です。圧縮対象の自動生成画像を選択しておくことができます。私は全部チェックしています。
その他に有名どころでは、EWWW Image Optimizerがありますが、サーバーへの負荷がかかる仕様なので私はCompress JPEG & PNG imagesを利用しています。
コメント