EWWW Image Optimizerでwebpを使う

WordPress

2025.07.132025.07.17

設定

⇒EWWW Image Optimizer

⇒ほかのブラウザでは元の画像を提供し、対応するブラウザ用では画像を次世代の形式に変換します。にチェック

⇒以下のRewriteルールを挿入する

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{HTTP_ACCEPT} image/webp
    RewriteCond %{REQUEST_FILENAME} (.*)\.(jpe?g|png|gif)$
    RewriteCond %{REQUEST_FILENAME}\.webp -f
    RewriteCond %{QUERY_STRING} !type=original
    RewriteRule (.+)\.(jpe?g|png|gif)$ %{REQUEST_URI}.webp [T=image/webp,L]
</IfModule>
<IfModule mod_headers.c>
    <FilesMatch "\.(jpe?g|png|gif)$">
        Header append Vary Accept
    </FilesMatch>
</IfModule>
AddType image/webp .webp

挿入成功

⇒　変更を保存

【参考】

画像形式をWebPに完全移行しても大丈夫？【対応ブラウザの状況から考察】

【実践】Googleの画像フォーマット「WebP」でページスピード改善

WebPに関する10の誤解〜5分で学ぶWebP #フロントエンド – Qiita

AIによる回答

EWWW Image Optimizerを使いWebP形式に変換すると、元の画像ファイルに加えてWebP形式の画像ファイルが生成されるため、画像ファイルの枚数が増えます。しかし、WebP形式はファイルサイズが小さいため、サイト全体の表示速度は向上します。

EWWW Image Optimizerは、画像をアップロードする際に、自動的にWebP形式の画像を生成します。これにより、元の画像ファイル（例：JPEG）に加えて、WebP形式の画像ファイルが「uploads」フォルダに保存されます。そのため、画像ファイルの枚数が増えることになります。

ただし、WebP形式は、元の画像形式よりもファイルサイズが小さいため、サイトの表示速度が向上します。WebP形式は、高い圧縮率を持ちながらも画質の劣化が少ないため、表示速度と画質のバランスが取れています。

したがって、EWWW Image OptimizerでWebP形式に変換すると、画像ファイルの枚数は増えますが、サイトの表示速度は向上するというメリットがあります。

EWWW Image OptimizerでWebP形式に変換する際の注意点:

ブラウザの互換性:

古いブラウザではWebP形式に対応していない場合があります。そのため、WebP形式に対応していないブラウザでは、元の画像形式（例：JPEG）が表示されるように設定する必要があります。

ディスク容量:

WebP形式の画像ファイルが追加されるため、サイトのディスク容量が増加する可能性があります。WebP変換後に、サイトのディスク容量を確認し、必要であればディスク容量を増やすことを検討してください.

キャッシュ:

WebP形式の画像がキャッシュされるため、キャッシュのクリアが必要になる場合があります。

EWWW Image Optimizerの設定方法については、以下の記事を参考にしてください。

EWWW Image Optimizerとは？設定方法と使い方・利用メリットを解説 grannet.co.jp

【画像で解説】EWWW Image OptimizerでWebPを設定する方法 re-lifework.com