Карточка товара — это место, где посетитель принимает решение. Он уже нашёл нужную категорию, выбрал позицию из списка и теперь решает: оставить заявку, добавить в корзину или вернуться назад. На этой странице дизайн работает буквально на деньги. Разберём, из чего состоит эффективная карточка товара и какие ошибки встречаются чаще всего.
Первые пять секунд
Когда посетитель открывает карточку, он за несколько секунд сканирует страницу и ищет ответы на три вопроса: это то, что мне нужно? Сколько это стоит? Как это получить? Если ответы не находятся сразу, внимание рассеивается, и вероятность ухода растёт.
Поэтому первый экран карточки должен содержать всё самое важное:
- Чёткое название товара
- Главное изображение достаточного размера
- Цену или указание, как её узнать
- Наличие или срок поставки
- Основную кнопку действия
- Три-пять ключевых характеристик
Всё остальное — полное описание, таблица характеристик, документы, отзывы — можно разместить ниже. Тот, кому это нужно, прокрутит страницу.
Изображения
Фотографии — первое, на что смотрит покупатель. Плохие фотографии убивают продажи даже отличного товара. Требования к изображениям в карточке:
Качество и единообразие
Все товары в каталоге должны быть сфотографированы в едином стиле: одинаковый фон, освещение, ракурс. Это создаёт ощущение порядка и профессионализма. Пёстрый каталог, где одни товары сняты на белом фоне, другие — на складе, а третьи взяты с сайта производителя, вызывает недоверие.
Количество ракурсов
Одной фотографии почти всегда недостаточно. Покажите товар с разных сторон, крупно — важные детали, в интерьере или в процессе использования. Для технических изделий полезны фотографии маркировки и комплектации.
Масштаб
Покупателю сложно понять размер товара по фотографии на белом фоне. Помогают фото в руке, рядом с привычными предметами или в реальной обстановке. Для крупных изделий — схема с габаритами.
В наших проектах переход от разнородных фотографий к единой предметной съёмке регулярно даёт заметный рост числа заявок с карточек — без каких-либо других изменений.
Характеристики
Таблица характеристик — сердце карточки для технических и B2B-товаров. Здесь важно не только содержание, но и подача.
Ключевые характеристики стоит вынести наверх, рядом с изображением и ценой. Полную таблицу — ниже, сгруппировав параметры по смыслу: размеры, материалы, технические параметры, комплектация. Длинная таблица из пятидесяти строк без группировки читается тяжело.
Важно, чтобы характеристики были в текстовом виде, а не картинкой: их должны видеть поисковики, а покупатели — иметь возможность скопировать. Единицы измерения должны быть единообразны во всём каталоге.
Цена и кнопка действия
Если цена есть, она должна быть заметна. Если цена зависит от объёма или конфигурации, напишите об этом прямо: «цена от», «зависит от партии», «рассчитаем под ваш объём». Отсутствие любой информации о цене — одна из главных причин ухода посетителей.
Основная кнопка должна быть одна и выделяться визуально. Если на странице три кнопки одинакового размера и цвета — «Купить», «В избранное» и «Сравнить», — покупатель тратит время на выбор. Главное действие делаем акцентным, второстепенные — менее заметными.
Текст на кнопке должен описывать, что произойдёт. «Добавить в запрос», «Узнать цену», «Получить расчёт» — лучше, чем абстрактное «Отправить».
Описание
Описание товара отвечает на вопросы, которые не закрыли фото и характеристики: для чего этот товар, чем он лучше альтернатив, кому подходит, как им пользоваться. Хорошее описание пишется для покупателя, а не для поисковика.
Разбивайте описание на короткие абзацы с подзаголовками. Используйте списки для перечисления преимуществ и областей применения. Не повторяйте то, что уже есть в таблице характеристик.
Доверие
Особенно в B2B важны элементы, которые снимают сомнения:
- Сертификаты и документация для скачивания
- Информация о гарантии
- Условия доставки и оплаты
- Отзывы покупателей, если они есть
- Фото продукции на реальных объектах
Мобильная версия
На смартфоне карточка выглядит совсем иначе, и подходить к ней нужно отдельно. Галерея изображений должна листаться свайпом. Название, цена и кнопка — помещаться на первый экран. Основную кнопку полезно закрепить внизу экрана, чтобы она была доступна при прокрутке. Таблицу характеристик — адаптировать под узкий экран, без горизонтальной прокрутки.
Типичные ошибки
Подведём список ошибок, которые мы встречаем в аудитах чаще всего:
- Мелкое главное изображение, которое невозможно рассмотреть
- Отсутствие цены без объяснения, как её узнать
- Несколько равнозначных кнопок, конкурирующих за внимание
- Характеристики картинкой или PDF-файлом вместо текста
- Описание, скопированное с сайта производителя
- Отсутствие информации о наличии и сроках
- Перегруженность блоками «смотрите также» и баннерами
Как тестировать карточку
Лучший способ проверить карточку — посмотреть, как с ней работают реальные люди. Карты кликов и записи сессий показывают, куда смотрят посетители, что их интересует и где они застревают. Можно провести и простое юзабилити-тестирование: дать пяти людям задачу найти определённую информацию в карточке и понаблюдать за ними.
Карточка в каталоге без онлайн-оплаты
В сайтах-каталогах, где нет оплаты на сайте, карточка решает немного другую задачу: не продать сразу, а убедить оставить запрос. Здесь особенно важны три вещи. Первая — понятный следующий шаг: что произойдёт после нажатия кнопки, когда ответит менеджер, что он пришлёт. Вторая — возможность собрать несколько позиций в один запрос, чтобы закупщику не приходилось отправлять заявку на каждый товар отдельно. Третья — максимум технической информации в открытом доступе, ведь в B2B карточку часто изучает инженер, который не будет звонить ради каждого параметра.
Связанные товары и навигация
Нижняя часть карточки — хорошее место для блоков, которые помогают продолжить выбор: аналоги, сопутствующие товары, комплектующие, другие размеры той же серии. Такие блоки увеличивают глубину просмотра и средний размер заказа. Но важно, чтобы они были действительно релевантными. Случайные «популярные товары» из другой категории не помогают выбору, а только отвлекают. Для технической продукции лучше всего работает блок совместимых комплектующих, собранный вручную технологом, а не алгоритмом.
Итог
Карточка товара — главная продающая страница каталога. Чёткая иерархия, качественные фотографии, понятные характеристики, заметная цена и одна главная кнопка — основа, без которой не работают никакие другие приёмы. Когда основа готова, можно экспериментировать с деталями и улучшать конверсию на основе данных о поведении посетителей.