90点超えを目指す!Cocoon+WP Fastest Cacheで爆速WordPressにする手順

Web運用(サイト構築)

WordPressの表示速度は、ユーザー体験やSEOに直結する重要な要素です。Cocoonテーマを利用している場合、初期状態でも高いスコアが期待できますが、運用を続けるうちにPageSpeed Insightsのスコアが下がってくることもあります。本記事では、スコアが思ったより低い場合や下がってきたときに確認すべき設定と改善手順を、初心者にもわかりやすくキャプチャ付きで解説します。

なぜPageSpeed Insightsスコアが重要か

PageSpeed Insightsは、Webサイトのパフォーマンスを評価するためのGoogle公式ツールです。このスコアは、検索順位や離脱率に影響を与える指標のひとつであり、90点以上を目指すことで、より多くの訪問者を維持し、コンバージョン率の向上にもつながります。

Cocoon高速化設定(Cocoon設定 → 高速化)

以下のチェック項目により、Cocoonテーマの高速化が実現できます。

キャッシュを有効にする
→ ブラウザにキャッシュを保存し、再訪問時の読み込み速度を向上させます。

CSSを縮小化する
→ 余分なスペースや改行を削除してファイルサイズを小さくし、読み込み時間を短縮します。

JavaScriptを縮小化する
→ JavaScriptファイルを最適化してページ速度を改善します。

Lazy Loadを有効にする
→ ページの表示速度を上げ、未表示部分の画像は遅れて読み込むことで初期読み込みを軽量化します。

Googleフォントを非同期で読み込む
→ Googleフォントの読み込みを遅延させ、レンダリングブロックを回避します。

📷 下図は実際のCocoon設定画面(高速化)
(※画像参照)

Retina対応設定でサムネイルを美しく(表示 → Retinaディスプレイ)

✅ サムネイルをRetina対応にしない
→ Retina対応を有効にすると、通常より大きな画像が読み込まれ、表示速度が低下し、PageSpeed Insightsのスコアに悪影響を与える可能性があります。爆速表示と高スコアを目指すならこの設定はチェックを外すのが推奨です。

📷 Retinaディスプレイ設定画面(※画像参照)

WP Fastest Cache の導入と設定

Cocoonだけでは不十分な部分を、WP Fastest Cacheプラグインで補います。

システムキャッシュを有効化
→ サイト全体のキャッシュを自動生成し、再訪問時の高速表示を実現。

ログインユーザー:ログインユーザーにキャッシュを表示しない
→ 管理画面操作中のキャッシュ表示を避け、編集結果を即時反映。

モバイル:デスクトップ用のキャッシュをモバイルデバイスに表示しない
→ モバイル専用のキャッシュを分離。表示崩れを防止。

新規投稿:投稿や固定ページを公開した時、キャッシュファイルを削除
→ 新しい記事を公開すると該当ページのキャッシュがクリアされる。

投稿更新:投稿や固定ページを更新した時、キャッシュファイルを削除
→ 内容変更時に古いキャッシュを削除。更新がすぐ反映される。

ブラウザキャッシュ:リピート訪問者のページ読み込み時間を減らす
→ ユーザーのブラウザに一部ファイルを保存し、再訪問時の表示を高速化。

📷 WP Fastest Cache設定画面
(※画像参照)

以下は、Cocoonテーマ使用時に「チェックしない方がよい」理由の説明です。WP Fastest Cacheの各該当項目ごとに理由を明確に記載します。

❌ HTMLを縮小

  • 理由:CocoonはデフォルトでHTML構造が最適化されており、余分な改行やインデントもほぼない。
  • リスク:WP Fastest CacheでHTMLをさらに縮小すると、コメントアウトされたコードや構造的マークアップが破損することがある。構造化データやAMP出力への影響もあり得る。

❌ CSSを縮小

  • 理由:Cocoonは標準でCSS最適化を実装済み(不要な読み込み除外、軽量化設計)。
  • リスク:テーマやプラグインのCSSが壊れて、デザイン崩れ・表示不具合を起こす場合がある。特に日本語Webフォントやメディアクエリで不具合が出ることも。

❌ JSを統合

  • 理由:Cocoonは複数のJSファイルを用途別に読み込んでおり、依存関係が明確に分かれている。
  • リスク:統合により読み込み順が崩れると、jQuery依存スクリプトGutenberg/ブロックエディタが正常に動作しないことがある。

❌ Gzip圧縮

  • 理由:多くのレンタルサーバー(ConoHa, Xserverなど)では、すでにGzip圧縮がサーバーレベルで有効になっている。
  • リスク:WP Fastest Cacheで無理にGzipを有効にすると、二重圧縮や競合でエラーが出る可能性あり(特に.htaccessの上書きに注意)。

❌ 絵文字を無効化

  • 理由:Cocoon側でも「絵文字スクリプトの読み込み停止設定」があり、WPFC側で重複設定する必要がない。
  • リスク:他プラグイン(例:お問い合わせフォーム、SNS系)が内部で絵文字を使っていると、表示崩れやJSエラーの原因になることがある。

以上のように、Cocoonテーマはパフォーマンス面で最適化されており、WP Fastest Cacheの一部機能と重複または競合するため、上記の項目にはチェックを入れないのが安全です。

PageSpeed Insightsでの確認と再評価

設定変更後は、PageSpeed Insights で再計測を行いましょう。
LCP(Largest Contentful Paint)やCLS(Cumulative Layout Shift)などの改善状況を確認し、さらなる最適化(画像遅延、プリロード、不要スクリプト削除など)へと繋げていくのが理想です。

コメント

タイトルとURLをコピーしました