想定読者WordPressサイトの画像をWebPに変換する方法を詳しく知りたい。
本記事は、上記の方に向けて執筆しています。
エコおじい執筆者：当サイトを運営する私が詳しく解説しています。
WordPressカスタマイズ外注したい方
カスタマイズを外注したい方は「ココナラ」がおすすめです。
このように、ココナラでは3000円〜5000円でWordPressのカスタマイズ対応をしてくれます。
- WordPressカスタマイズ
- WordPress表示速度の改善
- WordPressバックアップ
興味がある方は、ぜひココナラを活用してみてください。
当サイトでの人気記事
- 【経験談】プログラミングを独学で習得する方法【3ヶ月で可能な話】
- 【完全初心者対応】プログラミングの始め方｜3ヶ月で成功を目指す
- 【保存版】WordPress初心者が独学で勉強する方法【サイト紹介】
【WordPress】そもそもWebPとは
WebPに変換する前に、そもそもWebPとは何なのかについてを理解しておきましょう。
WebPとは何なのか
- Googleが開発している次世代フォーマットの画像
- 現在、対応しているブラウザが少ない
- 圧縮度がかなり高いため、WordPressサイトを運営する方は必ず行うべき施策
- WebPはビットマップ画像なので、拡大すると劣化してしまう(SVGとは違う)
エコおじいWebPに変換することで、かなり表示速度を上げる事ができます。
当サイトでもPNG、JPEG画像をWebPに変換しています。そのおかげもあり、表示速度がかなり改善されました。
WordPressサイトの画像をWebPに変換する方法は何がおすすめなの
結論から言うと、プラグインを使った方法が一番おすすめです。
他にも、方法はあるのですが、初心者には難易度が高い+複雑なのであまりおすすめしません。
エコおじい当サイトもプラグインを導入して、WordPressサイトの画像をWebPに変換しています。
WordPressサイトの画像をWebP変換するのにはプラグインがおすすめです。
WebP変換する際に使用するプラグインは『EWWWww Image Optimizer』です。
EWWW Image Optimizerのインストールがまだ完了していない方は下記の記事を参考にしてみてください。
WordPressのWebP変換手順1：初期設定をしよう
まずは、WordPressの管理画面<プラグイン一覧＜EWWWww Image Optimizerへと移動してください。
WebP変換という項目がありますので、そちらのボタンをクリックしましょう。
エコおじいチェックボックスにチェックを入れると、下記の画面が表示されるはずです。
こちらに表示されているコードをコピーしてレンタル−サーバに貼り付けていきます。
WordPressのWebP変換手順2：.htaccesファイルに追記する
WordPressサイトの画像をWebPに変換する手順2は『.htaccesファイルに追記する』ことです。
当サイトではエックスサーバーとコノハでの経験があるので、今回はその２つのみを解説します。
当サイトが経験しているサーバー
- エックスサーバ
- コノハサーバー
WordPressサイトの画像をWebPに変換：エックスサーバー
まずはエックサーバでWebP変換について解説していきます。
エックスサーバーの管理画面へ行き、サーバー関連の情報が掲載されているページへ移動してください。
.htacces編集と書かれている部分をクリックし、編集画面へ行きましょう。
Endの下記部分に先程コピーしたコードを貼りつけましょう。
Endの上部分には色々書いてありますので、その部分は触れないようにしましょう。
エコおじいこのように貼り付けられた方は手順2は完了です。
手順3へと行きましょう。
WordPressサイトの画像をWebPに変換：コノハサーバー
コノハサーバーでのWebP変換に変換する方法を解説していきます。
コノハサーバーの管理画面へと行き、サイト管理＜応用設定＜.htaccesへと移動しましょう。
先程のコードを貼り付けるだけで、一括変換に必要な初期設定は完了です。
WordPressのWebP変換手順3：アップロード済みの画像をWebPに変換する
一度、EWWWww Image Optimizerのプラグイン画面へと行き、下記の画像のように配信がWebpに変換されているかを確認しましょう。
エコおじい上記画像のようになっていれば、手順1と2が無事に成功していることを意味しています。
WordPress管理画面＜メディア＜一括最適化へと行きましょう。
- 最適化を強制：チェック
スキャン済みの画像は自動でスキップしたいかたは不要 - WebPのみ：チェック
ここは必ずチェックするようにしましょう。
これにてWordPressサイトの画像をWebPに変換する方法はおしまいです。
WordPressサイトの画像がWebP変換されているかをチェックしよう
WordPressサイトの画像がWebP変換されているかどうかを調べるには「Chromeの検証機能」が必要です。
その他のツール＜デベロッパーツールの順にクリックしてください。
検証ツールにあるNetworkをクリックすると下記のような画面が表示されます。
TypeにWebPと表示されていれば、今回の作業は成功です。
キャッシュが残っていると、変更されていない場合がありますので、確認する際はキャッシュをクリアにしてから確認しましょう。
まとめ：WordPressサイトの画像をWebPに変換する方法
ここまでで『WordPressサイトの画像をWebPに変換できるプラグインを紹介』の解説は以上です。
エコおじい役立つプラグインについてもっと知りたい方は下記の記事をご覧ください。
WordPressサイトの画像をWebP変換する以外の高速化手順
WordPressの高速化に必要なのはWebP変換以外に、ソースコードの圧縮が挙げられます。
下記の記事で、表示スピードを上げるためのプラグインを紹介していますので、ぜひ参考にしてみてください。
本格的に表示速度を上げたい方は下記の記事を参考にしてみてください。
当サイトがWordPress高速化の案件で行う施策について紹介しています。
WordPressサイトで使えるプラグイン一覧
- 【最新版】Google XML Sitemapsの設定方法と使い方
- 【2022年最新版】EWWW Image Optimizerの使い方と設定方法
- WordPressブログの画像を圧縮する方法｜プラグインやツール紹介
- WordPressサイトの画像をWebPに変換できるプラグインを紹介
- WP-Optimizeの使い方｜データベース自動クリーンアップ
- 「使用していない JavaScriptの削除」プラグインで改善する方法
- Table of Contents Plus(TOC+)の使い方｜目次プラグインを設置する方法
- 【最新版】Autoptimizeの設定方法と使い方【圧縮系プラグイン】
- 【最新版】PS Auto Sitemapの使い方・スタイル設定を解説
- 【復元方法】BackWPupの設定方法・使い方を紹介【エラーの対処法】
- WordPressでお問い合わせフォームを設置する方法【自作とプラグイン紹介】
- WordPress掲示板の作り方｜bbPressの使い方とカスタマイズ
- 【必要ない】SWELLでおすすめのプラグイン6個を紹介
