Web
CLS
上級読み方：シーエルエス｜英語：Cls
Cumulative Layout Shift の略。ページ読み込み中にレイアウトがずれる量を示す指標。
やさしい説明
CLSは、ページの読み込み中にレイアウトがガタッとずれる量を数値化した指標です。
広告や画像が遅れて表示されて、読んでいた文章が突然ずれる体験を減らすための指標です。
具体例・使い方
画像にwidth/heightを指定しないと、読み込み後にレイアウトがずれてCLSが悪化する
良好: 0.1以下、改善が必要: 0.25以上
よくある疑問
Q: CLSを改善するには？
A: 画像にwidth/heightを指定する、フォントの読み込みでレイアウトがずれないようにするのが基本です。