Карточка товара - это страница, на которую приходит поиск и на которой человек решает, купить у вас или уйти к конкуренту. Разбираем её по блокам: от обязательного минимума до того, что реально двигает продажи.
Карточка обычно достаётся сайту по остаточному принципу: движок собирает её из фида поставщика, дизайнер один раз рисует шаблон, и про неё вспоминают, только когда падают продажи. Именно сюда часто стекается значительная часть поискового трафика магазина: человек искал не "купить мебель", а конкретную модель.
За 10-15 секунд человек решает, доверяет ли он магазину, понятна ли цена и дойдёт ли товар вовремя. Если карточка не отвечает на эти вопросы сразу, он не станет разбираться - откроет вторую вкладку с тем же товаром у конкурента.
Обязательный минимум для карточки товара
Есть набор блоков, без которых карточка технически не работает, а не просто выглядит бедно: название, которое соответствует запросу; фотографии - минимум 3-4 штуки; цена без прокрутки; наличие - в магазине или под заказ, и на сколько дней; кнопка "в корзину" рядом с ценой, а не в подвале страницы; срок и стоимость доставки; характеристики; описание, отвечающее на вопрос, чем товар отличается от соседнего.
Из этого списка чаще всего пропускают срок доставки, хотя без него карточка не работает почти так же плохо, как без цены. Человек либо уже знает, когда ему нужен товар, либо выбирает между "заказать здесь" и "поискать в другом месте с самовывозом". Без срока решение принимается не в вашу пользу.
Что решает сильнее всего: фото, наличие, отзывы
Список выше - минимум, ниже которого карточка не выполняет свою функцию. А вот что реально двигает решение о покупке при одинаковой цене у конкурентов.
Фотографии с разных ракурсов и с масштабом. Одна студийная фотография на белом фоне работает хуже, чем 5-6 живых кадров: товар в руках или рядом с привычным предметом, деталь крупным планом, упаковка. Масштаб особенно важен там, где размер трудно представить по описанию - мебель, техника, украшения.
Честное наличие. Формулировка "уточняйте по телефону" убивает доверие быстрее, чем отсутствие товара вовсе. Если позиции нет, лучше сразу показать это и предложить похожий товар или подписку на уведомление о поступлении.
Отзывы и вопросы к товару. Отзывы снимают сомнение, которое не закрывает ни одно описание: как оно на самом деле. Раздел вопросов решает вторую задачу - там оседают вопросы про совместимость, размер и гарантию, которые иначе идут в чат или звонок. Как собирать отзывы и не получить накрутку, которая всплывёт при проверке, разбирали в статье про отзывы на сайте.
Один товар - одна страница или несколько
Если товар продаётся в нескольких цветах или размерах, есть два пути: карточка с переключателем вариантов или отдельная страница на каждый вариант.
Переключатель удобнее покупателю: не нужно возвращаться назад, чтобы сравнить цвета, а отзывы накапливаются в одном месте, а не размазываются по десяти страницам. Это стандартный выбор для одежды, обуви, мебели с вариантами обивки.
Отдельные страницы нужны, когда варианты по факту разные товары для поиска: у них разный спрос, цена и набор характеристик. Пример - смартфон на 128 и 256 гигабайт: у версий свои частотные запросы, и если склеить их в одну карточку, вторая просто не появится в выдаче по своему запросу.
Доставка и оплата прямо в карточке
Частая ошибка - вынести условия доставки и оплаты на отдельную страницу и поставить на неё ссылку. Формально информация есть, но большинство посетителей на неё не переходят: лишний клик почти никогда не делают из любопытства.
Базовое место для этих условий - сама карточка: способ и срок доставки в выбранный город, стоимость или порог бесплатной доставки, способы оплаты значками рядом с кнопкой заказа. Детали вроде расписания курьеров и реквизитов для юрлиц остаются на отдельной странице - в дополнение к блоку в карточке, а не вместо него.
Похожие товары и хлебные крошки
Под карточкой обычно ставят два блока: похожие товары того же типа и сопутствующие товары другого типа. Первый держит человека в магазине, если модель не подошла по цене или наличию. Второй увеличивает средний чек - чехол к телефону, крепёж к полке, расходники к технике.
Хлебные крошки над названием делают две вещи сразу: показывают раздел каталога и дают путь назад без кнопки браузера. Для поиска они же становятся маршрутом от каталога до товара, который попадает в выдачу дополнительной строкой.
Карточка для поиска: описание, характеристики, разметка
Три вещи в карточке работают на поисковый трафик отдельно от остального контента магазина.
Уникальное описание. Выгрузка от поставщика слово в слово стоит на десятках чужих сайтов, и поисковик выбирает, какую версию текста показать первой - обычно не вашу. Переписывать вручную тысячи карточек нереально, поэтому уникальными делают в первую очередь топ продаж, остальное - короткое описание и таблица характеристик.
Характеристики таблицей, а не абзацем текста. Так их проще сравнивать глазами, и поисковик надёжнее вытаскивает параметры в сниппет.
Структурированная разметка товара - код, который явно сообщает поисковику цену, наличие и рейтинг товара. Без него эти данные приходится вычислять из текста страницы, и точность падает. С ней в выдаче может появиться цена и звёздный рейтинг прямо в сниппете, что поднимает кликабельность. Требования описаны в Google Search Central, а виды кода и примеры - в статье про микроразметку Schema.org. Если карточки собираются фильтрами по атрибутам, стоит проверить, не плодят ли фильтры пустые страницы-дубли - об этом статья про фильтр товаров.
Скорость: галерея - самый тяжёлый блок магазина
Проверка скорости карточки почти всегда упирается в галерею фотографий. На карточке с 6-8 изображениями это самый тяжёлый по весу блок, и любая небрежность здесь бьёт по всей странице.
Правило простое: первое изображение грузится сразу, остальные - лениво, по мере прокрутки. Оригиналы сжимают под реальный размер показа - исходник с камеры для галереи избыточен. Zoom реализуют без подгрузки огромного файла на каждый товар. Связь скорости карточек с позициями в выдаче разбирали в статье про SEO для интернет-магазина.
Мобильная карточка: что наверху, а что под спойлером
На телефоне карточка не помещается без прокрутки, поэтому порядок блоков решает, увидит ли человек кнопку заказа раньше, чем устанет листать.
Наверху - название, крупная фотография, цена, наличие, кнопка заказа. Дальше - переключатель вариантов и короткий блок доставки. Описание, характеристики, отзывы и похожие товары логично прятать под спойлеры с понятными заголовками: страница не растягивается на пять экранов прокрутки. Кнопку заказа на длинных карточках стоит продублировать плавающей панелью снизу экрана.
Частые ошибки и чек-лист приёмки карточки
Прежде чем принимать карточку у подрядчика, стоит пройти её глазами покупателя, который ищет товар впервые.
Частые ошибки: копия описания с сайта поставщика без изменений; наличие, узнаваемое только звонком; доставка и оплата на отдельной странице без блока-дублёра в карточке; галерея из одной фотографии без масштаба; кнопка заказа теряется среди текста; характеристики абзацем вместо таблицы; структурированной разметки нет, из-за чего цена не попадает в сниппет.
Чек-лист приёмки:
- есть все обязательные блоки из первого раздела, включая срок доставки;
- минимум 3-4 фотографии, есть кадр с масштабом;
- статус наличия виден без клика и без звонка;
- условия доставки и оплаты читаются прямо в карточке;
- описание не совпадает дословно с фидом поставщика хотя бы у топовых позиций;
- характеристики оформлены таблицей;
- стоит структурированная разметка товара, и она проходит проверку в инструментах Google и Яндекс.Вебмастера;
- на телефоне кнопка заказа доступна без долгой прокрутки;
- галерея не тормозит загрузку страницы.
Если по большинству пунктов ответ "да", карточка готова к запуску. Если нет - понятно, с какого блока начинать доработку.
С чего начать, если карточка уже есть, а продаж нет
Не обязательно переделывать карточку целиком. Сначала закройте обязательный минимум - срок доставки, честное наличие, кнопку заказа на видном месте. Дальше добавьте то, что двигает решение сильнее прочего: живые фотографии с масштабом и отзывы под товаром. Технические вещи - разметку, характеристики таблицей, уникальные описания - можно наращивать постепенно, начиная с товаров, которые уже приносят трафик из поиска.
Если непонятно, с чего начинать на конкретном каталоге, посмотрите на примеры интернет-магазинов в наших кейсах - там видно, какие карточки в итоге работают, а какие переделывали заново.
