Image Quality Controlは、WordPressで自走生成されるサムネイルの圧縮率を各々で設定できるプラグインです。
圧縮率の設定だけでなく、新しいサムネイルのサイズを追加できたり、WebPの自動生成してくれたりと、画像周りの便利な機能が多数提供されています。また、既存のアップロード画像の再圧縮も可能です。
Image Quality Controlのインストール
インストール手順は以下の通りです。
ファイルをFTPでアップロードしてインストール
- Image Quality Controlをダウンロードします。
- ダウンロードしたファイルを展開し wp-content/plugins にアップロードします。
- 管理画面の[プラグイン]ページで、Image Quality Controlを有効化します。
WordPress管理画面でインストール
- [プラグイン] – [新規追加]にアクセスします。
- 「Image Quality Control」で検索します。
- [今すぐインストール]をクリックして、Image Quality Controlをインストールします。
- [有効化]をクリックしてプラグインを有効化します。
Image Quality Controlの設定
WordPress管理画面で[設定] – [画像の圧縮品質]にアクセスして各種設定を行います。
一般設定
一般設定タブでは、各サムネイルの圧縮率を設定します。JPEG/WebPは1~100、PNGは1~9で指定します。
[新しい画像サイズを追加する]のボタンをクリックすると、新たにサムネイルのサイズを追加できます。
なお、圧縮率の設定値については、以下の説明を参考に決めると良いかと思います。
JPEG / WebP では、約 80~85 でファイルサイズと画質のバランスが良くなります。 より低い品質レベルはファイルサイズを小さくしますが、画質がより劣化します。
PNG では 9 が最適です。最も圧縮率が上がります。 可逆圧縮なのでより低い品質レベルでも画質は変わりませんが、ファイルサイズが大きくなります。
PNG のリサイズ画像の生成負荷が高い時は、5~6 に下げることを検討すると良いでしょう。
品質レベルのテスト
品質レベルのテストでは、選択した画像を画像タイプと圧縮率で比較できます。
高度な設定1
高度な設定1では、EXIFデータの削除やsrcsetの最適化など、より詳細な設定を行います。
安全なファイル名の保証 | URLに使用しても安全なファイル名への変換 |
EXIFデータの除去 | EXIFデータを削除 |
EXIFデータからAltを自動設定 | EXIFからAltを自動設定 |
“srcset”属性の最適化 | srcsetからsrcよりも大きい画像を除去 |
画像キャッシュ削除のクエリ文字列の強制追加 | 画像のキャッシュをクリアするためのクエリ文字を追加 |
品質レベルの接頭尾を追加 | ファイル名に圧縮率の値を追加 |
プログレッシブJPEGの有効化 | 低速回線で画像が徐々に表示されるプログレッシブJPEGの有効化 |
インターレースPNGの有効化 | 速回線で画像が徐々に表示されるインターレースPNGの有効化 |
インデックスカラー(PNG8)の使用 | 元画像がインデックスカラーの場合はサムネイルもインデックスカラーに変換 |
インデックスカラー(PNG8)の強制 | 強制的にサムネイルをインデックスカラーに変換 |
WebP自動生成の有効化 | WebPを自動生成 |
WP-Cronによるページ生成速度低下の最適化 | WP-Cronで画像を再圧縮する際の最適化 |
高度な設定2
高度な設定2では、大きな画像を自動縮小する機能のしきい値やサイトアイコン用の圧縮率を設定します。
大きな画像の閾値 | 自動縮小される大きな画像のしきい値 |
サイトアイコン用の圧縮品質レベル | サイトアイコンの圧縮率 |
設定をリセットする | 設定を初期値にリセット |
設定を表示 | 設定値のJSON |
再圧縮
再圧縮タブでは、既存のアップロード画像の再圧縮を実行できます。
[リサイズ画像を再生成する]をクリックすると、再圧縮が実行されサムネイルが再生成されます。”対象画像の条件を表示する”で再圧縮する対象を変更したり、”Attachment ID”で特定の画像IDのみを対象にすることもできます。
また、「WP-Cronを使った自動的な再圧縮」で”一度に処理する数”を設定すると、WP-Cronを使って自動で再圧縮が実行されます。
メディアライブラリ
[メディア] – [ライブラリ]では、個別に再圧縮を実行したり、圧縮情報を表示させることもできます。
あとがき
Image Quality Controlには、様々なフックも用意されています。フックの詳細については、プラグイン開発者である山本さんの以下記事をご参照ください。