WordPressに画像をアップロードすると、画質を保ったまま自動的に画像サイズを圧縮してくれるプラグイン「Compress JPEG & PNG images」の使い方をご紹介します。
使い方は簡単で、プラグインをインストールすると、通常通り画像をアップロードするだけで自動的に圧縮されるので、ページ表示速度を高速化することができます。
このプラグインはパンダ印の画像圧縮ウェブサービス「TinyPNG」のWordPress版で、JPGとPNGの画像圧縮に対応し、画質を劣化させずに画像のサイズを大きく圧縮することができます。
無料版は一ヶ月間に使える画像が500枚までという制限がありますが、EWWW Image Optimizer や Smash よりも画像の圧縮率が高く、ページスピード高速化にも役立ちます。
ウェブサイトの画像サイズを大きいままにしておくと、ページ表示速度が遅くなります。モバイルフレンドリーでないウェブサイトは、SEO的にもマイナスなので、画像は必ず圧縮すべきです。
無料にこだわるなら、超過分はTinyPNGを使って画像を圧縮するという手もありますが、費用対効果が高いので、有料版に切り替えてでも使うべきおすすめプラグインです。
あと、このプラグインは英語版だけで日本語には対応していませんが、この記事を見れば最後まで設定できるようになっているのでご安心を。
画像圧縮プラグインを使うメリット
WordPressで画像圧縮プラグインを使うメリットは、画像をアップロードするだけで自動的に画像サイズが圧縮され、ページ表示速度が上がるのでSEOにも有利という点です。
TinyPNGのようなウェブサービスで画像サイズを圧縮するには、以下の手順が必要です。
- 圧縮したい画像をTinyPNGにアップロードする
- 圧縮された画像をダウンロードする
- WordPressに画像をアップロードする
でも、Compress JPEG & PNG imagesを使うと、前の2工程を省略して「WordPressに画像をアップロードする」という1工程だけで圧縮することができます。
ここで気になるのが画質ですが、圧縮してもほぼ違いはわからないので安心できます。
WordPress用の画像圧縮プラグインといえば、他にもEWWW Image OptimizerやSmushがありますが、この2つは画質重視のため、画像の圧縮率はそれほど高くありません。
高画質の写真を使わない一般的なブログであれば表示速度を優先させるべきなので、より圧縮率の高いCompress JPEG & PNG imagesの使用をオススメします。
Compress JPEG & PNG imagesのインストールと登録
まずはCompress JPEG & PNG imagesをインストールしましょう。
その前に注意点として、他の画像圧縮プラグイン（EWWW Image Optimizer等）を併用すると問題が起きる可能性があるので、事前にアンインストールしておきます。
WordPressのダッシュボードから「プラグイン」→「新規追加」に進み、検索窓に「Compress JPEG & PNG images」と入力して「今すぐインストール」してください。
プラグインを有効化したら、インストール済みプラグインに進んで「Settings」をクリックします。
こちらがCompress JPEG & PNG imagesの設定画面です。プラグインを利用するためには、最初にアカウント登録が必要です。
Your full nameに名前（ニックネームでOK）、Your email addressに自分のメールアドレスを入力して「Register Account」をクリックします。
登録したメールアドレスに「Activate your Tinify integration」というメールが届くので、開いて「activate your account」をクリックしてください。
アカウントが有効化され、APIダッシュボードが開きます。有料版を利用するときは、こちらからクレジットカードを登録しますが、今は無料版なのでそのまま閉じてください。
もう一度設定に戻ってリロードすると、「Your account is connected」と表示され、今月の画像圧縮可能枚数が確認できます。これでアカウント登録は完了です。
Compress JPEG & PNG imagesの設定
続いてCompress JPEG & PNG imagesの設定に移ります。ここでは以下の3項目を設定します。
- New image uploads： 画像圧縮のタイミング
- Image sizes： 圧縮する画像サイズを選択
- Original image： 画像の作成日や位置などのメタデータ
画像圧縮のタイミング
まずはNew image uploadsで、画像を圧縮するタイミングを設定します。推奨設定は一番上の項目なので、通常はこれを選択すればOKです。
Compress new images in the background (Recommended)
一番早く画像を圧縮できますが、他の画像関連プラグインで問題が起きる可能性があります。
Compress new images during upload
1番目よりもアップロードに時間がかかりますが、他のプラグインとの互換性が向上します。
Do not compress new images automatically
自動圧縮を停止し、メディアライブラリで圧縮する画像を手動で選択します。
圧縮する画像サイズを選択
次にImage sizesで圧縮する画像サイズを選択しますが、ここは使用中のWordPressテーマや画像生成プラグインによって、表示される項目が異なります。
上の3項目はWordPress固有の画像サイズ、下の8項目はテーマによって変わる画像サイズです。
このサイトはブログテーマ「Cocoon」を使用しているので、Cocoon内の表示に用いる画像サイズが全て表示されています。
無料版では一ヶ月間に圧縮できる画像が500枚に制限されていますが、チェックが入っている画像は全てカウントされるため、計算すると11/500となって実質45枚しか使えません。
そのため、テーマで使われない画像サイズはチェックを外す必要があります。
画像サイズを減らして圧縮できる枚数を増やす
以下はCocoonの設定例です。WordPress固有の画像サイズですが、Original imageだけチェックを入れて、テーマ内で使われないサムネイルなどはチェックを外します。
テーマの画像については、サムネイル画像やカードタイプが横長なので、正方形のサムネイルが生成される2048、1536、200、300の画像サイズはチェックを外しました。
チェック済は5項目となり、5/500なので100枚まで画像を圧縮できるようになりました。
画像サイズの設定はテーマやプラグイン、Retina対応の有無によって異なりますが、少しでも圧縮できる枚数を増やすなら、サムネイルで自動生成される画像サイズをきちんと設定してください。
よくわからない場合は、「Original image」だけチェックを入れるのも手です。一番よく使われる画像なので、これだけでも十分な圧縮の効果が得られます。
あと、WordPressはダッシュボード左メニューの「設定」→「メディア」から、自動生成されるメディアの数を変更できる機能があります。
WordPressで自動生成されるデフォルト画像サイズのMediumやLargeは使わない場合が多いので、以下の記事を参考にしてWordPress固有の画像サイズを減らしてみてください。
画像の上限サイズ設定
この項目は前の「Image sizes」で「Original image」にチェックを入れた場合のみ表示され、画像サイズの調整や、作成日や位置といったメタデータを設定します。
通常はここにチェックを入れる必要はないので、基本的にスルーでOKです。
「Resize the original image」で画像サイズの上限を決めることができます。チェックを入れない場合、アップロードされた画像はオリジナルのサイズでそのまま圧縮されます。
ここにチェックを入れた場合は画像の圧縮が行われ、さらに画像サイズが「幅の上限」または「高さの上限」を超えると、ここで指定したサイズまでリサイズされます。
たとえば上限を1024×1024にすると、それ以下の画像は圧縮のみ、幅か高さが2048の画像をアップロードすると、1024までのリサイズと圧縮が同時に行われます。
ただし、ここも圧縮枚数にカウントされるので、不要であればチェックを外しましょう。
画像のメタデータ設定
あとの3項目は画像のメタデータに関する設定です。ここにチェックを入れると、画像を圧縮するときにメタデータを残すことができます。
Preserve creation date and time in the original image
画像の作成日時を保存します。
Preserve copyright information in the original image
画像の著作権（コピーライト）を保存します。
Preserve GPS location in the original image (JPEG only)
画像のGPS位置情報（JPEG限定）を保存します。
全て設定が終わったら、一番下の「変更を保存」をクリックしてください。これでCompress JPEG & PNG imagesの設定は完了です。
Compress JPEG & PNG imagesの使い方
では、Compress JPEG & PNG imagesを使って画像を圧縮してみましょう。
画像の圧縮方法はとても簡単で、WordPressの記事投稿画面、またはダッシュボード左の「メデイアライブラリ」から画像をアップロードするだけで、自動的に圧縮されます。
New image uploadsで手動圧縮を選択している場合は、メディアライブラリから圧縮する画像を選ぶことができます。プラグイン導入前の画像も同じく手動選択で圧縮します。
まずはダッシュボード左「メディア」→「メディアライブラリ」に進み、画像の表示方法をリスト表示に切り替えます。
画像リストの「Compression」という項目に緑のチェックが付いていれば画像は圧縮済みで、未圧縮の画像は「Compress」ボタンから画像を手動圧縮します。
圧縮済み画像サイズの確認
圧縮済みの画像には「Total savings 48%」といった形で画像サイズが表示され、およそ半分まで圧縮されています。「Details」をクリックすると、詳細を確認することができます。
画像の種類ごとに元サイズと圧縮サイズの詳細が表示されます。Image sizesでチェックを入れなかった画像は「Not configured to be compressed」と表示され、圧縮が行われていません。
画像を手動で圧縮・まとめて圧縮
手動圧縮を行う場合は「Compress」ボタンをクリックしてください。あとは自動で画像が圧縮されます。
画像をまとめて圧縮することもできます。メディアライブラリから圧縮したい画像を選んでチェックするか、左上にチェックを入れて全選択してから「Compress Image」を適用すると、まとめて圧縮できます。
アップロード済みの画像を全て圧縮するなら、Bulk Optimizationを使うという手もあります。
ダッシュボードから「メディア」→「Bulk Optimization」に進み、「全てのメディアを圧縮するならアップグレードしてください」というメッセージの下にある「No thanks, continue anyway」をクリックして先に進みます。
「Start Bulk Optimization」ボタンをクリックすると、画像圧縮が始まり、メディアライブラリ内のJPEGやPNG画像を一括で最適化することができます。
ただし、Bulk Optimizationを使うと、あっという間に1ヶ月に圧縮できる画像500枚の上限に達してしまいます。アップロード済み画像が多い場合は、有料版に切り替えてください。
Compress JPEG & PNG images 有料版
1ヶ月500枚の上限に達した場合は、有料版にアップグレードすると画像の圧縮を継続することができます。
管理画面の左メニュー「設定」→「Compress JPEG & PNG images」に進み、Tinify accountにある「Upgrade account」をクリックします。
「Login to your account」にメールアドレスを入力して「Send link」をクリックします。
届いたメールの「Log in with magic link」をクリックしてください。
TinyPNGのアカウントにログインしたら、メニューから「WordPress & API」に進みます。
ここから有料版にアップグレードします。「API Dashboard」の下に進むと、支払い情報の入力フォーム「Payment details」があるので「Add new card」をクリックします。
カード情報のフォームに記入して「Upgrade to pay per compression」をクリックすると、有料版にアップグレードされて1ヶ月500枚の上限を超えても画像を圧縮できるようになります。
有料版の料金
有料版にアップグレードすると、1ヶ月500枚まで無料の上限は変わらず、9,500枚までは画像1枚あたり0.009ドル、10,000枚を超えると1枚あたり0.002ドルの画像圧縮料金がかかります。
料金表の下にある「Pricing Calculator」で、画像圧縮に必要な料金を計算することができます。
「Add API key」で別のAPI keyを発行すると、他のサイトと合算で画像圧縮ができます。
画像圧縮が1ヶ月500枚に達しない場合は、他のサイトにもCompress JPEG & PNG imagesをインストールして、API keyを追加するとよいでしょう。有料の画像圧縮もすべて合算できますよ。
パンダが目印 TinyPNGで画像サイズ圧縮
サイトに表示する画像サイズが大きいと、ページ表示速度が遅くなりますが、画像サイズを圧縮すると、ページ表示速度を高速化することができます。
ただし、WordPress自体に画像を圧縮する機能はないので、TinyPNGのような画像圧縮ウェブサービスを使うか、WordPressプラグインを導入する必要があります。
パンダが目印のTinyPNGは、PNGとJPEGの画像サイズを大きく圧縮できるウェブサービスで、プラグインもこちらの機能を使って画像を圧縮しています。
Compress JPEG & PNG imagesの画像圧縮が上限に達したら、こちらを使うのも手です。
Compress JPEG & PNG imagesを使うと、1枚ずつ画像を圧縮する手間を省いて、ページ表示速度を高速化することができます。ぜひ一度使ってみてください。
