読者さんからのコメントで気付きましたが、現在こちらのプラグインで画像圧縮すると、メディアとサーバー上では圧縮されていますが、肝心の記事上では圧縮されない現象を確認しました。
何らかのバグかもしれませんが、念のためこちらのプラグイン依存を非推奨とさせていただきます。
画像圧縮に関しては以下のサービスなどを使い、WordPressにアップロードする前に圧縮しておくと今回のようにプラグイン側に問題があっても影響を受けません。
jpeg画像はこちらがおすすめ https://imagecompressor.com/
png画像はこちらがおすすめ https://www.iloveimg.com/ja/compress-image
以上よろしくお願いします。
パンダがトレードマークでお馴染みの「tinypng」のプラグイン版(画像ファイルを圧縮してくれる)。
(無料で圧縮できるのは月に５００枚まで、それ以降は有料)
画像圧縮では「EWWW Image Optimizer」が有名ですが、両方試した結果このプラグインの方が圧縮率も高くおすすめです。
ということで、Compress JPEG & PNG imagesの設定や機能について解説していきます。
プラグインのまとめ記事はこちら
WordPressのおすすめプラグイン・新旧19個を紹介目次・読みたい所へタップできます
Compress JPEG & PNG images使い方①【インストール方法】
「管理画面」
↓
「プラグイン」
↓
「新規追加」
↓
「Compress JPEG & PNG images」で検索
↓
「インストール」
↓
「有効化」
Compress JPEG & PNG images使い方②【APIキーの取得】
このプラグインの設定は、管理画面の「設定」項目には表示されず「設定内のメディア」の中で設定します。
「管理画面」
↓
「設定」
↓
「メディア」
↓
「新規アカウントの登録」
↓
「名前とメールアドレスを入力」
↓
「Register Account」をクリックで以下の画面を確認
↓
先ほど登録したメールアドレスに下記のメールが届きます。
「Activate your account」をクリック
↓
この画面を閉じてWordPressの管理画面に戻れば、プラグインが使えるようになっています。
２-１・APIキーの確認方法
一度取得したAPIキーは、他のサイトでも共有できます。
「Change API key」をクリック
↓
このキーを使えば、別サイトでも使用できます。
ただし、枚数制限なども引き継ぐので画像を多用するサイトであれば、別のメールアドレスで新たにAPIキーを入手した方が良いです。
Compress JPEG & PNG images使い方③【JPEG and PNG optimizationの設定】
ここで、現在の使用枚数の確認や圧縮する画像の対象を決めていきます。
３-１・TinyPNG account
ここで、今月圧縮した枚数を確認できます。(上記サンプル画像の１３４の部分)
３-２・File compression
ここで圧縮する画像を選択していきます。
３-２-１・Original image
これはアップした画像すべてなので、チェックします。
３-２-２・その他の画像
ここでその他にしたのは、使ってるテーマにより表示が変わるからです。(トップページの画像サイズを変更できるテーマをお使いの場合は、設定している画像サイズが表示されます。)
例えば、当サイトは「WordPressテーマ「ストーク」 
」を使用していて、現在はこのように表示されています。
現在は「SANGO」を使用
- 「Home-thum – 486×290」
- 「Post-thum – 300×200」
「WordPressテーマ「ストーク」 」の場合はトップページの表示を
- 「シングル」
- 「カード」
- 「マガジン」
- 「ビッグ」
の４種類から選べるので「Home-thum – 486×290」は、「シングル」のサイズになります。
「Post-thum – 300×200」も、「WordPressテーマ「ストーク」 」の専用画像サイズで、それぞれ記事下の「関連記事」と「最新記事」のサイズです。
「at least 166 images」の部分は、毎回３つのサイズを圧縮すると１６６枚しか圧縮できませんよという意味です。
２つなら「２５０」、１つなら「５００」と表示されます。
Compress JPEG & PNG images使い方④【Original image設定】
この先の項目は、先ほどの「File compression」で「Original image」にチェックを入れると表示されます。
基本は全て、ノーチェックで構いませんがサラッと説明だけしておきます。
４-１・Resize and compress the orginal image
チェックをして、「幅」と「高さ」を指定した場合、そのサイズを超える画像をアップロードすると画像圧縮と同時にリサイズも行ってくれます。
指定したサイズを超えなければ、画像圧縮のみされます。
ただし、リサイズの数も月の枚数制限にカウントされる(１度のアップロードで２回消費する)ため、当サイトでは使用していません。
４-２・Preserve creation date and time
ここをチェックすると、「JPEG」形式の画像のみ、アップロードした「作成日時」を保存できます。
４-３・Preserve copyright information
ここをチェックすると、画像内に「著作権」情報を保存できます。
４-４・Preserve GPS location
ここにチェックすると、「JPEG」形式の画像のみGPSによる「位置情報」を保存できます。
設定をしたら、最後に「変更を保存」をしてください。
Compress JPEG & PNG imagesの圧縮率を測定
それでは、このプラグインによる圧縮率を見てみましょう。
今回は「JPEG」と「PNG」を比べてみます。
「JPEG」
当サイトでは、記事内で使う画像は「jpeg」を使用していますが、「Home-thum(トップページ)」や「Post-thum(関連記事など)」は関係ないので、「Original」のみ圧縮しています。
圧縮前の画像の容量は「２３９.９KB」に対し、圧縮後は「４４.７KB」になりました。
トータルで「７０％」圧縮されています。
「PNG」
「PNG」は、アイキャッチ画像に使っているので全て圧縮しています。
こちらも全体で６９％圧縮されています。
これだけ圧縮されていれば十分ですね。
ちなみに、１KB減らすことがどれくらいかというと……
- １KB(キロバイト)＝１０２４B(バイト)
- １文字＝半角１B、全角２B、改行２B
- １０２４÷２＝５１２文字(全角)
この数値からもわかるようにたった１KBでも、５００文字分の容量なんですね。
WEB上には、記事を最後まで読んでもらうために画像を適度に挟んだ方が良いという意見もありますが(そういったサイトは大抵謎の海外画像を多用してる)上記のことからも無駄な画像は極力避けるべきです。
それに、そんなことのために画像探すってのも面倒ですしね。
Compress JPEG&PNG images【まとめ】
- 画像をアップロードすれば、自動圧縮を行ってくれる
- 圧縮する画像を個別に選択できる
- 設定が楽
- 圧縮量が高め
５００枚制限があるとはいえ、もし超えるようなら本家の「TinyPNG」を使えばいいだけなので、基本無料で使えますね。
画像の圧縮は、ページの表示速度が早くなる＝サイトの高速化に繋がります。
サイトの高速化はユーザーにも、検索エンジンにも喜ばれるので早めに設定しておきましょう。
WordPressのおすすめプラグイン・新旧19個を紹介
もし分かったら教えてください。
圧縮するとメディア一覧での表記サイズは小さくなりますが、実際のページから画像を保存すると元のサイズのままです。
圧縮後にCompress Jpeg & PNG imagesを向こうにしてもメディア一覧での表記は小さいままなので実際にサーバーにアップロードした画像が圧縮されていると思っていたのですが、元のサイズのままでダウンロードできるということはメディア一覧での表記サイズだけ小さくなって実態は変わっていないのではないかと疑問に思えてきました。
どういう仕組みになっているのでしょうか。
よろしくお願いします。
吉田晴紀様
ただいま確認したところ、確かに「メディア」と「サーバー」では圧縮されていますが、コンテンツ上だと圧縮されていませんでした。
この状態ですと、読み込みは元のサイズになってしまうので、圧縮している意味がなくなってしまいますね。
何かのバグかもしれないので、こちらのプラグインは使用を停止した方がいいです。
またプラグイン依存だとこうしたバグも起こりえるので、こういった場合の最善策としては、面倒ですがWordPressにアップロードする前に以下のようなサービスで圧縮してしまうこと。
jpegであればこちら
https://imagecompressor.com/
pngであればこちら
https://www.iloveimg.com/ja/compress-image
がおすすめです。
よろしくお願いします。
お返事ありがとうございます。
やっぱりそうですか、あまりこういったことを試す人は居ないのでしょうか。
かなりのユーザー数がいるはずなのに･･･
ありがとうございました。