Производительность

Как исправить CLS (Cumulative Layout Shift)

CLS — метрика визуальной стабильности. Измеряет, насколько сильно «прыгает» контент при загрузке. Хороший показатель: до 0.1.

1

Задайте размеры медиа

Всегда указывайте width и height для изображений и видео, чтобы браузер зарезервировал место.

<img src="photo.jpg" width="800" height="600" alt="...">
2

Зарезервируйте место для рекламы

Добавьте min-height для контейнеров рекламных блоков.

3

Шрифты

Используйте font-display: swap и preload для веб-шрифтов, чтобы избежать сдвига при загрузке шрифта.

@font-face {
  font-family: "MyFont";
  src: url("/fonts/myfont.woff2") format("woff2");
  font-display: swap;
}
4

Не вставляйте контент выше видимой области

Баннеры, уведомления и динамический контент не должны сдвигать основное содержимое.

Проверьте ваш сайт

Запустите аудит и узнайте, есть ли эта проблема на вашем сайте

Запустить бесплатный аудит

Поддержка reChecker

Нашли баг, сбой или ошибку в работе reChecker? Есть предложение по улучшению? Напишите нам, чтобы мы проверили и исправили проблему в сервисе.

Эта форма для обратной связи по работе reChecker. Если нужна разработка или поддержка вашего сайта, отправьте отдельную заявку:

Для ответа укажите минимум один контакт: email или телефон.