ノウハウ
PR

【簡単解決】LCP の問題2.5秒 超(モバイル)の改善方法!

wp@taki7-
※アフィリエイト広告を利用しています

 突然、Google Search Console で「LCP の問題2.5秒 超(モバイル)」が表示されたため、色々調べた結果、解決が出来ましたので、その対応法について記事として纏めました。参考にして頂けますと幸いです。


結論
 Flying Scriptsプラグインを導入し、遅延読込するJavaScript名を指定することで改善が見込めます。

記事内広告

そもそもLCPとは

画像:問題時の値

 Google検索の検索結果に影響するCore Web Vitalsの指標の1つである。 
そのため、LCPの改善が検索結果に良い影響を与えると考えます。

LCPは、Largest Contentful Paint(LCP)と言う。そのサイトの最も大きなコンテンツを測定し、Googleが決めたページ読込時間の基準で判定する。

Googleが決めた基準は下記の通り

  • 2.5 秒以下 : 良い(高速)
  • 4.0 秒以下 : 問題あり(中程度)
  • 4.0 秒以上 : 非常に問題(遅い)

参考:
https://developers.google.com/search/docs/appearance/core-web-vitals?hl=ja

https://web.dev/articles/lcp?hl=ja

LCP の問題をPageSpeed Insightsで確認

画像:改善前の数値
画像:改善前のLCP値

 PageSpeed Insightsのパフォーマンス結果は、下記の通り。

LCPは、基準の2.5秒以内を大きくオーバーとなります。

  • パフォーマンス:31
  • LCP:4.28秒
    ※使用していないJavaScriptの削減
    ※レンダリングを妨げるリソースの除外
    ※使用していないCSSの削減

Flying Scriptsプラグインをインストール

画像:プラグイン追加画面

 Flying Scriptsは、JavaScript の実行を遅らせる遅延プラグインです。

 JavaScript ファイルに優先順位付けし、スクリプトを読込することで、ページ読込速度が改善。その結果、LCPの改善が期待出来る。

※設定後はサイトに不具合が無いかは確認が必要

WordPress → プラグイン → 新規追加より、Flying Scriptsをインストールする。

下記画像は、Flying Scriptsの設定画面。
Include Keywords」の項目に指定するJavaScript名については、次の手順で調査します。

画像:Flying Scripts設定画面

LCPの問題があるJavaScriptキーワードの確認方法

画像:PageSpeed Insights

 再び、PageSpeed Insightsの画面に戻ります。
※ここからは、サイト毎にJavaScript名が異なります(画像は筆者サイトの場合)

 「パフォーマンスの問題を診断する」の下に、「改善できる項目」があるので、『使用していないJavaScriptの削減』をクリック。すると、Google的に改善が必要なJavaScript名が表示される。

 筆者サイトの調査結果(同じ場合は、JavaScript名をコピペOK)

  • adsbygoogle.js
  • gtag
  • gtm.js
  • www-widgetapi.js
  • vcdal.js

①キーワード:adsbygoogle.js

②キーワード:gtag

③キーワード:gtm.js

④キーワード:www-widgetapi.js

⑤キーワード:vcdal.js

Flying ScriptsプラグインでJavaScript名を指定

画像:設定画面

 再び、WordPress のFlying Scriptsプラグイン設定画面へ戻ります。

  1. 調査したJavaScript名を「Include Keywords」へ記載
  2. Timeoutはそのまま
  3. Save Changesをクリック

PageSpeed InsightsでLCPの問題が改善したか確認を実施

 下記の画像をご確認ください。プラグインの設定だけで大幅な改善となりました。

  • パフォーマンス:31 → 74(+43)
  • LCP:4.28秒 → 1.17秒(-3.11)
    ※使用していないJavaScriptの削減
    ※レンダリングを妨げるリソースの除外
    ※使用していないCSSの削減
画像:改善前
画像:改善後
画像:改善前
画像:改善後

Google Search ConsoleでLCP の問題解決をGoogleへ通知

画像:解決後の値

 以上、PageSpeed InsightsでLCPの改善を確認しましたので、最後にGoogle Search Consoleにて、LCP の問題解決をGoogleへ通知します。

 修正の検証をクリック後のメッセージでは、「28日以内に完了します」と記載でしたが、自分の場合は上記の通り、翌日には問題が解決しておりました。

画像:修正検証依頼前
画像:修正検証依頼後

まとめ

 Flying Scriptsプラグインを導入し、問題のJavaScript名を指定するだけで、LCP の問題2.5秒 超(モバイル)が改善されるため、お勧めします。

 導入する事でLCP以外にパフォーマンスの改善効果があると思いますので、プラグインを増やしたくない方でも検討してみては如何でしょうか。

この記事を読んで役に立ちましたら幸いです。

PR:X(旧Twitter)をやっています。
下記から行けますので、良かったら応援をお願いします。

 X(旧)ツイッターでアフィリエイトでお小遣いが稼げるマネートラックの使用体験を記載しています。

合わせて読みたい
【マネートラック】X(旧ツイッター)で簡単アフィリエイト活動!口コミは?
【マネートラック】X(旧ツイッター)で簡単アフィリエイト活動!口コミは?
合わせて読みたい
ふるさと納税の仕組みから人気の返礼品が分かる!初心者向け!!
ふるさと納税の仕組みから人気の返礼品が分かる!初心者向け!!
Twitterからの読者コメントをお待ちしています。
ブログ更新の励みになります!
ABOUT ME
タキ
タキ
ブロガー
 平凡なIT企業に勤める会社員であり、一児のパパです。

 元々、お得、節約に関する事が好きであったため、それに関するブログを掲載しますが、自分のノウハウ等も読者さんが有益と思えば、記事にしようと思います。

まだまだ修行中ですが、YouTubeのリベ大等で学習しています。シティにはまだ入っていませんが、ブログ仲間も募集中!

 また、投資歴は、2008年のリーマンショックを経験していてブログは初心者ですが、ベテランと思います。 Twitterで独り言を言ってますので、そちらも良かったら、覗きに来てくれたら嬉しいです。

▼活動履歴
・2022年10月から
SNSでアフィリエイト活動開始

・2023年1月より
「タキの生活情報ブログ」立上げ試行錯誤しながら、サイトを育てています。
いつかは、会社に依存しない人生。将来は、個人事業主になるのが目標です。
Multiplex広告
記事URLをコピーしました