Скорость сайта и Core Web Vitals: почему они определяют ваши продажи и позиции в Google

Коротко: Медленный сайт отталкивает клиентов ещё до того, как они увидят ваш продукт, а Google использует скорость взаимодействия со страницей как сигнал ранжирования через три показателя Core Web Vitals: как быстро появляется основной контент (LCP), как быстро страница реагирует на касание (INP) и насколько стабильны элементы во время загрузки (CLS). Хорошие значения: LCP менее 2,5 секунды, INP менее 200 миллисекунд и CLS менее 0,1 — измеренные на ваших реальных пользователях, а не на компьютере разработчика.

Если у вас есть сайт или интернет-магазин, за медлительность вы платите дважды: первый раз, когда раздражённый посетитель уходит, и второй — когда ваши позиции в Google падают и до вас вообще доходит меньше людей. Хорошая новость в том, что скорость сайта можно измерить понятными цифрами и улучшить известными шагами. В этом руководстве объясняются три метрики, способы их измерения и то, как повысить производительность вашего сайта.

Почему лишняя секунда стоит вам клиентов и продаж

Ваш саудовский клиент обычно открывает сайт с телефона, на ходу. Если страница появляется медленно, он закрывает её и уходит к более быстрому конкуренту, не прочитав ни строчки. Скорость — не техническая роскошь, а первое впечатление о том, насколько серьёзно вы работаете: медленный магазин наводит на мысль о медленном обслуживании, а страница, элементы которой прыгают при загрузке, заставляет клиента нажать не туда и потерять доверие. Каждая секунда задержки — это брошенная корзина, незаполненная форма и оплаченная вами реклама, которая так и не превратилась в продажу.

Что такое три показателя Core Web Vitals?

Core Web Vitals — это три официальные метрики Google, которые обобщают качество взаимодействия со страницей:

  • LCP — Largest Contentful Paint: время до появления самого крупного видимого элемента на экране (изображения или заголовка). Цель: менее 2,5 секунды.
  • INP — Interaction to Next Paint: насколько быстро страница реагирует, когда пользователь нажимает или вводит текст. Цель: менее 200 миллисекунд. Эта метрика официально заменила прежнюю метрику FID.
  • CLS — Cumulative Layout Shift: насколько сильно элементы прыгают и смещаются во время загрузки. Цель: менее 0,1.

Google измеряет эти значения по 75-му процентилю реальных посещений вашего сайта; то есть оценка считается «хорошей», когда хорошее значение достигается как минимум для трёх четвертей ваших пользователей, а не на одном быстром устройстве.

Как измерить производительность сайта

Не гадайте — измеряйте. Для начала достаточно бесплатных инструментов Google: PageSpeed Insights даёт оценку страницы и данные реальных пользователей, если они доступны, отчёт Core Web Vitals в Search Console показывает, какие группы страниц на всём сайте требуют доработки, а Lighthouse в браузере обеспечивает быструю лабораторную диагностику. Различайте лабораторные измерения (фиксированная тестовая среда) и полевые измерения (реальный опыт ваших пользователей) — именно последние Google использует для ранжирования.

Распространённые причины медленной работы

  • Большие несжатые изображения, загружаемые в полном размере.
  • Слишком много JavaScript, что задерживает взаимодействие и повышает INP.
  • Отсутствие кеширования и сети доставки контента (CDN) рядом с пользователем.
  • Слабый хостинг или сервер, расположенный далеко от ваших клиентов.
  • Изображения и реклама без заданных размеров, вызывающие смещение макета (CLS).
  • Слишком много сторонних инструментов (аналитика, чат, шрифты), утяжеляющих страницу.

Как ускорить сайт на практике

Основной выигрыш дают известные шаги: сжимайте изображения и отдавайте их в современных форматах, таких как WebP и AVIF, и используйте отложенную загрузку, чтобы они появлялись, когда нужны. Сократите и разделите JavaScript, чтобы страница загружала только необходимое. Включите кеширование и используйте сеть доставки контента, которая приближает ваши файлы к пользователям. Выберите надёжный хостинг с серверами, географически близкими к Саудовской Аравии. Заранее задавайте размеры изображений и рекламы, чтобы избежать смещений. Пересмотрите сторонние инструменты и уберите то, что не приносит пользы. А если на сайте много контента, рассмотрите рендеринг на стороне сервера (SSR), чтобы пользователь получал готовую страницу, а не ждал, пока всё соберётся на его телефоне.

Сначала мобильные

Google использует индексирование с приоритетом мобильных устройств (mobile-first), и большая часть ваших посещений в Саудовской Аравии приходится на телефоны. Измеряйте производительность на мобильных устройствах и при среднем соединении, а не в быстрой офисной сети. Следите за весом арабских шрифтов — некоторые из них тяжёлые и задерживают появление текста; выбирайте оптимизированные шрифты и загружайте их с умом. Быстрая мобильная версия — это более высокие позиции и больше клиентов, завершивших заказ.

Как мы это делаем в Origami

Origami — технологическая компания. Мы создаём сайты и магазины быстрыми по умолчанию, а не дорабатываем скорость в последнюю очередь. Мы используем рендеринг на стороне сервера, оптимизацию изображений и сети доставки, устанавливаем «бюджет производительности», который блокирует любое добавление, замедляющее страницу, и измеряем Core Web Vitals на реальных пользователях после запуска, а не только в лаборатории. В результате получается сайт, который быстро открывается, занимает более высокие позиции в Google и превращает посетителей в клиентов, а не теряет их в первую же секунду.

Заключение

Скорость — это двойная победа: более высокие позиции в Google и более высокая конверсия посетителей. Начните с измерения самых важных страниц с помощью PageSpeed Insights и Search Console, устраните три главные причины медленной работы, а затем измерьте снова. Ускорение загрузки всего на одну секунду может оказаться дешевле и дать эффект быстрее, чем удвоение рекламного бюджета.

Источники

  • Google Search Central — Understanding Core Web Vitals and Google Search results: developers.google.com
  • web.dev — метрики и пороговые значения Core Web Vitals (LCP, INP, CLS): web.dev