WordPress 画像最適化 WebP 変換プラグイン Converter for Media

Last Updated:2024年01月17日| | 4のコメント

WordPress 5.8バージョンからWebPフォーマットがサポートされ始めました。 WebPフォーマットを使用すると、画像サイズが大幅に削減され、ページの読み込み速度が向上し、トラフィックも削減できます。

WordPress サイトからWebP形式に変換したい場合は、有料サービスを利用する必要がありましたが、今は Converter for Media プラグインを使用すると、画像ファイルを簡単にWebPまたはAVIF画像形式に変換してサイトの速度を向上させ、トラフィックを節約できます。 JPEG、PNG、GIF形式をWebP / AVIF形式に置き換えることで、品質を損なうことなくページサイズを大幅に削減できます。ページの読み込み速度が向上すると、SEO(検索エンジン最適化)にも積極的に作用します。

WordPress 画像最適化 WebP 変換プラグイン Converter for Media

このプラグインは現在40万を超えるサイトでインストールされ使用されており、一部の国内YouTubeはこのプラグインを必須プラグインとして紹介しています。

WordPress 画像最適化 WebP 変換プラグイン Converter for Media

画像をWebP形式に変換し、さらにオンライン画像圧縮サイトで圧縮した後にアップロードすると、画像サイズを最小限に抑えることができます。

すでに多くの画像をJPEG、PNGなどの形式でアップロードしている場合は、Converter for Mediaプラグインをインストールして既存の画像をWEBP形式やAVIF形式に一括変換することが可能です。

WebP vs. AVIF画像フォーマット

WebPGoogleは開発した画像フォーマットで、JPEG、PNG、GIFなどの従来の画像フォーマットよりも効率的な圧縮を提供します。 WebPはロス圧縮とロスレス圧縮の両方をサポートし、同じ画質の画像をより小さなファイルサイズで保存できるため、Webパフォーマンスの最適化に役立ちます。また、透明度(アルファチャンネル)とアニメーションのサポートが可能で、GIF代替フォーマットとしても使用されます。ほとんどのモダンなブラウザでサポートされていますが、古いブラウザの中には互換性の問題があるかもしれません。

アビフ(AV1 Image File Format)は、AOMedia Video 1(AV1)ビデオコーデックに基づく画像フォーマットです。このフォーマットは優れた圧縮効率を誇り、高品質の画像を非常に低いファイルサイズで提供します。 AVIFは、HDR(High Dynamic Range)や広色域(Wide Color Gamut)のサポートなど、さまざまな高度な機能をサポートし、WebPよりも高度な圧縮技術を使用しています。しかし、AVIFは比較的新しいフォーマットなので、WebPよりもサポートするブラウザが少なく、処理時間が長くなる可能性があります。

Converter for Media プラグインを使用する理由と使用しない理由

次の状況では、このプラグインの使用を検討できます。

  1. 既存の多くの画像がJPG、PNG形式でアップロードされている場合
  2. Webサーバーの空き容量が十分な場合
  3. ユーザーがWebP形式で画像をアップロードすることを強制できない場合

次の状況では、このプラグインを使用しないことをお勧めします。

  1. 新しくブログを開始し、WebP形式で画像をアップロードできる場合
  2. Webサーバースペースが不足している場合

Converter for Mediaプラグインを使用してJPG / PNG / GIFなどの画像をWebP / AVIF形式に変換すると、別のフォルダが作成され、変換されたファイルが保存されます。したがって、 追加のWebサーバーのディスク容量が必要になります。

Cafe24 など国内ホスティングを利用する場合にはディスクスペースがあまり十分ではない方ですので、このプラグインの使用を考慮する場合は、ディスクスペースが十分であることを確認した上で決定してください。 海外ホスティングを利用する場合には一般的にスペースが十分なので、このような制約では比較的自由な方です。

このプラグインをインストールして使用している場合は、WebPまたはAVIF形式で画像を読み込み続けるには、プラグインを有効にしておく必要があります。つまり、無効にすると、既存のイメージ形式で再度ロードされます。

Converter for Media プラグインのインストール

プラグインをインストールするには、 WordPress 管理者ページで プラグイン » Add New Plugin (新しいプラグインを追加)に移動します。検索フィールドに「converter for media」と入力し、 メディア用コンバーターをインストールして有効にします。

WordPress イメージ最適化プラグイン Converter for Media

Converter for Media プラグインの設定

Converter for Media プラグインを有効にした場合 設定 » Converter for Mediaで設定できます。

Server configuration error (サーバー構成エラー) 警告が表示された場合

プラグイン設定ページに以下のように Server configuration errorが表示されることがあります。

WordPress イメージ最適化プラグイン Converter for Media - サーバー構成エラー

このエラーが表示されると、画像を一括変換する機能が無効になります。

WordPress 画像最適化プラグイン Converter for Media - 一括画像変換を無効にする

上記のようにイメージのバッチ変換を開始するには、まずサーバー構成の問題を解決するように求められます。 Start Bulk Optimization(一括最適化の開始) ボタンが無効になります。

エラーメッセージのガイダンスフレーズでは、画像要求をApacheサーバーをスキップし、代わりにNgnixサーバーで処理するように設定されているため、この問題が発生しているようです。

Nginx Webサーバーが有効になっている場合は簡単な方法で 詳細設定 タブ » Image loading mode(イメージロードモード) オプションに移動して via .htaccessから Bypassing Nginxにオプションを置き換えると、サーバー構成の問題が解決します。

クラウドウェイズを使用している場合でも、このようなサーバー構成エラーメッセージが表示されます。クラウドウェイズの場合は、プラグイン設定で 画像読み込みモードBypassing Nginxに設定できますが、(クラウドウェイズアカウントにログインして) アプリケーション設定から WEBP Redirection(WebPリダイレクト)を有効にすると簡単に解決されます。

General Settings(一般設定)

General Settingsタブでいくつかの設定を指定でき、既存の画像(JPG、PNGなど)を一括でWebP形式に変換できます。

Conversion strategy セクション(①)では、画像の圧縮レベルを選択できます。デフォルト設定は 最適な(最適)です。

  1. 損失の多い:画像サイズを最も小さくすることができますが、画質が低下します。
  2. 最適な:目に見える画像品質を損なうことなく画像サイズを縮小します。
  3. ロスレスの:画質を損なうことなく画像サイズを最小限に抑えます。

通常は 最適なで置くことができそうです。画質が低下しても構わない場合は、最初のオプションを検討できます。画像のクオリティは低下しますが、画像のサイズが最も大きく減少し、ページの読み込み速度にプラスの影響を与えます。

サポートされている出力形式 セクション(②)ではサポートされている出力フォーマットを指定できます。無料版ではWebPフォーマットのみ選択できます。 AVIFフォーマットは画像サイズをWebPフォーマットよりも小さくすることができますが、有料版でのみ選択可能です。

Supported directories セクション(③)でメディアを変換するディレクトリを選択します。基本的に アップロードが選択されており、通常この設定をそのままにしてください。

WordPress 画像最適化プラグイン Converter for Media - 一般設定

画像の最大サイズ セクション(④)では、変換時に大きな画像のサイズを制限できます。

新しい画像の変換 セクション(⑤)では、メディアライブラリに新しい画像をアップロードするときに自動的に変換するかどうかを選択できます。後で画像を直接WebP形式に変換してアップロードする場合はこのオプションをオフにし、そうでない場合は有効にするだけです。

Advanced Settings(詳細設定)

[詳細設定]タブでは、サポートされているファイル拡張子を含むいくつかの高度な機能を指定できます。

WordPress 画像最適化プラグイン Converter for Media - 詳細設定

Supported files extensions セクション(①)では、変換するファイル拡張子を選択できます。デフォルトではgifファイルがオフになっていますね。 webpフォーマットはAVIFへの変換時にのみ選択するようにします。 WebP変換時にはwebp拡張子を選択しても無視されそうです。

画像読み込みモード セクション(②)では、イメージロードモードを指定できます。 Nginxサーバーのためにサーバー構成エラーが発生した場合 Bypassing Nginxに変更するか、クラウドウェイズの場合、上記の「Server configuration error (サーバー構成エラー) 警告が表示される場合」を参照して、アプリケーションで WEBPリダイレクト オプションを有効にしてください。

WordPress 画像最適化プラグイン Converter for Media - 詳細設定

Excluded directories セクション(③)では、画像変換時に除外するディレクトリ名をカンマで区切って入力します。

追加機能 セクション(④)では追加の機能を設定します。デフォルトでは、生成されたフォーマットのファイルが元の画像ファイルよりも大きい場合に自動的に削除されます(Automatic removal of files in output formats larger than the original ones)する最初のオプションが選択されています。

変換されたwebpファイルの保存パス

別のプラグインからwebpファイルに変換すると、元のイメージファイルが配置されている同じディレクトリにwebpファイルが作成されることがわかりました。このプラグインを使用してWeb形式に変換すると、変換されたwebpファイルは別のディレクトリに保存されます。

変換されたwebpファイルの保存パス

テストをしてみると WP-コンテンツ/アップロード フォルダの画像はwebp形式に変換されます wp-content/uploads-webpcという別のフォルダに保存されていることを確認しました。

参照


4のコメント

コメント

    • 削除しても構いませんが、今後このプラグインを無効にすると、すべての画像がエクイックとして表示されます。

      削除したい場合は、バックアップを確実に行ってからお試しください。

      削除するのではなく、ディスク容量を増やしたり、 ファーストコネットクラウドウェイズのようなホスティングを利用すると、ディスク容量が多い方です。

      応答
  1. SmushプラグインよりもWebPに変換するConverter for Mediaプラグインの方が良いですか?

    応答
    • Smushはずっと前にテストして試してみていないので、最新バージョンの場合、Converter for Mediaと比較してどちらが良いかについてはわかりません。
      Smushで一括変換に制約がありましたが、まだ制約がある場合は、この記事で紹介するプラグインがより良いようです。

      応答