Посетитель, который пришёл на сайт из поиска или рекламы, готов ждать загрузки считанные секунды. Если за это время на экране всё ещё белый фон или прыгающие блоки, он нажимает «назад» и открывает следующий результат. Владелец сайта этого не видит: у него страница давно в кеше браузера и открывается мгновенно. Поэтому о проблеме часто узнают только по косвенным признакам — падению заявок или позиций. Расскажем, как измерить скорость объективно и что делать, чтобы сайт летал.
Почему скорость так важна
- Конверсия. Чем дольше грузится страница, тем больше людей уходит, не дождавшись. Особенно чувствительны мобильные пользователи с нестабильным интернетом.
- Поисковое ранжирование. Поисковые системы учитывают скорость и удобство загрузки как один из факторов. При прочих равных быстрый сайт окажется выше.
- Стоимость рекламы. Вы платите за клик, а человек уходит до загрузки. Медленный сайт увеличивает стоимость каждой заявки.
- Нагрузка на сервер. Неоптимизированный сайт требует больше ресурсов, и при наплыве посетителей хостинг может просто не выдержать.
Как измерить скорость загрузки
Ощущения «вроде быстро» недостаточно. Используйте инструменты:
- онлайн-сервисы анализа скорости страниц от поисковых систем — они показывают оценку и конкретные рекомендации отдельно для мобильных и компьютеров;
- вкладку Network и Lighthouse в инструментах разработчика браузера (F12): видно, какие файлы загружаются, сколько весят и сколько времени занимают;
- отчёты о скорости в панелях вебмастеров, основанные на данных реальных пользователей;
- мониторинг доступности, который регулярно проверяет время ответа сервера.
Проверяйте не только главную, но и типовые внутренние страницы: карточку товара, страницу услуги, статью блога. Часто главная оптимизирована, а каталог грузится вдвое дольше.
Ключевые метрики
| Метрика | Что показывает | Ориентир хорошего значения |
|---|---|---|
| TTFB | время до первого байта ответа сервера | до 0,6–0,8 секунды |
| LCP | когда отрисован самый крупный элемент первого экрана | до 2,5 секунды |
| INP | насколько быстро страница реагирует на действия | до 200 миллисекунд |
| CLS | насколько «прыгает» вёрстка при загрузке | до 0,1 |
Если TTFB большой, проблема на стороне сервера или движка. Если сервер отвечает быстро, а LCP плохой — виноваты тяжёлые изображения, шрифты и скрипты.
Изображения: главный источник лишнего веса
В нашей практике тяжёлые картинки — причина медленной загрузки примерно в половине случаев. Фотограф прислал снимки по 8 мегабайт, менеджер загрузил их на сайт как есть, и главная страница весит 40 мегабайт. Что делать:
- Уменьшайте размер до реально нужного. Если изображение показывается шириной 800 пикселей, не нужно загружать файл шириной 4000.
- Используйте современные форматы WebP или AVIF: при том же качестве они весят на 25–50% меньше JPEG.
- Сжимайте. Качество 75–85% визуально неотличимо от исходника, а вес падает в разы.
- Включите отложенную загрузку (lazy loading) для картинок ниже первого экрана — они подгружаются, только когда пользователь до них прокручивает.
- Указывайте размеры изображений в вёрстке, чтобы браузер заранее резервировал место и страница не прыгала.
- Отдавайте разные размеры разным экранам — телефону не нужна картинка для широкого монитора.
Большинство CMS умеют делать это автоматически с помощью модуля оптимизации, достаточно правильно его настроить.
Серверная часть и хостинг
Если сервер долго думает перед тем, как отдать страницу, никакая оптимизация картинок не поможет. На что обратить внимание:
- Кеширование страниц. Вместо того чтобы при каждом запросе собирать страницу из базы данных, сервер отдаёт готовую копию. Время ответа сокращается в разы.
- Кеширование объектов. Хранение результатов частых запросов к базе в оперативной памяти.
- Актуальная версия PHP или другого языка. Переход со старой версии на современную часто даёт прирост производительности без единой строки нового кода.
- Сжатие ответа gzip или Brotli: текстовые файлы передаются в сжатом виде.
- HTTP/2 или HTTP/3 — позволяют параллельно загружать множество файлов по одному соединению.
- Адекватный тариф. Если сайт упирается в лимиты процессора, самая дешёвая оптимизация — перейти на тариф повыше или на VPS.
- Расположение сервера близко к аудитории. Для крупных проектов — CDN, раздающая статические файлы с ближайшего к пользователю узла.
Скрипты, стили и шрифты
Современный сайт обрастает сторонним кодом: счётчики аналитики, онлайн-чаты, виджеты обратного звонка, пиксели рекламных систем, карты, видео. Каждый такой скрипт — это дополнительные запросы и время на выполнение. Рекомендации:
- проведите ревизию и удалите виджеты, которыми никто не пользуется;
- подключайте некритичные скрипты с атрибутами defer или async, чтобы они не блокировали отрисовку;
- загружайте тяжёлые элементы вроде карт и видео по клику, показывая вместо них статичную превью-картинку;
- объединяйте и минифицируйте CSS и JavaScript, убирайте неиспользуемые стили;
- ограничьте число шрифтов и их начертаний, используйте формат WOFF2 и параметр font-display: swap, чтобы текст появлялся сразу.
Из практики: на сайте салона красоты время загрузки мобильной версии достигало девяти секунд. Разбор показал, что грузились три разных онлайн-чата (два остались от прошлых подрядчиков), видео-фон на весь первый экран и шесть вариантов шрифта. После удаления лишнего и замены видео на картинку страница стала загружаться менее чем за две секунды.
Плагины и движок
На популярных CMS скорость часто убивает избыток модулей. Каждый плагин добавляет свои запросы к базе, стили и скрипты — иногда на всех страницах, даже там, где он не используется. Что делать:
- Составьте список всех плагинов и отметьте, какие действительно нужны.
- Удалите неиспользуемые, а не просто деактивируйте.
- Замените несколько мелких плагинов одним комплексным или небольшой доработкой кода.
- Проверьте, нет ли в базе данных мусора: тысяч ревизий записей, устаревших временных данных, логов.
- Выберите лёгкую тему оформления вместо «универсального» шаблона с сотней встроенных функций.
Как сохранить скорость после оптимизации
Ускорить сайт — половина задачи. Через полгода он снова может стать медленным: менеджеры загружают новые фотографии без сжатия, маркетологи добавляют очередной виджет, плагины обновляются и тянут за собой новые скрипты. Чтобы этого не происходило:
- настройте автоматическое сжатие и конвертацию изображений при загрузке в админку;
- договоритесь, что любой новый сторонний скрипт добавляется только после согласования с тем, кто отвечает за сайт;
- раз в месяц повторяйте замер ключевых страниц и сравнивайте с эталонными значениями;
- подключите мониторинг времени ответа сервера с уведомлением при резком росте;
- после крупных обновлений движка и плагинов проверяйте скорость на тестовой копии.
С чего начать: порядок действий
Если времени мало, двигайтесь по списку — от самого эффективного к менее заметному:
- Замерить скорость ключевых страниц и сохранить результаты для сравнения.
- Оптимизировать изображения.
- Включить кеширование и сжатие на сервере.
- Убрать лишние скрипты и виджеты.
- Обновить версию PHP и почистить плагины.
- Повторно замерить и сравнить с исходными данными.
Не забывайте делать резервную копию перед изменениями: агрессивная оптимизация скриптов иногда ломает формы или слайдеры, и важно быстро вернуться назад.
Итог
Скорость загрузки напрямую влияет на деньги: на конверсию, стоимость рекламы и позиции в поиске. Самые большие резервы обычно лежат на поверхности — тяжёлые картинки, отсутствие кеширования, лишние виджеты и плагины. Измеряйте, исправляйте по порядку и повторяйте проверку после каждого крупного обновления сайта.
Специалисты «Гизмы» в Новосибирске проведут аудит скорости, найдут узкие места и ускорят ваш сайт — от оптимизации изображений до настройки сервера. Эти работы можно заказать разово или в составе поддержки сайтов, чтобы скорость не проседала после каждого обновления.
Комментарии
Комментариев пока нет. Будьте первым — задайте вопрос мастеру или поделитесь опытом.