Как ускорить сайт: 12 шагов от хостинга до картинок

Сайт, который открывается дольше трёх секунд на телефоне, теряет часть посетителей до того, как они увидели первый экран. Яндекс это видит по поведению и опускает страницу ниже, а вы видите в Метрике «отказы» и не понимаете почему. Хорошая новость: в большинстве случаев сайт медленный по трём-четырём типовым причинам, и они чинятся за один рабочий день. Ниже — как измерить, что именно тормозит, и 12 шагов по порядку от самых результативных.

Как измерить скорость и какие цифры нормальные

• PageSpeed Insights от Google — оценка от 0 до 100 для телефона и компьютера и список конкретных проблем. Смотрите мобильную оценку: она всегда ниже и она важнее.
• Яндекс Вебмастер — раздел про скорость сайта показывает, как его видят пользователи Яндекса, и предупреждает о медленных страницах.
• Метрика — отчёт «Время загрузки страниц»: реальные цифры у реальных посетителей, по страницам и устройствам.

Три метрики, на которые смотрят поисковики: LCP — за сколько появляется самый большой элемент первого экрана (норма до 2,5 секунды); INP — как быстро сайт реагирует на клик (до 200 миллисекунд); CLS — прыгает ли вёрстка при загрузке (до 0,1). Если LCP на телефоне больше четырёх секунд — начинать надо сегодня.

Почему сайт медленный: 5 причин, которые встречаются чаще всего

1. Слабый хостинг или старый PHP. Сервер отвечает секунду до того, как начал отдавать страницу. Переход с PHP 7 на 8 сам по себе ускоряет WordPress заметно.
2. Картинки. Фото с телефона на 5 мегабайт в блоке 300 пикселей. Самая частая и самая простая причина.
3. Скрипты и виджеты. Чат, карта, видео, ретаргетинг, три счётчика, шрифты с трёх CDN — каждый добавляет секунды.
4. Нет кэширования. Каждый визит сайт собирает страницу заново из базы данных, хотя она не менялась неделю.
5. Тяжёлая тема и плагины. Шаблон «всё в одном» грузит библиотеки для слайдеров, которых на странице нет.

12 шагов по порядку

Первые четыре шага дают обычно больше половины всего ускорения. Если делать только их — уже будет заметно.

Картинки: самый быстрый выигрыш, пошагово

1. Размер под место. Картинка в блоке 600 пикселей не должна быть 4 000 пикселей шириной. Правило: ширина в два раза больше блока — для экранов с высокой плотностью, не больше.
2. Формат. WebP вместо JPEG и PNG — в полтора-три раза легче при том же виде. Для логотипов и иконок — SVG.
3. Сжатие. Качество 75–82% для фото не отличить глазом, а вес падает вдвое. Инструменты: Squoosh, TinyPNG, плагины сжатия в CMS.
4. Ленивая загрузка. Всё ниже первого экрана грузится по мере прокрутки — атрибут loading=»lazy». Картинку первого экрана, наоборот, грузить сразу и первой.
5. Размеры в коде. Указанные ширина и высота не дают вёрстке прыгать при загрузке — это метрика CLS.

Скрипты: что можно отложить, а что убрать

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

Отложить: чат — грузить через несколько секунд после страницы или по прокрутке; карту — по клику на превью; видео — по клику на обложку; шрифты иконок — заменить на SVG.

Оставить и ускорить: Метрика — с параметром отложенной загрузки; основные скрипты темы — в конец страницы с defer.

Проверка простая: откройте вкладку «Сеть» в браузере и отсортируйте по размеру. Первые пять строк обычно и есть проблема.

Проверка после: что должно измениться

• Мобильная оценка PageSpeed выросла заметно; LCP на телефоне — до 2,5 секунды.
• Время ответа сервера в отчёте — меньше 0,5 секунды.
• Вес страницы — меньше 2 МБ для обычной страницы услуг; количество запросов — меньше 60.
• В Метрике через две недели — время загрузки упало, отказы на мобильных снизились.
• Формы, оплата, обмен — работают: ускорение нельзя считать сделанным, пока не проверен функционал.

Чего делать не надо

• Ставить три плагина оптимизации разом. Они конфликтуют: кэш кэширует кэш, минификация ломает скрипты. Один плагин, настроенный руками.
• Минифицировать и объединять без резервной копии. Сломанный скрипт формы обнаруживается через неделю по отсутствию заявок.
• CDN «потому что модно». Для локального бизнеса с сервером в России CDN может замедлить, а не ускорить.
• Гнаться за 100 баллами. Разница между 85 и 100 в PageSpeed не видна людям и не влияет на позиции; разница между 30 и 70 — видна и влияет.

Особенности платформ

WordPress

Три самых частых проблемы: старый PHP, двадцать плагинов, из которых половина не нужна, и картинки без сжатия. Порядок действий: обновить PHP и ядро с резервной копией, поставить плагин кэша, включить WebP и ленивую загрузку, пройтись по плагинам и удалить лишние. Как безопасно обновить PHP и WordPress — в отдельной инструкции. Если хостинг слабый — сначала выбрать хостинг, потом остальное.

1С-Битрикс

Есть встроенные инструменты: композитный режим, автокэширование, «Монитор производительности», который сам показывает узкие места. Чаще всего тормозят каталог с тысячами товаров без кэша и обмен с 1С в рабочее время. Композит и перенос обмена на ночь решают большую часть.

Тильда и конструкторы

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

Что даёт ускорение

Меньше отказов на входе, больше просмотренных страниц, выше конверсия форм — особенно на телефонах, где терпение короче. Для поиска — прямой сигнал: Яндекс учитывает поведение, а медленные страницы теряют пользователей до того, как те что-то сделали. Отдельная выгода — реклама: Директ приводит людей на страницу, и если она открывается пять секунд, вы платите за клики, которые не дошли до контента.

Сколько это стоит и что делать, если некогда

Типовое ускорение сайта на WordPress — кэш, картинки, лишние скрипты, шрифты — занимает 3–8 часов работы. Мы делаем это как разовую задачу по 2 500 ₽ за час с резервной копией до начала: мелкие работы по сайту. Если проблема в хостинге — перенос на другой занимает 2–4 часа и делается там же. Полную картину — скорость, техника, структура, конверсия — показывает аудит сайта, а чтобы сайт не замедлился снова через полгода, есть поддержка с регулярными обновлениями.

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

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

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

Первый экран на телефоне — до 2,5 секунды по метрике LCP, реакция на клик — до 200 миллисекунд, вёрстка не прыгает. В PageSpeed Insights это зелёная зона; оценка выше 70 для мобильной версии — хороший результат для сайта бизнеса.

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

PageSpeed Insights покажет список проблем по приоритету: картинки, скрипты, время ответа сервера. Если время ответа сервера больше 0,5–1 секунды — дело в хостинге или отсутствии кэша. Если сервер быстрый, а страница медленная — картинки и скрипты.

Влияет ли скорость сайта на позиции в Яндексе?

Да, через поведение: медленные страницы теряют посетителей, Яндекс видит возвраты в выдачу и понижает. Прямой «фактор скорости» невелик, но косвенный эффект на конкурентных запросах заметен.

Можно ли ускорить сайт на Тильде?

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

Сколько стоит ускорить сайт?

Типовая работа на WordPress занимает 3–8 часов; у нас это разовая задача по 2 500 ₽ за час с резервной копией. Если нужно менять хостинг — плюс 2–4 часа на перенос.

Остался вопрос по вашей ситуации? Задайте его в комментариях — отвечаю лично, обычно в течение рабочего дня. — Дмитрий Гугуян, Rekkom