Оптимизация изображений на сайте: чтобы они продавали, а не весили
Оптимизация изображений на сайте – это четыре различных действия над одним файлом: формат, размер под реальный контейнер, момент загрузки и текстовое описание. Начинаем с подсчета, потому что до него никто не знает, есть ли что снимать. Часто пропускаемую деталь: отложенная загрузка на главной картинке первого экрана страницу не ускоряет, а тормозит. В измеренном нами магазине садового инструмента отложено грузятся 66 из 69 изображений, и его разметка на 252,6 КБ — самая легкая в партии.
количество изображений, форматы, вес, долю с отложенной загрузкой и заполненность описаний
Наш замер
31.07.2026
Разброс в собственном измерении
66 из 69 отложенных изображений (96%) и 154 из 190 (81%) - измерение 31.07.2026
Самая легкая разметка среди измеренных
252,6 КБ в магазине садового инструмента
Самая тяжелая в этой паре
502,3 КБ при 190 изображениях на одной странице
Показатели сняты нашим замером на живых сайтах соответствующего масштаба.
после бесплатного аудита
Стоимость
30
Гарантия
дней после подписания акта
количество изображений, форматы, вес, долю с отложенной загрузкой и заполненность описаний
Что считаем
66
Разброс в собственном измерении
из 69 отложенных изображений (96%) и 154 из 190 (81%) - измерение 31.07.2026
252,6 КБ
Самая легкая разметка среди измеренных
в магазине садового инструмента
502,3 КБ
Самая тяжелая в этой паре
при 190 изображениях на одной странице
5–15
Срок работ
рабочих дней, зависит от доли обрабатываемого пакетно.
бесплатный подсчет изображений и веса, 1–3 рабочих дня
Перед сметой
рост продаж: работа снимает байты и техническую потерю, спроса не создает
Чего не обещаем
Что входит
Полный перечень работ и того, что вы получаете на выходе
Инвентаризация изображений: сколько их, в каких форматах, сколько весят и на каких шаблонах выводятся — из этого списка считаются все остальные работы
Пакетная конвертация в WebP с откатом к привычному формату – файлы легчают, а старые браузеры получают то, что понимают, без отдельной версии сайта
Сжатие с проверкой глазами, а не только по цифрам: предел качества определяем на пробной партии, показываем вам и далее держим ее как правило
Набор размеров под разные экраны и отдача нужного через srcset – телефон перестает скачивать десктопный файл ради картинки на полэкрана
Отложенная загрузка на все ниже первого экрана и его снятие с главного изображения — чтобы прием не работал против самой страницы
Заданы габариты изображений: верстка не прыгает во время загрузки, и человек не промахивается мимо съехавшей вниз кнопку
Текстовые описания для изображений каталога по согласованному с вами шаблону – фото становятся видимыми для поиска изображений и для программ чтения экрана
Кэширование изображений на сервере и в Cloudflare — повторный визит не скачивает те же файлы второй раз
Замеры веса ключевых страниц до и после одним и тем же методом: иначе «стало легче» нечем подтвердить
Правило для вашей команды дальше: в каком формате и размере заливать новую графику, чтобы каталог не съехал обратно за полгода
Когда эта услуга не подходит
Что не входит в работу — чтобы не было сюрпризов на сдаче
Фотосъемка и обработка товаров
Ретушь и дизайн баннеров
Написание описаний товаров
Покупка изображений и оплата сервисов обработки
Кому подходит
Ситуации, в которых эта услуга даёт результат
Сценарий 1 из 4
Каталог собирался годами из разных источников
Часть фото пришла от поставщика, часть снята самими, часть перетащена из старого сайта. Форматы разные, весы разные, пропорции тоже. Такой каталог не лечится одним переключателем: сначала инвентаризация, затем правило обработки, и только то, что под правило не подпадает, приходится трогать руками. Мы отдельно называем какая часть пакетная, а какая ручная.
Разберём вашу ситуацию на бесплатном аудите
Сценарий 2 из 4
Основной трафик приходит с телефонов
На мобильном к задержке сервера добавляется задержка сети, а большинство байтов страницы – это само изображение. Честный предел: легкие картинки и мобильный viewport – необходимый минимум, а не доказательство удобства. Насколько просто пройти ждут большим пальцем, видно только на живых сессиях, и эта работа такой проверки не заменяет.
Сценарий 3 из 4
Фото на две тысячи пикселей показывается в блоке на триста
Браузер тянет полный файл, а на экран выводит уменьшенную копию – разница в байтах идет впустую, и так на каждом открытии страницы. Лечится это не в графическом редакторе, а в шаблоне: набор размеров под разные экраны и отдача требуемого. Настроили один раз — работает на весь каталог, включая фото, которых еще нет.
Сценарий 4 из 4
Фото на сайте есть, а для поиска их вроде нет
Изображение без текстового описания для поисковой системы пусто, и для программы чтения экрана тоже. В магазине садового инструмента мы нашли ровно это: названия перевозчиков представлены только картинками без описания. Человек видит логотипы, машина ничего. На соседнем сайте те же логотипы описания имеют, и вся разница в одном заполненном поле.
Бесплатный подсчет изображений и их вес
Изображение — самая частая причина тяжелой страницы и одновременно самая дешевая в лечении. Но сначала надо посчитать: сколько их, в каких форматах, сколько грузятся сразу. Это мы делаем сами бесплатно.
Что мы измеряем
Количество изображений на страницеОтдельно для главной, категории и карты товара. Измеренный контраст: 69 изображений на одной странице и 190 на другой.
Доля с отложенной загрузкойСколько из них не грузятся до того, как человек к ним достает. В паре измеренных магазинов это 96% и 81%.
ФорматыИспользуется WebP или AVIF. Мы встречали страницы, где в современном формате нет ни одного изображения.
Реальные размеры против показанныхКлассическая потеря: фотография на 2000 пикселей, показанная в блоке на 300. Разница в байтах идет впустую.
Текстовые описания изображенийЗаполнены ли они. Пустое описание – это фото, которого не видит ни поисковик, ни программа чтения экрана.
Изображение первого экранаНе стоит на главной картинке отложенная загрузка — ошибка, которая портит именно то, что должно ускорить.
Что вы получаете
Цифры: сколько изображений, сколько весят, сколько с загрузкой, сколько в современных форматах.
Оценка сколько байтов можно снять со страницы без видимой потери качества.
Список правок с разделением на пакетные и ручные.
Короткий разговор по находкам.
Срок: 1–3 рабочих дня
Почему это бесплатно
Ибо подсчет быстрый, а разговор после него становится предметным: вместо «картинки надо сжать» вы получаете конкретные числа и сами видите, сколько это стоит.
Что дальше
Далее – работы с оценкой. Часть из них пакетная и дешевая; то, что придется делать руками, называем отдельной строчкой, чтобы в счете не было сюрпризов.
Короткая форма: контакт и адрес сайта
Договор, акт и гарантия 30 дней
На каждый проект письменный договор: объём, сроки, сумма, порядок приёмки. После сдачи — акт и счёт, затем 30 календарных дней гарантии.
ФОП и безналичный расчёт
Исполнитель — зарегистрированный ФОП. Оплата на счёт с закрывающими документами.
Права и доступы — ваши
Код, дизайн и материалы переходят к вам после полной оплаты. Домен, хостинг, репозиторий оформляем на вас.
Портал клиента вместо переписки
Во время работы вы получаете доступ к порталу: договоры, счета, акты и статус проекта в одном месте.
Заказчики из Европы
Среди работ — проекты для Норвегии, Болгарии, Молдовы и Испании.
Цифры, которые можно проверить
Каждый кейс в портфолио — со ссылкой на живой сайт и техническим замером.
Сначала аудит, потом сумма
Прайса на сайте нет намеренно: объём одной и той же работы у двух клиентов отличается кратно.
Говорим «нет», когда не уверены
Если задача не наша или срок нереальный — скажем сразу.
Что влияет на стоимость
Почему две одинаковые на вид задачи считаются по-разному
Сколько изображений и сколько источниковКаталог, где фотографии лежат в одном формате и одном размере, обрабатывается пакетно по правилу. Каталог, собранный из десяти источников за десять лет, сначала приходится разложить на группы — и именно это, а не количество файлов, съедает дни.
Есть ли оригиналыИз оригинала мы сделаем и WebP, и три размера под экраны. Из сжатой копии только одну сжатую копию. Если оригиналов нет, часть каталога остается как есть и мы говорим это до счета, а не после.
Где физически лежат файлыДоступ к хранилищу означает пакетную обработку одной командой. Если картинки разбросаны по записям в базе, вставлены прямо в описания товаров или отдаются чужим сервисом, прилагается отдельная работа по их сбору.
Состояние шаблонаШаблон, уже умеющий отдавать несколько размеров, приходится лишь донастроить. Шаблон, выводящий одну картинку на все экраны, нужно править – это верстка, и считается она отдельно от обработки файлов.
Описание изображенийЗаполнить описания по шаблону из данных карты – работа на несколько часов для всего каталога. Писать описания вручную под каждое фото – другая задача и другие деньги, и мы не смешиваем эти две строчки в одну.
Кейсы
Задачи и результат в цифрах — все показатели сняты нашим замером
интернет-магазин садового инструмента для частных покупателей
Задача
Проверьте, насколько изображения каталога готовы к мобильному трафику.
Решение
Подсчет тегов изображений с разбивкой по отложенной загрузке, проверка текстовых описаний, измерение веса разметки и времени ответа сервера.
Результат
66 из 69 изображений (96%) грузятся отложено, разметка весит 252,6 КБ – самый легкий документ среди магазинов партии; первый ответ 547,2 мс, полная загрузка 676,7 мс. Дефект нашелся именно в изображениях: названия перевозчиков представлены только картинками без текстового описания, поэтому ни поисковик, ни программа чтения экрана их не видят — на соседнем магазине у тех же логотипов описания. Измерение 31.07.2026.
специализированный интернет-магазин средств самообороны
Задача
Оценить, сколько веса страницы дают изображение.
Решение
Подсчет изображений и частицы с отложенной загрузкой, замер веса разметки и времени ответа, сверка с объемом каталога по карте сайта.
Результат
190 изображений на одной странице, из них 154 с отложенной загрузкой (81%). Разметка 502,3 КБ, первый ответ 494,7 мс, полная загрузка 567,5 мс. Каталог при этом небольшой – 48 товаров и 18 категорий, 68 адресов в карте сайта. То есть отложенная загрузка настроена, а документ вдвое тяжелее магазина из предыдущего кейса: запас здесь не в количестве изображений, а в их форматах и размерах. Измерение 31.07.2026.
Не нашли свой случай?
Опишите, как это устроено у вас, — ответим, подходит ли «Оптимизация изображений» и что это значит в вашей ситуации. Без брифа и без звонка: один вопрос, один ответ.
Этапы работы
Прозрачные этапы с согласованием на каждом шагу
Общий срок:5–15 дней
1
Подсчет и инвентаризация
1–3 рабочих дня
Считаем изображение на главной, в категории и в карточке, снимаем форматы, весы и частицу с отложенной загрузкой. На выходе таблица, из которой видно, где сидят байты.
2
Правило обработки и пробная партия
1–2 рабочих дня
Берем два-три десятка типичных фото, прогоняем в нескольких уровнях сжатия и смотрим глазами, где начинает сыпаться качество. Согласованный предел фиксируем как правило для всего каталога.
3
Пакетная конвертация и размеры
1–4 рабочих дня
Прогоняем каталог по правилу: WebP с откатом к обычному формату, набор размеров под экраны. Оригиналы оставляем нетронутыми — откат должен быть возможен в любой момент.
4
Шаблон и кэш
1–3 рабочих дня
Правим отдачу размеров, расставляем отложенную загрузку ниже первого экрана и снимаем его с главного изображения, задаем габариты, настраиваем кэш статики.
5
Описание, повторный замер, передача
1–3 рабочих дня
Заполняем описания по согласованному шаблону, повторяем замеры тем же методом и отдаем сравнение «до и после» вместе с правилом для новой графики.
AVIF — легче WebP, но кодируется заметно дольше, поэтому ставим выборочно, а не на весь каталог
picture с откатом к JPEG и PNG – старый браузер получает привычный файл без отдельной версии сайта
loading="lazy" - все ниже первого экрана; на главное изображение не ставим никогда
srcset и sizes – браузер сам берет размер под свой экран, но работает это только там, где шаблон их отдает
пакетная обработка через sharp или ImageMagick – тысячи файлов по правилу, не руками
Lighthouse и Chrome DevTools – замеры до и после; это лаборатория, а не поведение реальных посетителей
кэширование статики на nginx и в Cloudflare — повторный визит не скачивает те же файлы второй раз
Интеграции
Google Search Console
GA4
Cloudflare
Google Merchant Center
Обработка по правилу против плагина-оптимизатора
Чем этот вариант отличается от альтернативы
Плагин-оптимизатор в CMSНаш подход
Предел сжатияпресет автора плагина; где именно сыпется качество, вы видите уже на живом каталогеопределяем на пробной партии, показываем вам и фиксируем как правило
Размеры под экранчасть плагинов это умеет, часть только сжимает исходный файл – проверять приходится рукаминабор размеров и отдача нужного прописываются в шаблоне
Главное изображение первого экранамассовая настройка обычно накрывает все изображения одинаковосознательно выводим из-под отложенной загрузки
Что с оригиналамичасть плагинов перезаписывает файл на месте - откатывать нечемработаем с копиями, оригиналы остаются нетронутыми
Расходы в дальнейшемподписка или платная версия, а при изменении темы настройки переезжают не всегдаразовая работа плюс правило для новой графики
Что нужно от вас
Без этого не начнём — лучше подготовить заранее
1Доступ к файлам сайта или хранилищу, где лежат изображения.
2Доступ к шаблонам – без правок у них размеры под экран и отложенную загрузку не поставить.
3Оригиналы в приемлемом качестве: из сжатой копии лучшего не сделаешь, и это не вопрос инструмента.
4Правило для описания: что именно должно быть в описании фото товара — название, бренд, артикул или их сочетание.
5Одного человека с вашей стороны, который посмотрит пробную партию и скажет, приемлем ли предел сжатия.
Если чего-то из этого нет — скажите, подскажем, как собрать или сделаем сами отдельной задачей.
Частые вопросы
Что спрашивают чаще всего — с конкретными ответами
Насколько вообще можно снизить вес?
Честный ответ нужно мерить, потому что стартовые состояния отличаются в разы. Два магазина по нашему измерению: в одном разметка 252,6 КБ, во втором 502,3 КБ, причем второй имеет каталог всего на 68 адресов. Запас — это разница между тем, что у вас сейчас, и тем, что дает такой же вид в современном формате и нужном размере. После подсчета мы называем эту разницу в б, а не в процентах с потолка.
Отложенную загрузку нужно ставить на все изображения?
Нет, и это самое распространенное заблуждение в этой теме. Главное изображение первого экрана нужно сразу, а отложение добавляет ему задержки именно там, где он самый заметный. Правило простое: все ниже первого экрана отложено, первый экран нет. Проверять приходится по шаблонам: массовые настройки обычно накрывают все картинки без разбора.
WebP безопасен для старых браузеров?
Так, если отдавать его с откатом: браузер, понимающий формат, получает WebP, остальные привычны JPEG или PNG. Это стандартная конструкция разметки, отдельная версия сайта для этого не требуется. С AVIF другая история: он легче, но кодировка заметно медленнее, поэтому мы ставим его выборочно – на баннеры и тяжелые фото, а не на весь каталог.
Нужны ли описания фото товаров?
Нужны, и не только для поиска изображений. В магазине садового инструмента мы нашли страницу доставки, где названия перевозчиков представлены картинками без описания: человек видит логотипы, а поисковик и программа чтения экрана — пустоту. На соседнем магазине те же логотипы описания имеют. Для каталога описания заполняются по шаблону с полей карты, это несколько часов на весь каталог, а не ручная работа.
Сколько изображений нормально иметь на странице?
Вопрос не в количестве, а в том, сколько из них браузер тянет сразу. В нашем измерении есть страница со 190 изображениями, где 154 отложены, и страница из 69, где отложены 66. Обе ведут себя приемлемо. Проблема начинается там, где отложения вообще нет: тогда даже сотня легких картинок грузится до того, как человек увидел первый экран.
Что делать с каталогом на десятки тысяч фотографий?
Возделывать пакетно, по правилу, а не руками. Конвертация, сжатие и нарезка размеров автоматизируются; руками остается то, что под правило не подпадает, обычно баннеры, коллажи и нестандартные макеты. Мы отдельно называем, какая часть работы пакетная, а какая ручная, чтобы оценка не была одной большой цифрой без объяснения.
А качество не испортится?
Именно поэтому в работе есть этап пробной партии. Берем два-три десятка типичных фото, прогоняем в нескольких уровнях сжатия и смотрим глазами, где начинает сыпаться фактура — на ткани, металле и мелком тексте это видно первым. Согласованный предел фиксируем как правило. Оригиналы остаются нетронутыми, поэтому можно откатиться в любой момент.
После этой работы будет больше заказов?
Не обещаем и не считаем так. Более легкие изображения убирают техническую потерю — долю ушедших людей, не дождавшись картинки товара, — но спроса не создают. Если цена выше рынка или товара нет в наличии, скорая страница просто быстрее покажет причину уйти. Мы меряем вес, форматы и описания; продажи меряются в вашей аналитике, и сводить друг с другом нужно сознательно.
Отправьте адрес сайта и доступ к файлам или хранилищу изображений.
В ответ сколько у вас изображений, сколько они весят, сколько из них в современных форматах и сколько байтов можно снять без видимой потери качества. Если снимать нечего, скажем это первым же письмом и назовем, где вес сидит на самом деле.
Из измеренных кейсов66 из 69 изображений (96%) грузятся отложено, разметка весит 252,6 КБ
Прайса на сайте нет намеренно: объём той же работы у двух клиентов отличается в разы, и цифра «от» в этом случае ничего не объясняет. Сначала бесплатный аудит — считаем ваши страницы, дубли и скорость, — потом называем сумму и срок и фиксируем их в договоре.