CLS (Cumulative Layout Shift)

CLS (Cumulative Layout Shift)

2 мин.
18

CLS (Cumulative Layout Shift) — это метрика из набора Core Web Vitals, которая измеряет насколько сильно и часто элементы страницы неожиданно смещаются во время загрузки и взаимодействия пользователя.



CLS (Cumulative Layout Shift) — это метрика из набора Core Web Vitals, которая измеряет насколько сильно и часто элементы страницы неожиданно смещаются во время загрузки и взаимодействия пользователя.

Проще говоря, CLS отвечает на вопрос:
«Насколько стабильно отображается страница?»

SEO под ключ: превратите сайт в рабочий канал продаж Подробнее

Что считается смещением макета

Смещение происходит, когда:

  • текст или кнопки «прыгают» во время загрузки,

  • элементы резко меняют своё положение,

  • пользователь пытается кликнуть, но элемент уезжает,

  • контент сдвигается из-за поздней загрузки изображений, шрифтов или рекламы.

Важно: учитываются только неожиданные смещения.

Нормальные значения CLS

  • ≤ 0,1 — хороший показатель

  • 0,1–0,25 — требуется улучшение

  • > 0,25 — плохой пользовательский опыт

CLS — это безразмерная метрика, а не время.

Почему CLS важен для SEO

CLS:

  • является фактором ранжирования Google,

  • напрямую влияет на удобство использования сайта,

  • повышает количество ошибочных кликов,

  • ухудшает восприятие качества сайта.

Даже быстрый сайт может проигрывать в SEO из-за «прыгающего» интерфейса.

CLS и ИИ-поиск

В контексте ИИ-поиска CLS важен потому что:

  • нестабильные страницы реже воспринимаются как качественные источники,

  • ухудшается поведенческий сигнал,

  • снижается доверие к сайту как источнику данных,

  • падает вероятность использования контента в ИИ-ответах.

ИИ предпочитает источники с предсказуемым и стабильным отображением контента.

Основные причины высокого CLS

  • изображения и видео без заданных размеров

  • рекламные блоки без резервированного места

  • динамически вставляемый контент

  • веб-шрифты без font-display

  • сторонние скрипты

Как снизить CLS

  • всегда задавать размеры изображений и видео

  • резервировать место под рекламу

  • избегать вставки контента над уже загруженным

  • использовать font-display: swap

  • контролировать работу сторонних скриптов

Экономьте до 90% времени на продвижение Подробнее

CLS

— это показатель визуальной стабильности.
В современном SEO и ИИ-поиске выигрывают сайты, где интерфейс не мешает пользователю получить ответ и не создаёт раздражения.

Понравилась статья?

(Голосов: 5, Рейтинг: 5)

Другие термины

Свежие статьи