Посетитель не знает, сколько весят ваши картинки и скрипты. Он просто видит белый экран, ждёт пару секунд и закрывает вкладку. Скорость — это не техническая мелочь, а часть пользовательского опыта, и поисковики учитывают её при ранжировании.
Три метрики, на которые смотрит Google
Набор метрик Core Web Vitals описывает, как сайт ощущается для живого человека:
- LCP (Largest Contentful Paint) — когда появляется главный элемент первого экрана: баннер, заголовок или фото товара. Хороший показатель — до 2,5 секунды.
- INP (Interaction to Next Paint) — как быстро страница откликается на нажатия. Хорошо — до 200 миллисекунд. Эта метрика в 2024 году заменила FID.
- CLS (Cumulative Layout Shift) — насколько «прыгает» вёрстка при загрузке. Хорошо — до 0,1. Это та самая кнопка, которая уезжает в момент нажатия.
Проверить свой сайт можно в PageSpeed Insights: он показывает и лабораторные замеры, и данные реальных посетителей.
Что чаще всего тормозит сайт
- Тяжёлые изображения. Фото по несколько мегабайт, загруженные «как есть» с камеры.
- Лишние скрипты. Виджеты, чаты, счётчики, которые подключали годами и забыли отключить.
- Тяжёлые темы и конструкторы. Шаблоны «на все случаи жизни» загружают код для функций, которыми вы не пользуетесь.
- Медленный хостинг и отсутствие кэширования.
- Шрифты, которые грузятся последними и перерисовывают весь текст.
Исправления с максимальным эффектом
- Конвертировать изображения в WebP или AVIF и отдавать нужный размер под каждый экран.
- Включить ленивую загрузку для картинок и видео ниже первого экрана.
- Убрать неиспользуемые плагины и скрипты, а сторонние виджеты загружать после основного контента.
- Задать размеры для изображений и блоков, чтобы вёрстка не прыгала.
- Подключить кэширование и сжатие на сервере.
- Загружать шрифты заранее и только нужные начертания.
Красиво и быстро — это возможно
Иногда кажется, что анимации и 3D несовместимы со скоростью. Это не так: тяжёлые сцены можно загружать после первого экрана, отключать на слабых устройствах и для тех, кто включил в системе уменьшение движения. Так мы делаем и на собственном сайте.
Если сайт работает медленно — закажите технический аудит или доработку сайта: найдём узкие места и предложим план ускорения.
