WordPress高速化の施策まとめ｜16の手順– SPEED –

WordPressの表示速度を上げる施策を16記事まとめました。画像・CSS/JS・CDNの3方向から整理しています。

高速化は効果の大きい順に手をつけるのが鉄則です。まず画像、次に読み込むファイルの削減、最後にCDN。この順番を逆にすると、手間のわりに数値が動きません。

PageSpeed Insightsのスコアを追いかけるより、実際の読み込み時間とコアウェブバイタルの数値を見てください。

画像の最適化

ページ容量の大半は画像です。ここを詰めるのが最も効果が大きく、リスクも低い施策です。

画像をAVIF形式で配信します。WebPよりさらに軽く、対応ブラウザも広がってきました。

画像を自動で最適化するプラグインの設定方法です。既存画像の一括圧縮もできます。

ファーストビューの画像は遅延読み込みを外したほうが速く見えます。除外の指定方法です。

画像をCDNから配信し、サイズ変換も自動化します。画像が多いサイトで効きます。

CSS・JSの削減と読み込み制御

使っていないファイルを全ページで読み込んでいるケースは多いです。必要なページだけで読むようにするだけで、体感が変わります。

SWELLが読み込むCSSとJSを必要最小限に絞ります。効果が大きい施策です。

複数のCSSを結合してインライン化し、リクエスト数を減らします。

特定のページでだけJavaScriptを読み込みます。全ページで読む必要のないものを外せます。

jQueryを必要なページだけで読み込みます。

FontAwesomeを必要なページだけで読み込みます。アイコンを使わないページの負荷が減ります。

フォームを設置していないページで、Snow Monkey FormsのJS・CSSを読み込まないようにします。

日本語Webフォントはファイルが大きく、表示速度に響きます。サブセット化でリクエストを減らします。

CDN・サーバー側の高速化

表示速度はサーバーの応答時間にも左右されます。CDNは設定を誤ると逆効果になるので、キャッシュ対象を絞って始めるのが安全です。

無料で使えるCDNの導入手順です。設定を誤るとキャッシュ事故が起きるので、対象を絞って始めてください。

有料のキャッシュプラグインの設定方法です。設定項目が多いので、推奨値をまとめています。

計測と改善の進め方

何をどれだけ改善できたかを測らないと、次に何をすべきか分かりません。

コアウェブバイタルの各指標と、WordPressでの改善施策を対応づけて解説しています。

実ユーザーの体験データを見られるレポートです。競合サイトの数値も確認できます。

管理画面にサイトとプラグインのバージョン情報を表示します。更新漏れの発見に使えます。