Как ускорить сайт: почему он медленно грузится и что делать

Сайт медленно грузится чаще всего из-за тяжёлых изображений, лишних скриптов и виджетов, слабого хостинга и отсутствия кеширования. Чтобы его ускорить, сначала измерьте скорость и найдите конкретную причину, а потом исправляйте по порядку — от самых дешёвых и эффективных мер к сложным. Ниже — как измерить скорость, разбор частых причин, что делать с каждой, особенности WordPress и Тильды и чек-лист. Статья для владельцев сайтов, маркетологов и тех, кто ставит задачи разработчикам.

Что значит «сайт грузится быстро»

Скорость — это не одно число. Посетитель замечает три вещи: как быстро появился основной контент, как быстро страница отвечает на нажатия и не прыгает ли вёрстка, пока он читает. Google описывает эти три стороны метриками Core Web Vitals (справка Google Search Central).

Пороги взяты из справки по отчёту Core Web Vitals в Search Console. Оценка ставится по 75-му процентилю: страница считается хорошей, если порог выполнен как минимум для 75% посещений. INP в 2024 году заменил прежнюю метрику FID.

Кроме трёх основных метрик полезно смотреть TTFB — время до первого байта ответа сервера. Это не Core Web Vitals, но по нему сразу видно, тормозит ли сервер. Если TTFB большой, оптимизация картинок проблему не решит.

Как измерить скорость сайта

Лабораторные и полевые данные

Это главное, что нужно понять до начала работ. Инструменты показывают два разных вида данных:

Так это описывает и документация PageSpeed Insights: лабораторные данные удобны для отладки, а полевые показывают реальный опыт посетителей. Решения принимайте по полевым данным, а исправления проверяйте по лабораторным.

PageSpeed Insights

PageSpeed Insights — бесплатный сервис Google. Вставьте адрес страницы и получите два блока. Сверху — полевые данные Core Web Vitals, если по странице или сайту накопилось достаточно посещений. Ниже — лабораторный тест Lighthouse с оценкой от 0 до 100 и списком рекомендаций.

• проверяйте мобильную и десктопную версии отдельно — результаты сильно различаются;
• тестируйте не только главную, а шаблоны: карточку товара, категорию, статью, страницу услуги;
• лабораторная оценка «плавает» от запуска к запуску — делайте несколько замеров;
• не гонитесь за 100 баллами: цель — зелёные полевые метрики, а не идеальная оценка.

Отчёт Core Web Vitals в Search Console

Отчёт показывает полевые данные по всему сайту, а не по одной странице. Адреса со схожими показателями объединены в группы, статус LCP, INP и CLS присваивается группе целиком. Мобильные и десктопные данные выводятся отдельно (справка Search Console). Отчёт удобен, чтобы найти проблемный шаблон: если «красная» вся группа карточек товаров, причина в шаблоне, а не в отдельной странице.

Яндекс Метрика

В Метрике есть отчёт «Время загрузки страниц»: Отчёты → Мониторинг → Время загрузки страниц. Он строится по реальным визитам и разбивает загрузку на этапы: DNS, соединение, ответ сервера, обработку HTML, загрузку DOM, начало отрисовки (справка Метрики). Данные можно смотреть по разным квантилям и сегментам — например, отдельно для мобильных и по городам.

Метрика особенно полезна, если аудитория в основном в России: она видит всех посетителей с установленным счётчиком, а не только пользователей Chrome.

Lighthouse и вкладка Network в браузере

Для разработчика основной инструмент — Chrome DevTools. Lighthouse даёт тот же лабораторный отчёт, что и PageSpeed Insights, но локально. Вкладка Network показывает каждый файл: размер, время загрузки и порядок. Вкладка Performance — что именно занимает основной поток браузера и мешает INP.

Почему сайт медленно грузится: частые причины

Причины обычно складываются: сайт на медленном хостинге плюс тяжёлые картинки плюс десяток виджетов. Ниже — самые частые, примерно в порядке того, как часто их находят при проверке.

Тяжёлые изображения

Самая частая причина. Фото загружают «как с камеры» — несколько мегабайт и тысячи пикселей в ширину, а на экране показывают в размере превью. Слайдер на первом экране с пятью такими фото почти гарантирует плохой LCP на мобильных.

Много скриптов и виджетов

Онлайн-чат, виджет обратного звонка, квиз, всплывающие окна, карты, видео с YouTube, кнопки соцсетей. Каждый виджет тянет свои скрипты, стили и шрифты с чужих серверов. JavaScript занимает основной поток браузера, и страница медленнее реагирует на действия — страдает INP.

Сторонние счётчики и пиксели

Метрика, Google Analytics, пиксели соцсетей, коллтрекинг, системы ретаргетинга. По отдельности они обычно не страшны, но вместе заметно нагружают страницу. Часть из них ставили под давно закончившиеся рекламные кампании и забыли убрать.

Слабый хостинг и медленный ответ сервера

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

Нет кеширования

Без кеша CMS собирает страницу заново для каждого посетителя: запросы к базе, выполнение PHP, обработка шаблонов. Без браузерного кеша посетитель при каждом переходе заново скачивает стили, скрипты и шрифты.

Нет сжатия

HTML, CSS и JavaScript — текстовые файлы, они хорошо сжимаются. Если сервер отдаёт их без сжатия gzip или Brotli, объём передаваемых данных в разы больше нужного.

Тяжёлая тема и лишние плагины

Универсальные темы и визуальные конструкторы страниц подключают на каждую страницу стили и скрипты всех своих блоков, даже неиспользуемых. Плагины добавляют свои файлы и запросы к базе. Один плохо написанный плагин может замедлить весь сайт.

Веб-шрифты

Несколько семейств шрифтов в разных начертаниях — это несколько сотен килобайт. Пока шрифт не загружен, текст может быть невидим, а после загрузки — сдвигаться, ухудшая CLS.

Устаревшая версия PHP и неоптимальная база данных

Новые версии PHP работают быстрее и получают исправления безопасности. Старые ветки перестают поддерживаться — график есть на официальной странице PHP. База данных со временем обрастает мусором: ревизии записей, временные данные, логи плагинов.

Как связать симптом и причину

Как ускорить сайт: что делать по каждой причине

Оптимизируйте изображения

• Современные форматы. WebP и AVIF при том же качестве обычно легче JPEG и PNG. WordPress принимает WebP с версии 5.8 и AVIF с версии 6.5.
• Правильный размер. Не загружайте картинку шириной 4000 пикселей для блока шириной 600. Используйте атрибуты srcset и sizes, чтобы телефон получал уменьшенную версию.
• Сжатие. Прогоняйте изображения через оптимизатор перед загрузкой или подключите автоматическое сжатие на сервере.
• Размеры в вёрстке. Указывайте width и height или задавайте пропорции в CSS — браузер заранее оставит место, и вёрстка не прыгнет.
• Отказ от тяжёлых слайдеров на первом экране в пользу одного статичного изображения.

Включите отложенную загрузку (lazy loading)

Атрибут loading="lazy" откладывает загрузку изображений и фреймов, пока посетитель не докрутит до них. Он поддерживается всеми основными браузерами.

Настройте кеширование

• Страничный кеш — сервер отдаёт готовый HTML без выполнения PHP и запросов к базе. Делается плагином CMS, модулем сервера или на уровне хостинга.
• Браузерный кеш — заголовки Cache-Control для статических файлов, чтобы стили, скрипты и картинки не скачивались заново при каждом переходе.
• Объектный кеш — Redis или Memcached хранят результаты запросов к базе. Полезен для магазинов и сайтов с личными кабинетами.

Кеш нужно аккуратно настраивать для корзины, личного кабинета и форм. Иначе один посетитель увидит корзину другого или устаревшую цену.

Подключите сжатие

Включите на сервере сжатие Brotli или gzip для HTML, CSS, JavaScript, SVG и JSON. На большинстве хостингов это одна настройка в панели или несколько строк в конфигурации сервера. Картинки в форматах JPEG, WebP, AVIF уже сжаты — повторно их не сжимают.

Используйте CDN

CDN — сеть серверов, которые хранят копии статических файлов ближе к посетителю. Он полезен, если аудитория распределена по разным регионам или стране, а сервер стоит в одном месте. Для сайта, который работает на один город и размещён на хостинге в том же регионе, эффект может быть небольшим.

Наведите порядок в скриптах

1. Составьте список всех внешних скриптов: счётчики, пиксели, чаты, виджеты.
2. Удалите всё, что больше не используется или дублирует друг друга.
3. Оставшиеся подключите с атрибутами defer или async, чтобы они не блокировали отрисовку.
4. Тяжёлые виджеты — чат, карту, видео — загружайте по действию: по клику, при прокрутке до блока или с задержкой.
5. Вместо встроенного видеоплеера показывайте превью-картинку, а плеер загружайте по клику.
6. Отключите ненужные функции: например, Вебвизор Метрики, если вы не смотрите записи.

Оптимизируйте шрифты

Рекомендации из руководства web.dev по шрифтам:

• используйте только формат WOFF2;
• сократите число семейств и начертаний, рассмотрите вариативный шрифт или системные шрифты;
• оставьте в файле только нужные наборы символов — кириллицу и латиницу;
• задайте font-display: swap показывает текст сразу системным шрифтом, optional лучше для скорости;
• если шрифты грузятся со стороннего сервиса, добавьте preconnect к его домену;
• замените иконочные шрифты на SVG.

Обновите PHP и оптимизируйте сервер

• переведите сайт на поддерживаемую версию PHP — после проверки совместимости на тестовой копии;
• включите OPcache, если хостинг не сделал этого сам;
• если TTFB большой даже с кешем — смените тариф или хостинг: VPS, больше памяти, сервер ближе к аудитории;
• включите HTTP/2 или HTTP/3 — на современных хостингах это обычно уже сделано;
• почистите базу данных и проверьте медленные запросы.

Смена хостинга — это перенос сайта со своими рисками. Как сделать его аккуратно, разобрали в статье как перенести сайт без потери позиций.

Уберите сдвиги вёрстки (CLS)

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

Улучшите отклик на действия (INP)

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

В каком порядке ускорять сайт

Не начинайте с переписывания темы. Идите от простого и дешёвого к сложному и проверяйте эффект после каждого шага.

1. Замер. Полевые данные в Search Console и Метрике, лабораторный тест ключевых шаблонов в PageSpeed Insights. Зафиксируйте исходные цифры.
2. Копия сайта. Любые работы по скорости — после резервной копии.
3. Сервер. Если TTFB большой — кеширование страниц, версия PHP, сжатие, тариф хостинга.
4. Изображения. Форматы, размеры, сжатие, отложенная загрузка ниже первого экрана.
5. Скрипты. Ревизия счётчиков и виджетов, defer и загрузка по действию.
6. Шрифты и CSS. Меньше начертаний, WOFF2, font-display, удаление неиспользуемых стилей.
7. Тема и плагины. Отключение лишнего, замена тяжёлых решений.
8. Повторный замер. Лабораторные данные — сразу. Полевые накапливаются 28 дней, поэтому итог по Search Console смотрите примерно через месяц.

Скорость не исправляют один раз навсегда. Новый виджет, плагин или баннер может вернуть проблему, поэтому проверку скорости включают в регулярные работы по сайту. Что ещё в них входит, разобрали в статье техническая поддержка сайта: что входит и как её организовать.

Скорость — часть технической оптимизации сайта. Остальные её пункты — индексация, дубли, редиректы, мобильная версия — собраны в статье о внутренней и технической оптимизации.

Особенности WordPress

На WordPress скорость чаще всего упирается в тему, плагины и хостинг, а не в сам движок.

• Поставьте один плагин кеширования. Два плагина кеша одновременно конфликтуют и могут сломать сайт.
• Проверьте, сколько плагинов подключают свои файлы на каждую страницу. Слайдер, который нужен только на главной, не должен грузиться в статьях.
• Визуальные конструкторы страниц удобны, но тяжелы. Для новых проектов сравните их с блочным редактором.
• Держите PHP и базу данных на версиях из требований WordPress — сейчас там рекомендован PHP 8.3 и новее.
• Ограничьте число ревизий записей и периодически чистите базу от мусора.

Подробнее — в руководстве WordPress по оптимизации и в нашей статье SEO для сайта на WordPress.

Особенности Тильды

На Тильде сервер, кеш и сжатие на стороне платформы, поэтому возможностей для ускорения меньше. Основное — то, что вы добавили на страницу сами. Рекомендации из справочного центра Тильды:

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

SEO-настройки Тильды разобрали в статье SEO на Тильде.

Как скорость влияет на SEO и конверсию

Google

Google прямо пишет, что Core Web Vitals используются его основными системами ранжирования, и рекомендует добиваться хороших показателей. Но там же оговорено: Google всегда стремится показать самый релевантный контент, даже если удобство страницы не идеально. Хорошее удобство помогает, когда полезных ответов на запрос много (справка о page experience).

Практический вывод: скорость не вытащит в ТОП слабую страницу, но может дать преимущество перед сопоставимыми конкурентами.

Яндекс

Яндекс не публикует порогов скорости, аналогичных Core Web Vitals, и не раскрывает её вес в ранжировании. Ориентируйтесь на поведение посетителей: если страница долго открывается, человек возвращается в выдачу и выбирает другой сайт. Следить за скоростью для аудитории из России удобно по отчёту Метрики.

Конверсия

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

Частые ошибки при ускорении сайта

• Гонка за 100 баллами в PageSpeed Insights вместо улучшения полевых метрик.
• Lazy loading на главной картинке — LCP становится хуже, а не лучше.
• Несколько плагинов оптимизации сразу — двойное сжатие, конфликты, сломанная вёрстка.
• Агрессивное объединение и отложенная загрузка всех скриптов — перестают работать формы, корзина, счётчики и цели.
• Кеш на корзине и личном кабинете — посетители видят чужие или устаревшие данные.
• Замер только главной на десктопе — основные проблемы обычно в карточках и на мобильных.
• Работы без резервной копии и без проверки после изменений.
• Ускорение без замера «до» — потом невозможно понять, что сработало.

Чек-лист: как ускорить сайт

• Сняты полевые данные: отчёт Core Web Vitals в Search Console и «Время загрузки страниц» в Метрике.
• Ключевые шаблоны проверены в PageSpeed Insights на мобильных и десктопе.
• Сделана резервная копия сайта.
• TTFB в норме; если нет — включён страничный кеш, обновлён PHP, проверен хостинг.
• Включено сжатие Brotli или gzip для текстовых файлов.
• Настроен браузерный кеш для статических файлов.
• Изображения в WebP или AVIF, нужного размера, со srcset и указанными размерами.
• Lazy loading включён для изображений ниже первого экрана и выключен для главной картинки.
• Удалены неиспользуемые счётчики, пиксели и виджеты.
• Скрипты подключены с defer или async, тяжёлые виджеты грузятся по действию.
• Шрифты в WOFF2, начертаний минимум, задан font-display.
• Отключены лишние плагины и функции темы.
• У изображений и баннеров заданы размеры, вёрстка не прыгает.
• Проверена работа форм, корзины, оплаты и целей Метрики после изменений.
• Повторный замер через месяц по полевым данным.

Частые вопросы

Коротко

• Измеряйте скорость по Core Web Vitals: LCP ≤ 2,5 с, INP ≤ 200 мс, CLS ≤ 0,1 — пороги из справки Google.
• Решения принимайте по полевым данным Search Console и Метрики, исправления проверяйте лабораторным тестом.
• Частые причины — тяжёлые изображения, лишние скрипты и виджеты, слабый хостинг, нет кеша и сжатия, шрифты.
• Ускоряйте по порядку: сервер и кеш, изображения, скрипты, шрифты, тема и плагины.
• Не включайте lazy loading для главной картинки и не ставьте несколько плагинов оптимизации сразу.
• Скорость помогает в поиске и конверсии, но не заменяет релевантный и полезный контент.