Фотографии на сайте низкого качества

Критичность проблемы: Низкая | Сложность внедрения: Средняя | Встречаемость: Высокая

На сайте фотографии мыльные. Лица расплываются, текст на упаковке не читается. Свет провален в тени, белое горит.

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

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

Фактура теряется. Дерево кажется пластиком, металл — серой массой. На блестящих поверхностях засветы, на матовых шум.

Кадры снимают в разном стиле. Где-то предмет на белом, где-то на ковре, где-то в темноте. Лента выглядит лоскутно. Ассортимент кажется случайным и усталым.

Компрессия убивает детали. На логотипах появляются ступеньки. Вокруг контуров — рваные ореолы. Это видно даже в мобайле.

Размер файла маленький, но сам блок большой. Браузер растягивает, резкость пропадает. Пользователь щёлкает на увеличение, а там всё то же: нет деталей, нет уверенности.

В галерее не хватает ракурсов. Один общий план и всё. Непонятно, как устроена спинка стула, какой у кабеля разъём, как выглядит шов. Люди не могут соотнести вещь с реальностью.

Иногда фото темнее страницы. На сером фоне предмет уходит в фон, исчезает контраст. Кнопки и тексты заметнее, чем сам товар. Внимание утекает.

Разные источники снимков смешаны. Производитель шлёт одно, маркетолог добавляет другое, пользователь — третье. В итоге нет единого стандарта. Бренд выглядит неряшливо.

Когда проблема критична и когда нет

Критично:

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

Не критично:

• Типовые услуги и B2B, где решение принимают по описанию, кейсам и бренду.
• Услуги с нематериальным результатом (аудит, консалтинг), где фото — второстепенно.
• Товары с низким чеком и импульсной покупкой, когда важнее цена и наличие.
• Каталоги, где фото — декоративный элемент и не влияет на понимание продукта.
• Ситуации, когда у вас есть подробное видео/3D и фото — лишь дополнение.

Что об этом говорят пользователи

В каких моментах на сайте вам не хватает качества фото, чтобы принять решение о покупке, и что вы делаете дальше в этот момент?

Бесполезные ответы

• Я не разбираюсь, мне всё равно.
• Ну бывает мыло, но я привык.
• Если надо, разберусь, я и так куплю.

Полезные ответы

• Смотрю карточку на iPhone 13: при зуме 2× логотип на кроссовках распадается, не понимаю фактуру. Возвращаюсь в Google, ищу другой магазин.
• На ноутбуке 15″ фото дивана темноватые, швы не видно. Нужен крупный план тканого узора и цвет при дневном свете. Без этого добавляю в избранное и не покупаю.
• В каталоге миниатюры растянуты, видно пиксели. Думаю, что товар б/у или подделка. Закрываю страницу.
• В наборе инструментов нет фото задней стороны упаковки. Не вижу спецификацию бит, боюсь ошибки. Пишу в чат, жду ответ и ухожу.
• В косметике оттенок на фото уходит в серый, на руке — другой. Не верю цвету, ищу свотчи на YouTube.

Решение проблемы

• Проведите инвентаризацию изображений. Составьте список всех мест, где есть фото: баннеры, категории, карточки, модалки, блог, поиск.
• Введите стандарты. Для каждого блока задайте минимальные размеры и ориентацию. Пример: баннер — 2560×1440, карточка товара — длинная сторона 1600–2000 px, превью — 400–600 px, иконки — SVG.
• Настройте цвета. Рабочий профиль и экспорт — sRGB. Запретите загрузку изображений с неизвестными профилями.
• Источник. Берите оригиналы от производителя или снимайте заново. Минимум шум, ровный свет, нейтральный фон. Единый ракурс для серии.
• Постобработка. Коррекция экспозиции и баланса белого, мягкая резкость после изменения размера, без агрессивной компрессии. Уберите паразитные ореолы и шум.
• Экспорт и форматы. Фото — WebP/AVIF с запасом качества, JPEG как fallback. Для JPEG качество 75–85, для WebP — 70–80. Уберите метаданные, кроме профиля.
• Адаптивная графика. Для каждого изображения сделайте srcset и sizes: одно для мобайла, другое для планшета, третье для десктопа и ретины. Не растягивайте маленькое фото в большой блок.
• Производительность. Для видимой зоны — приоритетная загрузка; ниже — lazy-loading. CDN с автоматическим ресайзом и компрессией по User-Agent.
• Контент в карточке. Дайте серию ракурсов: общий вид, крупные планы, фактура, детали, масштабы, обратная сторона, комплектация, размер рядом с рукой/предметом.
• Единый стиль. Свет, фон, отступы, тени — одинаковые для всего каталога. Это повышает доверие и облегчает сравнение.
• Контроль качества. Чек-лист перед публикацией: размер соответствует блоку, резкость достаточная, текст читаем, цвет не уводит, файл лёгкий, на ретине выглядит чётко.
• Процесс. Запретите загрузку фото ниже стандарта на уровне CMS. Любое новое изображение проходит автоматический ресайз, конверсию, оптимизацию и визуальную проверку.
• Обновление старого. Идите от самых посещаемых страниц. Заменяйте по приоритету: хедеры, карточки хитов, категории, далее хвост.

Гипотезы для роста конверсии

• Если заменить превью в каталоге на адаптивные версии с чёткой фактурой, то конверсия в переход в карточку может увеличиться за счёт того, что пользователь увидит детали прямо в списке.
• Если добавить в карточку товара крупные планы ключевых элементов (швы, разъёмы, текст на упаковке), то конверсия в добавление в корзину может увеличиться за счёт того, что снижается неопределённость.
• Если переснять главный кадр с ровным дневным светом и нейтральным фоном, то конверсия в просмотр галереи может увеличиться за счёт того, что первый кадр становится «якорем доверия».
• Если настроить srcset и не растягивать миниатюры, то конверсия в просмотр карточек с мобильных может увеличиться за счёт того, что изображения станут резкими на ретина-экранах.
• Если привести все фото в единый стиль по свету и ракурсу, то конверсия в покупку может увеличиться за счёт того, что каталог выглядит цельно и профессионально.

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