Разработка
LCP
Также говорят: загрузка основного содержимого
LCP — время, за которое на экране появляется крупнейший видимый элемент страницы: главное изображение, баннер или большой блок текста. Этот показатель отражает, как быстро человек видит основное содержимое. Хорошим считается LCP до 2,5 секунды.
Почему это важно
Пока главный элемент не загрузился, человек видит пустую или неполную страницу и может уйти. LCP входит в набор показателей скорости и удобства, которые поисковые системы учитывают при оценке страниц, особенно на мобильных устройствах.
Оценка
| LCP | Оценка |
|---|---|
| До 2,5 секунды | Хорошо |
| 2,5–4 секунды | Требует улучшения |
| Больше 4 секунд | Плохо |
Что замедляет LCP
- Тяжёлые изображения — большие фото без сжатия и в устаревших форматах.
- Медленный ответ сервера — страница долго начинает загружаться.
- Блокирующие скрипты и стили — браузер ждёт их загрузки, прежде чем показать содержимое.
- Главный элемент подгружается скриптом — сначала загружается код, потом картинка.
- Ленивая загрузка главной картинки — её загрузка откладывается, хотя она видна сразу.
Как ускорить
- Сжимайте изображения и используйте современные форматы.
- Подбирайте размер изображения под экран: не отдавайте мобильному устройству картинку для большого монитора.
- Не откладывайте загрузку главного изображения первого экрана, а заранее подсказывайте браузеру загрузить его.
- Уменьшите количество скриптов, которые загружаются до показа содержимого.
- Ускорьте ответ сервера: кэширование, хостинг, сеть доставки контента.
Как проверить
- Сервисы проверки скорости покажут значение LCP и сам элемент, который считается крупнейшим.
- В панели для вебмастеров смотрите данные реальных пользователей по группам страниц.
- Проверяйте прежде всего шаблоны: карточку товара, категорию, статью — исправление шаблона улучшает сразу тысячи страниц.
Скорость и продажи
Быстрая страница — это не только оценка поисковой системы. Чем быстрее человек видит товар и цену, тем меньше шанс, что он уйдёт до того, как страница загрузилась. Особенно это заметно в рекламе, где за каждый клик заплачено.
Типичный пример
На главной странице стоит большой слайдер с фотографиями по 2–3 мегабайта каждая. На мобильном интернете первый слайд загружается несколько секунд, и всё это время человек видит пустой блок. Сжатие фото, отдельная уменьшенная версия для телефонов и отказ от слайдера в пользу одного статичного изображения часто сокращают LCP в разы.
С чего начать
Проверьте три шаблона, на которые приходит больше всего трафика, и найдите у каждого элемент, который определяет LCP. Чаще всего проблему решает оптимизация одной-двух картинок или отказ от тяжёлого скрипта на первом экране.
Где термин используется на практике
Ниже — материалы, где понятие участвует в расчёте, настройке или принятии решения, а не просто упоминается.
