Оформление карточки товара для интернет-магазина

Здравствуйте!
Представьте, что Вы совершаете покупки в физическом магазине. Продукт привлекает Ваше внимание, и Вы останавливаетесь, чтобы его рассмотреть. Уже через несколько секунд вы знаете все обо всех характеристиках предмета: размере, весе, цвете и т. д.

Красивый визуал в сочетании с подробным текстовым описанием – залог того, что Ваше предложение найдет своего покупателя.
В процессе разработки карточки ориентируйтесь на клиентов – их интересы, вкусы, возраст, пол. Весь дизайн должен быть функциональным и простым в использовании. Обращайте внимание не только на информацию, которые говорят о разумности вложения средств, но и на эмоции.
Фотографии, название, описание и отзывы клиентов – это четыре ключевых элемента. Но есть и другие нюансы, на которые стоит обратить внимание при оформлении товарных карточек.
Основные элементы карточки товара
Страница товара на сайте – поле битвы интернет-магазина за внимание потребителя. Как выиграть это сражение и не дать клиенту уйти к конкуренту? Правильно, создать и оформить продающую карточку товара для своего интернет магазина.
В онлайне Вы не победите только с помощью демонстрации продукта. Заполните карточку товара от начала до конца следуя нашим рекомендациям и оформите так, чтобы завоевать сердца покупателей. Есть обязательные элементы, которые повысят вероятность совершения покупки.
1. Название + артикул

- Свяжите название с категорией
В первую очередь выбор наименования зависит от вида товара. Вот как можно поэтапно составить наименование , отталкиваясь от этого:
- Если продаете обувь, то укажите необходимую категорию (“женская обувь”) или конкретный тип (“босоножки”).
- Добавьте сезонность: “летняя женская обувь”, “летние босоножки”.
- Если предложение относится к новой коллекции, так и укажите: “Женские босоножки летние 2024”.
- Правило 70 символов + формулы названий

Поэтому придерживайтесь правила 70 знаков – это примерно 6-8 слов.
Этого достаточно, чтобы раскрыть ключевые характеристики и выделить предложение среди других в определенной категории.
Правильная структура названия выглядит следующим образом:
- Наименование товара
- Бренд, модель
- Ключевые характеристики

Мебель. Если вы продаете мебель, допустим, прикроватную тумбочку, покупателю необходимо знать ее габариты уже на этапе поиска. Поэтому формула для мебели выглядит так: [Бренд] – [Название товара] – [Особенности (например, цвет)] – [Размер].

Книги. Если Вы продаете книгу, то придерживайтесь структуры: [Название] - [Авторы] на случай, если пользователь ищет конкретное произведение от этого писателя или поэта.


- Пишите без сокращений

- Самое главное о товаре – в первых двух-трех словах
З
Например, на изображении ниже показана разница в отображении наименования на странице категории и в карточке:
- Укажите артикул

- Чего не должно быть в названии
Избегайте капса (слов, написанных полностью с заглавной буквы), стоп-слов (“купить”, “дешево”, “оптом”), нестандартных символов, указания адреса магазинов и другой контактной информации. Все это помещается отдельно в соответствующие разделы, чтобы не путать потребителя ненужными ему деталями.
2. Бренд
Узнаваемость бренда напрямую влияет на продажу – дает преимущество над конкурентами, а также укрепляет доверие аудитории и повышает лояльность.

Указание на бренд в названии товара позволяет клиентам комфортно ориентироваться в каталоге продукции.
Помимо этого, некоторые интернет-площадки добавляют логотип бренда отдельно в карточку, как это сделано в примере ниже:

3. Категория
Это разделы интернет-магазина, по которым клиент быстро переходит к нужному ему типу товаров. Выбирайте категории, которые соответствуют назначению и характеристикам продукта.
Ошибочное размещение предложений в категориях напрямую повлияет на качество и объем продаж. Нет смысла размещать, например, женские джинсы в категории мужских – этот раздел будет просматривать нецелевая аудитория, а целевая о Вашем предложении даже не узнает.
- Выбор “непопулярных” категорий

4. Фото
Правильно подобранная фотография серьезно влияет на окончательное восприятие товара. Используйте изображения с разных ракурсов в высоком качестве (разрешение должно быть не менее 450 на 450 пикселей, максимальный размер стороны – 8 000 пикселей).
Следующие советы по оформлению карточки товара создадут для посетителя страницы иллюзию, что он видит предмет перед собой и может к нему прикоснуться.
- Масштабируйте фото
Н
а маркетплейсах есть встроенная функция масштабирования, чтобы покупатель мог рассмотреть товар в деталях. Возьмите эту фишку на заметку и для собственного интернет-магазина.
- Демонстрируйте товары в ситуациях из повседневной жизни
Например, в каталоге IKEA мебель сфотографирована в окружении домашнего декора.

Таким образом, пользователи лучше понимают, как тот или иной предмет впишется в интерьер.
- Используйте инфографику

- Задействуйте людей на фото
Фото с реальными людьми вызывает у пользователей доверие. Следите за тем, чтобы целевая аудитория ассоциировала себя с приглашенными моделями. Потребителям приятно и комфортно видеть обычные вещи и таких же обычных людей, которые этими предметами пользуются.

- Экспериментируйте с галереей

5. Видео
Видео демонстрирует покупателям товар в действии и в мельчайших деталях. Перед съемкой определитесь с форматом и тематикой ролика, обеспечьте его высокое качество. Расскажем подробнее о жанрах видео:
- Обзор

- Инструкция по применению

- Использование в жизни
Этот жанр максимально вовлекает в процесс использования, демонстрирует все достоинства продукта в руках модели в реальной жизненной ситуации.

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

- Отзыв

6. Описание/характеристики
Текстовая информация в карточке делится на данные о самом продукте и политику доставки и возврата. О второй части расскажем чуть позже. В сведениях о товаре обязательно заполните два раздела:
1. Технические характеристики

2. Описание
Его задача – воздействовать не только на разум потребителя, но и на чувства. Эмоциональные описания всегда вызывают больший отклик, чем сухие факты. Текст заменяет прямое взаимодействие с клиентом.
Напишите текст самостоятельно — не копируйте этот раздел у производителей. Поисковые системы понижают позиции текстов-дублей в результатах поиска.
Используйте простые предложения с минимальным количеством терминов. Описание должно быть понятным даже для покупателей, которые не особо разбираются, допустим, в характеристиках компьютера.
- Добавьте детали

Покажите примеры, опишите положительные аспекты его использования.
- Напишите инструкцию по применению

Если же вы продаете мебель, позаботьтесь о том, чтобы у покупателя была инструкция по сборке. Добавьте ее отдельным пунктом в виде текста или медиафайла:

- Пишите текст на картинках

- Используйте сторителлинг

7. Кастомизированный выбор товара
Если предмет представлен в разных цветах, размерах, объемах, предоставьте потребителю возможность выбрать варианты. Сгруппируйте их на одной странице в виде списков или блоков.
- Предоставьте возможность выбора цвета

Но если оставить в каталоге только одну карточку с возможностью выбора цвета, но без фото в других оттенках, то покупатель решит, что нужного цвета нет в наличии.
- Представьте реальный ассортимент
Следующие два способа предлагают удобную навигацию по вариантам и повышают эффективность поиска по сайту, а также привлекают внимание клиентов фотографиями товара в разных цветах еще на этапе просмотра каталога.
1. Загрузите фото во всех цветах в галерею:

2. Или добавьте кликабельный блок выбора цвета или опцию "Посмотреть в другом цвете":

- Откройте доступ к линейке размеров

8. Цена
Стоимость зависит от множества факторов: бонусные системы, регион доставки, возможность рассрочки, снижение цены и т.д. Отразите все эти факторы в карточке . Если на главной странице будет написана одна цена, а при его добавлении в корзину появится другая - есть риск получить отказ от покупки.
- С доставкой или без

- Гибкая цена

- Баллы/бонусы
В случае, когда у пользователей есть возможность накапливать и списывать баллы, обязательно укажите эту информацию и распишите условия:

- Рассрочка

- История цены

- Преимущество Вашей цены

Вторая: если продукт уникален, то подчеркните это с помощью триггеров. О них мы расскажем далее в разделе “Дополнительные элементы”.
9. Кнопка “Добавить в корзину”/”Купить”

- Действие кнопки должно быть очевидным

“Купить” должна сразу перенаправлять клиента на оформление заказа, а кнопка “Добавить в корзину” – переносить покупку в отдельный раздел сайта, чтобы пользователь продолжал исследовать магазин.
- Лайфхак: задействуйте ограничения

10. Кнопка “Добавить в Избранное”
Некоторые пользователи Интернета готовы сразу совершить покупку, но есть и те, кому нужно подумать, сравнить Ваше предложение с другими, оценить свои возможности.

Вместо “Добавить в избранное” можно предложить аналоги этой кнопки:
- Сравнить

- Уведомить о поступлении/Подписаться на товар (если нет в наличии)

- Сообщить об изменении цены

11. Отзывы покупателей

- Собирайте отзывы разными способами

Как получить первые отзывы:
- Предоставьте стимулы для их написания. Скажем, предложите скидку в обмен на мнение или разыграйте приз среди тех, кто рекомендовал другим совершить покупку.
- Попросите своих самых надежных оффлайн-клиентов об услуге.
- Если покупатель подписан на рассылку от магазина, то после оформления заказа напомните ему о возможности оставить отзыв.
- Запустите бонусную систему за отзывы. Такое, например, практикует интернет-магазин Shein.
- Работайте с обратной связью

12. Рейтинг товара
У покупателей всегда есть опасение, что ожидания от приобретения не совпадут с реальностью. Позвольте просматривать рейтинг всем желающим и участвовать в его формировании, не покидая страницу.

В интернет-магазине DNS для каждого товара есть блок с рейтингом и отзывами. Он свидетельствует, что гаджет нравится тем, кто его приобрел, как в целом, так и по отдельным параметрам.
Дополнительные элементы карточки товара
Помимо основных элементов, которые должна включать в себя грамотно оформленная товарная карточка, есть также дополнительные. Их цели – сделать так, чтобы о Вашем предложении узнало как можно больше людей; сократить количество однотипных вопросов от покупателей; а также мотивировать их на новые покупки.
1. Раздел “Похожие товары”

2. “С этим товаром также искали”
З
3. “С этим товаром также покупают…”

4. “Вы недавно просматривали”

5. “Этот товар недавно купили…”

6. “Поделиться в соцсетях”

7. “Вопросы о товаре/FAQ”

Если Вы разрешите неавторизованным посетителям задавать любые вопросы, то будьте готовы предоставлять ответы. Отзывчивость продавца также значительно стимулирует продажи.
8. Информация о доставке/примерке

Расчет доставки
Ч
Если доставка платная, то не заставляйте клиента переходить на сторонние сайты. Модуль для расчета стоимости доставки должен находиться сразу в карточке. Это значительно повысит вероятность оформления заказа.

9. "Хлебные крошки"
Навигационная цепочка или, по другому, “хлебные крошки” – так обозначается иерархия страниц на сайте. Путь, который прошел пользователь от главной страницы до той, на которой находится сейчас, показан на примере:

С помощью навигационной цепочки потенциальные заказчики понимают, в каком разделе сейчас находятся и какую роль он играет в общей структуре интернет-магазина. С ней заказчику легче найти нужный продукт. "Хлебные крошки" также нужны, чтобы быстро найти нужный товар, а потом вернуться на несколько шагов назад без потери всех заданных настроек поиска.
10. Триггеры
Это импульс, который помогает принять решение о покупке . Следующие инструменты точно помогут вам обратить внимание потребителей на Ваше предложение:
1. “Новинка”, “Ограниченный выпуск” – такие надписи сообщают о новых поступлениях и лимитированных коллекциях, что запускает FOMO-эффект.

2. Скидка. Сэкономить и совершить покупку за меньшую стоимость стремится каждый. Упоминание скидки мотивирует покупателей приобретать именно Ваш продукт.

3. Лучшая цена - триггер, который говорит о том, что соотношение цены/качества для этой карточки является самым оптимальным.

4. Бестселлер - свидетельствует о том, что это самый популярный товар в категории. Люди доверяют выбору большинства — это ускоряет переход к оплате заказа.

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

11. Кнопка “Связаться с продавцом”
Для быстрого доступа к консультанту добавьте онлайн-чат или форму заказа обратного звонка. Как работает этот виджет? Клиент нажимает на иконку виджета и задает вопрос. По ключевым словам бот выдает статьи из базы знаний. В случае, если нужной информации у бота не оказалось, покупателя перенаправляют на реального человека, либо появляется форма обратной связи для ожидания звонка/письма с ответом.

Пример структуры взаимодействия с виджетом онлайн-чата в онлайн-магазине IKEA
Расширьте функционал виджета обратной связи различными командами по обращению к службе доставки, самому продавцу или магазину. У покупателя могут возникнуть трудности с доставкой, он захочет согласовать точное время получения или отправит запрос на склад о количестве интересующего его предмета. Многообразие таких возможных ситуаций делает крайне важной функцию обращения к разным отделам магазина.
А для увеличения притока новых клиентов предложите посетителю оставить свои контактные данные в виде мобильного телефона или электронной почты. Он подпишется на Ваш ресурс и будет получать новости от компании о новых поступлениях, скидках и акциях.
Коротко о главном
Создание карточки товара – это процесс, который требует терпения. Каждый элемент должен быть продуман, чтобы пользователь интернет-магазина извлек максимально полную информацию перед оформлением заказа.
Помните о следующих нюансах:
- Используйте подходящий язык для целевой аудитории. Заполняйте информацию о товаре и оценивайте любые изменения в ней с позиции потенциального покупателя.
- Создавайте карточку с намерением продать. Используйте фото с разных ракурсов и в разных ситуациях использования, используйте сторителлинг в описании, чтобы побудить клиента нажать на кнопку “Купить”.
- Разработайте адаптивный дизайн карточки. Помните, что пользователи посещают интернет-магазины не только с компьютера, но и со смартфонов. Поэтому адаптируйте карточку под разные размеры экрана и разделите описание на блоки или абзацы по смыслу, чтобы покупателям было легче воспринимать информацию. Сохраните основные элементы: выбор размера и цвета продукта, фотографии, подробное описание, наличие на складе, сроки доставки. Если посетитель не найдет важную информацию, то уйдет в другой интернет-магазин, где ее легко найти.
- Информируйте о доступном запасе. Точно указывайте, сколько единиц продукции у вас осталось. Если покупатель увидит, что у вас почти нет в наличии определенного товара, то он захочет купить его до того, как он закончится.
- Используйте ключевые слова в названии и описании. Каждый ключ – это потенциальный клиент. Достаточно 30-40 слов, чтобы Ваше предложение поднялось на фоне конкурентов в поисковой выдаче.
- Работайте с обратной связью. Отвечайте на любой вопрос, который возникает у клиента перед оформлением заказа. Нет сомнений – нет преград на пути к покупке .
Если Вы добавите в карточку описанные выше элементы, то добьетесь успеха в e-commerce и увеличите продажи.
До новых встреч!