Как уменьшить вес мобильной страницы

Почему это влияет на заявки

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

Хотите понять, относится ли это к вашему сайту?Проверим сайт и вернёмся с коротким планом.

Получить аудит

Яндекс давно учитывает скорость загрузки мобильных страниц при ранжировании. Это не слух и не преувеличение. Если ваш конкурент находится в тех же условиях, но его сайт открывается за две секунды, а ваш — за семь, Яндекс отдаст предпочтение ему. Не потому что вы хуже, а потому что ваш сайт хуже работает для пользователя.

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

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

Практические особенности и варианты применения

Начинать всегда стоит с диагностики. Откройте свой сайт с телефона и посмотрите в меню браузера раздел «размер страницы» или используйте бесплатный инструмент PageSpeed Insights от Google. Он покажет общий вес и разбивку по категориям: сколько весят картинки, сколько скрипты, сколько шрифты. Обычно картина сразу становится понятной.

Картинки — главный источник лишнего веса

В девяти из десяти случаев основная проблема в изображениях. Фотографии товаров загружаются в разрешении 4000 на 3000 пикселей, хотя на экране телефона они отображаются в размере 300 на 200. Бесполезные мегабайты летят в трубу.

Что делать на практике. Выгрузите все картинки с сайта и прогоните через сервисы сжатия — TinyPNG, Squoosh или встроенные инструменты редактора. Для фотографий товаров достаточно ширины 800 пикселей, для иконок и превью — 300–400. Формат WebP даёт выигрыш в весе на 25–40% по сравнению с JPEG при том же визуальном качестве. Большинство современных сайтов его поддерживают.

Ленивая загрузка (lazy load) — ещё один рабочий приём. Суть проста: картинки, которые находятся ниже первого экрана, не загружаются сразу. Они начинают скачиваться только когда человек прокручивает страницу вниз. Это не уменьшает общий вес страницы, но радикально ускоряет первую загрузку — а именно её оценивает Яндекс.

Скрипты и стили

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

Проверьте, все ли виджеты реально нужны. Если чат на сайте стоит уже год, а через него пришло два сообщения — возможно, его стоит убрать или заменить на простую кнопку с ссылкой на мессенджер. Каждый удалённый скрипт — это минус 50–200 килобайт и плюс к скорости.

Продвижение по регионам

Проверим, в каких городах сайт может расти быстрее

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

Проверить регионы

Минификация — это удаление пробелов, переносов строк и комментариев из кода CSS и JavaScript. Для браузера ничего не меняется, а вес файлов уменьшается на 10–20%. На большинстве сайтов это включается одной галочкой в настройках плагина кэширования.

Шрифты

Красивые нестандартные шрифты могут весить 100–300 килобайт каждый. Если на сайте подключено три таких шрифта в нескольких начертаниях, это легко добавляет мегабайт к весу страницы.

Решение — использовать подмножества шрифтов (font subsets), которые содержат только нужные символы, например только кириллицу. Или ограничиться одним нестандартным шрифтом для заголовков, а для основного текста оставить системные шрифты, которые уже есть в телефоне и ничего не весят.

Сжатие на сервере

Даже если вы сжали все картинки и убрали лишние скрипты, сервер может отдавать данные в «распакованном» виде. Включение Gzip- или Brotli-сжатия на хостинге позволяет сжимать текстовые данные (HTML, CSS, JavaScript) перед отправкой браузеру. Телефон получает архив, быстро его распаковывает и показывает страницу. Это снижает передаваемый объём текстовых данных на 60–70%. Часто это включается в панели управления хостингом одной кнопкой.

Ошибки, ограничения и что учитывать на практике

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

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

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

Ограничения маленького бюджета. Хорошая новость в том, что базовое уменьшение веса можно сделать почти бесплатно. Сжать картинки — бесплатно. Включить Gzip на хостинге — бесплатно. Поставить плагин ленивой загрузки — бесплатно. Платить придётся только если нужно переписывать код, переносить сайт на другой шаблон или настраивать сложную оптимизацию, которая требует участия разработчика.

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

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

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