Core Web Vitals は、実際の訪問者がページをどのように感じるかを表すために Google が使用する 3 つの数値です。メイン コンテンツが表示される速度、ページがタップに反応する速度、レイアウトが飛び回る速度です。これらは Google のページ エクスペリエンス シグナルの一部であり、さらに重要なのは、訪問者が諦める瞬間を追跡することです。ここでは、WordPress サイトでのそれぞれの測定値と、赤になったときに最初にどこを見るべきかを示します。
3 つの指標とその目標
- LCP (最大コンテンツフル ペイント): ビューポート内で最大の画像またはテキスト ブロックが描画されるまでの時間。 2.5 秒以内が良好です。
- INP (次のペイントへのインタラクション): 訪問全体にわたって、クリック、タップ、またはキーを押した後、ページが視覚的に応答するまでにかかる時間。 200 ミリ秒以下が良好です。 INP は、2024 年 3 月に First Input Delay をコア Web Vital として置き換えました。
- CLS (累積レイアウト シフト): 表示されているコンテンツがどれだけ予期せず移動するか。良好は0.1以下です。
Google は、実際の訪問数をモバイルとデスクトップに分けて 75 パーセンタイルでページを判断します。オフィスの Wi-Fi に接続された高速ラップトップではほとんど何もわかりません。重要な数字は、通常の接続を使用する通常の電話からのものです。定義としきい値は次のとおりです。 web.dev の Web Vitals の概要。
何かを変更する前に測定する
主要なページを実行する ページスピードに関する洞察。サイトに十分なトラフィックがある場合、上部のセクションには Chrome ユーザーからのフィールド データが表示されます。以下のラボ セクションは、単一のシミュレートされた負荷です。フィールド データが示す内容を修正し、ラボ レポートを使用して原因を見つけます。 Search Console の Core Web Vitals レポートは類似の URL をグループ化しているため、1 つのテンプレート修正で数百のページをクリアできます。
LCPの改善
ほとんどの WordPress サイトでは、LCP 要素は投稿のヒーロー画像または注目の画像です。 LCP が遅くなる一般的な原因は、サーバーの応答が遅いこと、画像が大きいこと、ブラウザーが画像を発見するのが遅いことです。
- ヒーロー画像を、元のアップロードではなく、表示されているサイズで WebP または AVIF で提供します。
- 画像をスクロールせずに見える範囲に遅延読み込みしないでください。 WordPress が追加
フェッチ優先度 = "高"最初の大きな画像へ。テーマまたはプラグインによって元に戻されていないことを確認してください。 - ページ キャッシュを使用して、HTML がすぐに届くようにします。まともなホスティングではキャッシュされたページは 1 秒以内に到着し始めるはずです。
- Web フォントをロードする
フォント表示: 交換最初の画面に必要な 1 つまたは 2 つのファイルのみをプリロードします。
の LCP ガイドの最適化 メトリクスを 4 つの部分に分割します。これは、修正が明らかでない場合に役立ちます。
INPの向上
INP は JavaScript に関するものです。メインスレッドがスクリプトの実行でビジー状態の場合、タップは待機する必要があります。スライダー、チャット ウィジェット、トラッキング タグ、および大規模なバンドルを配布するページ ビルダーが一般的な原因です。
- 使用しなくなったプラグインを削除し、残りのプラグインがフロントエンドに何をロードするかを確認します。
- チャット ウィジェットやヒートマップなど、最初のインタラクションに必要のないサードパーティ スクリプトを遅延させます。
- イベントハンドラーは短くしてください。クリック後の重い作業は分割するか、メインスレッドから移動する必要があります。
CLSの改善
レイアウトのシフトは、何かが表示されてコンテンツが押し下げられると発生します。サイズのない画像、テキスト サイズを変更する遅延読み込みフォント、コンテンツの上に挿入された Cookie バナー、予約されたスペースのない広告がそのほとんどの原因です。
- すべての画像とビデオに幅と高さを与えるか、
アスペクト比CSSで。 - ページを押し下げるのではなく、画面の下部にバナーをオーバーレイとして表示します。
- アニメーション化する
変換するそして不透明度、レイアウトは移動しません。
速度も SEO の管理です
速いページでは弱いコンテンツは救われず、遅いページにある良質なコンテンツは読む前に訪問者を失ってしまいます。 Core Web Vitals を、タイトル、サイトマップ、内部リンクと同じルーチンの一部として扱います。私たちの WordPress SEO チェックリスト そのルーチンの残りの部分をカバーします。
FluxWP が役立つところ
磁束速度 管理内からの遅いリクエストと大量のクエリが表示されるため、どのプラグインまたはページが時間を費やしているかを確認できます。 FluxWP プラグインは 1 つの管理システムと 1 つのデザイン システムを共有するため、フォーム、チームの受信箱、分析を使用するサイトでは、3 つではなく 1 つのアセット セットが読み込まれます。ボトルネックがサーバーの場合、 マネージドホスティングプラン キャッシュを使用してセットアップされ、WooCommerce 用に調整されています。
