「CLS」「LCP」「FID」ってなに?

この記事を読むのに必要な時間は約 8 分です。

このブログは基本的に、メンタルセラピストやスピリチュアル系を仕事にしたい方で、ブログを書いている方でITが苦手な方を対象にしています。

この記事で伝えたいこと
  • CLS LCP FIDとは?
  • 対応しないとどうなる
  • 改善策は?

サチコ(Google Search console)の項目の中にウェブに関する主な指標という項目がありその問題点としてCLS LCP FIDという項目が出てきます。

ページの読み込み速度もSEOの項目として必要になってきています。

最近のSEOとしてユーザエクスペリエンス(UX・ユーザー体験)を向上させることは重要な要素で特にページが表示されるまでの読み込み時間は改善しておきたい部分と言えます。

Googleは2020年5月29日にCore Web Vitals (コアウェブバイタル)という指標を検索ランキングの要因に組み込むと発表しています。

Core Web Vitals (コアウェブバイタル)はページの表示速度、ユーザ操作の反応性、視覚要素の安定性の3つの要素でユーザーエクスペリエンス(UX・ユーザー体験)を評価しているようです。

サーチコンソールのウェブに関する主な指標を見てみると、モバイル、PCの2項目で、それぞれ不良URL、改善が必要なURL、良好URLというように各記事が評価されそれぞれが何件あるか確認できるようになっています。

優良URLでは出てきませんが、改善が必要なURL、不良URLの項目に出てくる3つの指標となる怪しげな3文字のアルファベットそれがCLS LCP FIDです。

サーチコンソールのヘルプにはそれぞのれ指標の意味も書かれています。

CLS(Cumulative Layout Shift)

ウェブページが読み込まれるときのページレイアウトの移動量を示しています。

評価スコアの範囲は 0~1 で、0 は移動なし、1 は移動量が最大を意味します。


LCP(Largest Contentful Paint)

ユーザーが URL をリクエストしてから、ビューポートに表示される最大のコンテンツ要素がレンダリングされるまでの時間。

FID(First Input Delay)

最初にページ内でリンクのクリックなどの操作をして、その操作にブラウザが応答するまでの時間。

下の表はそれぞれの指標が優良、改善が必要、不良となる基準です。

優良 改善が必要 低速(不良)
CLS 0.1以下 0.25以下 0.25を超える
LCP 2.5以下 4以下 4を超える
FID 100ミリ秒以下 300ミリ秒以下 300ミリ秒を超える

 

言葉の意味を理解できなくてもOKです

ウェブに関する説明の多くが直訳や専門用語であるため、説明を読んでもチンプンカンプンになることもよくあると思います。今回はそこまで深く理解する必要はありません。ざっくりと読み込みを早くするために必要な指標という程度に覚えておいてください。


「CLS」「LCP」「FID」が不良や改善が必要のままだとどうなる?

この指標だけで全てが決まるわけではありませんが、Googleで検索されるときに上位に表示されなくなる可能性があります。

目の色を変えて何がなんでも良好にしなければというわけではありませんが、それでも順位は下がっていくかもしれません。

実際に僕が運営しているサイトで不良になっている記事は順位が大きく下がる時があったりします。

重要なのはあなたの記事でユーザが問題や悩み事の解決に役に立っているかということの方が重要ですが、表示されるまでの時間が遅いとそれだけで読んでもらえないということもあるのである程度の改善は指定おいた方がいいように思います。

「CLS」「LCP」「FID」を良好にするには

CLS  LCP FID とは、ページにおける速さについての指標です。

それぞれを「良好」の状態にすることがSEOとしてよいということになります。

CLS ページを読み込むときにレイアウトの移動しない(動かない)ようにする。(0.1未満の移動量にする)

LCP 2.5秒内に画面に全体の表示領域にページが表示される状態にする。

FID ページ内でリンクのクリック(タップ)などの操作をして場合、100ミリ秒内でブラウザが応答する状態にする。

説明を書きながら思うのが、書いている僕自身も若干チンプンカンプンなところもあります。

つまりどういうことかというとシンプルにいうとページが読み込まれてから完全に表示されるまでレイアウトを崩さず素早く表示できるページが良い評価ということになります。


素早く表示するためにはどうすればいい?

要するにどれだけあなたの記事が素早く表示できるかがSEOの今後の鍵の一つになってきますということです。

では素早く表示させるためにはどうすればいいかとというとデータ量の削減と応答速度の改善、そしてレンダリングを素早く行うということになってきます。

データ量の削減については画像サイズや画像フォーマットを改善することが簡単にできる改善方法です。

WordPress 画像をWebP対応させて表示を軽くしよう」や「アメブロに載せる画像はサイズ調整と圧縮で軽くして使う」で紹介していますが画像の横幅を最適なサイズに調整しWebP形式に変換したり「Smart PNG and JPEG compression 」で圧縮をかけることで数十キロバイトにまでファイルサイズを抑えることができます。

他にもキャッシュ用のプラグインを利用してCSSやJAVA Scriptを圧縮するという方法もありますが知識が必要なので割愛します。

まとめ

Googleサーチコンソールなんて使ったことがないどう使えばいいかわからないということが多いと思います。

そうした中で表示速度を速くするための指標が出ていてそれの改善したほうがよいページを教えてくれます。

WordPressの場合は記事をたくさん書くことも重要ですが、ひとつ一つの記事を育てていくことがアクセスにつながり、集客につながり収入につながってきます。

ブログ記事というのはあなたの代わりに営業をしてれるツールです。

多くに人の目に留まることが重要なのでこうしたことを疎かにしないようにしたいですね。

最後までお読みいただきありがとうございます。

今回の記事があなたの役に立ったなら幸いです。

質問疑問ございましたらコメント欄へお願いします。