Контент-маркетингИнструкции
2020-10-14Артем Шпильский

Какой должна быть карточка товара: 11 приёмов оформления

Online-shopping-sites-india.jpg

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

«Контент — король»

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

Из чего состоит карточка товара

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

1. Хлебные крошки

Навигационная цепочка («хлебные крошки») показывает путь, пройденный пользователем от главной страницы сайта до текущей. Выглядит это следующим образом:

Хлебные крошки в интернет-магазине Ozon

Зачем этот элемент интернет-магазину? Всё просто: с его помощью пользователь может вернуться в интересующий его раздел каталога и посмотреть другие товары. Что касается места размещения, навигационную цепочку обычно выносят в верхнюю часть страницы — прямо над заголовком.

2. Название товара

Согласно исследованию Якоба Нильсена, при просмотре веб-страницы траектория движения взгляда у пользователя напоминает букву «F». Поэтому левый верхний угол подходит для названия продукта лучше всего — так пользователь сможет сразу убедиться, что попал на нужную страницу.

М.Видео размещает название над изображениями товара

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

[Категория товара] + [Бренд] + [Модель] + [Опциональные параметры]

Тогда названия всех товаров будут выглядеть следующим образом:

Ноутбук ASUS E210MA-GJ001T синий

3. Изображения товара

Единственное, что остаётся покупателю, когда он не может потрогать товар, — это посмотреть фотографии. Поэтому изображения должны как можно лучше передавать реальный опыт. Чтобы добиться этого, придерживайтесь следующих рекомендаций:

  • загружайте фотографии в как можно более высоком разрешении;
  • предусмотрите на сайте возможность приближения изображений (функция лупы);
  • разместите фотографии товара со всех возможных ракурсов;
  • если продукт доступен в разных цветах, добавьте изображения для каждого варианта.

В интернет-магазине lamoda для каждого цвета предусмотрена отдельная страница

Редакционный директор фриланс-площадки UpWork даёт следующие советы по работе с изображениями:

  • если вы продаёте сумки, рюкзаки или другие товары с внутренними отделами, фотографии «внутри» так же важны, как и фото «снаружи»;

Фото товара «внутри» на сайте Wildberries

  • не забывайте про детали: швы, пуговицы, рисунки ручной работы — покажите посетителям всё, что отличает товар от аналогичных, и говорит о качестве его изготовления;
  • если хотите продемонстрировать продукт как можно ближе к реальности, склейте изображения в формат 360 градусов;
  • не забывайте давать посетителям контекст — например, если вы продаёте одежду, фотографии на модели продемонстрирует, как именно ткань сидит на фигуре.

4. Видео

Невозможность потрогать товар — не единственное ограничение интернет-магазина. Также пользователи не могут посмотреть на продукт в действии. В таких условиях видеообзор на продукт — лучшее, что вы можете предложить потенциальному покупателю. Агентство DemoUP, создатель базы видеообзоров для ecommerce-проектов, приводит следующие цифры:

  • посетители, просмотревшие видео о товарах, совершали покупку на 85% чаще;
  • видео положительно влияет на поведенческие факторы: в среднем пользователи, смотрящие ролики, задерживаются на сайте на две минуты дольше;
  • 45% покупателей смотрят на товары в обычных магазинах перед тем, как заказать их в онлайне;
  • по мнению 71% опрошенных, видеообзор — лучший способ объяснить функциональные возможности продукта;
  • 57% потребителей говорят, что наличие видеообзоров на сайте даёт лучшее представление о товарах и снижает вероятность их возврата.

Раздел с видеообзором на сайте 220-volt

Если вы решите заняться видеообзорами, вот несколько рекомендаций, которые помогут сделать их эффективными:

  • не стоит рассчитывать на то, что пользователь добавить видео в список «Смотреть позже» на YouTube — придерживайтесь длительности обзора от одной до пяти минут, чтобы посетитель мог посмотреть его даже на ходу;
  • покажите разные режимы работы продукта и расскажите, какой они дают результат;
  • близкая съёмка продукта с разных ракурсов лучше всего создаёт впечатление живого просмотра товара в магазине.

Монтаж презентационного видеоролика для товара можно заказать у нас.

5. Описание товара

Готовой формулы, нормирующей объём описания в карточке товара не существует. Текста должно быть столько, сколько нужно, чтобы ответить на основные вопросы покупателей, проработать их возражения и сомнения. Если говорить о структуре описания, рекомендуем разбить его на две части:

  • Краткое описание. Первые 300-500 символов могут содержать основную информацию о товаре: что это за товар, кому и когда он полезен.
  • Полное описание. Разворачивается по клику на кнопку «Читать дальше». Подробно объясняет, как работает товар, в каких случаях его можно использовать, какими обладает преимуществами и какие у него есть ограничения. 

Заказать описание товара товара также можно у нас.

6. Характеристики товара

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

Блок с характеристиками товара в интернет-магазине DNS

7. Стоимость

Указывайте точную цену. Никто не любит скрытые платежи — непонятные перерасчёты не только не позволят заработать больше, но и отпугнут потенциальных покупателей. То же касается информации о доступности товара: избегайте формулировок «Наличие уточняйте у продавца». Если вы не торгуете эксклюзивными товарами, посетитель просто уйдёт к вашему конкуренту.

Что касается оформления, основные рекомендации тут простые:

  • стоимость должна быть чётко видна и сразу содержать в себе все комиссии, налоги и прочие платежи;
  • не забудьте добавить кнопку «Сообщить о поступлении» для товаров, которых нет в наличии;
  • доступность товара должна быть видна при беглом осмотре страницы;
  • если на товар распространяется бесплатная доставка или скидка, отобразите сумму, которую сэкономит покупатель, — этим способом многие годы успешно пользуется один из крупнейших интернет-магазинов Amazon.com.

Amazon.com всегда указывает сумму и процент от обычной стоимости товара, которую покупатель сэкономит благодаря скидке

8. Отзывы и рейтинг товара

Сотрудники компании Vendasta, создающей ecommerce-сервисы, делятся следующими цифрами:

  • 92% покупателей смотрят отзывы;
  • 88% из них ориентируются на отзывы при принятии решения о покупке;
  • 43% специально ищут отзывы о компаниях и товарах;
  • 88% доверяют отзывам в той же мере, что и личным рекомендациям.
Рейтинг со звёздочками для большинства покупателей — самый важный фактор оценки. Так почему бы не добавить его и на ваш сайт? Вместе с отзывами пользователей, которые уже совершили покупку, это может отлично сказаться на конверсии карточки товара.

Главное, не добавляйте на страницу заказные отзывы. Это самый простой способ разочаровать посетителей и убедить их уйти к вашим конкурентам. Вместо этого стимулируйте покупателей оставлять реальные отзывы — давайте за это бонусные баллы, промокоды или возможность участия в розыгрышах.

9. Кнопка «Добавить в корзину»

Кнопка покупки на странице — самая важная. Готовой формулы по её оформлению нет, а все рекомендации можно свести к двум советам: кнопка должна быть заметна пользователю и иметь контрастирующий с вашим сайтом цвет (если большинство элементов на сайте синие, не делайте кнопку такой же). Что касается места размещения, обычно кнопка находится возле цены.

Кнопка «Купить» на сайте Связного

Помните, двумя вашими лучшими советниками в этом вопросе должны быть здравый смысл и А/Б-тестирование. Рекомендации экспертов не распространяются на любой интернет-магазин. Так, призыв к действию «Купить в один клик» вам не подойдёт, если вы продаёте часы Hublot за 10 тысяч евро, а кричащий красный цвет далеко не всегда повысит конверсию карточки товара.

10. Похожие товары

Как увеличить количество продаж, не привлекая новых клиентов? Достаточно добиться того, чтобы покупатели заказывали больше. На странице товара этому могут способствовать следующие блоки: «С этим товаром также покупают», «Похожие товары» и «Вы также просматривали». Этими способами пользуются абсолютно все крупные площадки и интернет-магазины.

Увеличить средний чек можно, позаботившись о покупателе. Типичный пример такой допродажи — предложить купить монитор к системному блоку, объектив — к фотоаппарату или чехол — к телефону.

Блок допродажи на странице смартфона Samsung в интернет-магазине Ситилинк

11. Избранное и список желаний

Эти возможности есть не во всех интернет-магазинах, однако в крупных встречаются часто. По данным Metrilo, списки желаний (вишлисты) уже через полгода после внедрения повышают продажи интернет-магазинов почти на 20%. Как лучше их реализовать? Придерживайтесь следующих рекомендаций:

  • Сделайте списки удобными. Чтобы продукт попал в избранное, пользователю должно хватать одного клика на странице товара.

Кнопка добавления в избранное на сайте lamoda

  • Интегрируйте списки в дизайн сайта. Предусмотрите для избранного отдельный блок на сайте — так он будет регулярно напоминать пользователю о себе.
  • Предусмотрите возможность делиться списками. Пользователям должно быть легко отправлять ссылки на избранные товары в социальные сети и мессенджеры.
  • Используйте списки для ремаркетинга. Если вы уже знаете, какие товары хотят посетители, почему бы не догнать их с выгодным предложением?

Каждая карточка — уникальная

Когда страница товара хорошо выполняет свою работу, она позволяет покупателям легко находить нужную им продукцию, а продавцам — наслаждаться высокой конверсией. Приведённые нами советы помогут вам создать удобную и вызывающую доверие у посетителей карточку товара. Но работа на этом только начинается, ведь впереди — проверка гипотез и многочисленные тестирования. Только таким способом можно продолжать повышать продажи и отвечать потребностям вашей аудитории.

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