Cocoonテーマ利用サイトのCore Web Vitals/PageSpeed Insights改善事例(57→95)

Cocoonテーマを利用したサイトの高速化ご依頼をいただきました。お客様がご利用されていたプラグインは一部設定を行うとiOSで2重タップが発生してしまうため、それを回避するカスタムコードの追加等を含めた対策を実施しました。

ラボデータ基準でトップページはモバイルスコアが82点から99点へ。記事ページは57点から95点へ改善しました。SEOに判断されるCrUXにおいては当初CLSが課題となってましたが今回の作業で改善を実施したので28日後のデータ更新でCore Web Vitals判定が改善される見込みです。

目次

今回実施した高速化内容

  • トップページ、記事ページでのサイト読込分析
  • CSS・JSのレンダリングブロック対策
  • ウェブフォント読込最適化
  • 画像、iframe等のlazyload
  • pjaxを使用しないサイト内遷移高速化
  • 高速化をする上でボトルネックになる既存プラグイン・テーマの停止削除・設定変更

フィールドデータ・オリジンサマリー(CrUX)

ご依頼時点のオリジンサマリー
ご依頼時のオリジンサマリー

ご依頼時点のオリジンサマリーではCore Web VitalsのCLSがドメイン全体で低い状態となっていました。そのためラボデータを参考に調整を行いCLSが要件をクリアするように調整を実施。

改善後のラボデータ(トップページ)
改善後のラボデータ(トップページ)

上記画像の通りラボデータでは問題ない状態になってますので、後はリアルユーザーデータの反映待ちとなります。

オリジンサマリーは現状ドメイン単位で評価されます。サブディレクトリ運用をしている場合ドメイン内のページ全てしっかり高速化しておかないとオリジンサマリー評価が低下してしまう恐れがあります。

PageSpeed Insightsモバイルスコア高速化結果

トップページの高速化前後比較

PageSpeed Insightsラボデータ
トップページ測定結果
PageSpeed Insightsラボデータ改善後
トップページ測定結果

トップページのCrUXはラボデータのモバイルスコアが80台であれば日本向けサイトで閲覧者もサーバーも日本にあればほとんどクリアします。なので無理にここからラボデータを改善する必要はあまりありません。ただし今回はまだ調整できる部分がありましたので調整した結果最終的なモバイルスコアは99となりました。

記事ページの高速化前後比較

PageSpeed Insightsラボデータ
記事ページ測定結果
PageSpeed Insightsラボデータ改善後
記事ページ測定結果

キャッシュプラグインが設定されてましたが記事ページについては改善項目がトップページより多かったのでこちらも改善。LCPについてはオリジンサマリーでは良好になってましたのであえてラボデータではこれ以上の対策をしませんでした。これについては下記ツイートをご参考にどうぞ。

固定回線・LTE回線での表示速度(体感速度)

WebPageTestでのLTE回線比較では3秒→1.3~1.5秒まで表示時間を改善しました。Chromeシークレットモードでは固定回線だと0.1秒から0.8秒で各ページ表示されています。

固定回線

0.1秒~0.8秒前後

LTE回線

1.3~1.5秒前後

測定サービスの機種別解像度、測定方法、そして実際にリアルユーザーが閲覧する端末の違いで実際は微妙に異なります。

お客様ご利用サーバー

お客様サイトご紹介

占いちゃんは考えた

占い情報を中心に、恋や仕事に 参考したい開運方法・おまじない・パワースポット などスピリチュアル情報を発信しているサイト – 占いちゃんは考えた様

WordPress高速化類似事例

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
目次
閉じる