Обсудим ваш проект?
Интернет-маркетинг,
который даёт результат
Россия: 8 (800) 775-63-20
Отправить заявку

Правильное оформление карточки товара в интернет-магазине

Дарья Иванова,
редактор
Наталья Штанюк,
руководитель отдела SEO-продвижения
Поделиться
Просмотров:
2621
Время на прочтение:
Статья обновлена:
30 апреля 2021
Информация о статье
Просмотров: 2621
Время на прочтение:
Статья обновлена: 30.04.2021
Дарья Иванова, редактор
Наталья Штанюк, руководитель отдела SEO-продвижения
Поделиться

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

Директ Лайн
Кто мы
Крупнейшее агентство
интернет-маркетинга за МКАДом:
1200+ проектов
70 специалистов
15 лет на рынке
ТОП-10
лучших компаний интернет-продвижения России 2020
Коммерческое предложение

Что должно быть в карточке товара?

Перед заполнением карточки товара, следует определиться с основными целями этой страницы:

  1. Привлечение внимания потенциального покупателя.
  2. Удержание его внимания на конкретном товаре.
  3. Создание мотивации к покупке, ненавязчиво объясняя покупателю, зачем ему нужен данный товар.
  4. Если у него возникли вопросы, подробно ответить на них, желательно в рамках одной страницы.
  5. Также дать понять, что совершение покупки – простое действие, с понятным алгоритмом шагов.
  6. На карточку товара часто помещают информацию о предложениях, которые можно купить дополнительно.
  7. Иногда нужно учесть тот факт, что товар может не подойти пользователю, в этом случае следует предложить альтернативу, например, по более низкой цене.

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

Элементы навигации по страницам – хлебные крошки

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

Навигационная цепочка
Навигационная цепочка

Название товарной позиции

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

Название товарной позиции в карточке товара
Название товарной позиции в карточке товара

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

Оценка товара

У большинства известных интернет-магазинов на карточке часто располагается итоговый рейтинг от покупателей товара. Как правило, он выполнен в виде 5 звезд и формируется из отзывов. Такая система оценок при беглом знакомстве с товаром позволяет понять уровень доверия и удовлетворения от его покупки другими пользователями.

Оценка товара
Оценка товара

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

Изображение – это то, что сразу привлекает внимание на первом этапе знакомства с карточкой. Часто, именно от него зависит то, какие впечатления сложатся у посетителя от товара. Поэтому настоятельно рекомендуется использовать только качественные изображения для демонстрации продукции.

Пример изображения товара
Пример изображения товара

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

  • На десктопе – при наведении курсора появляется лупа. При клике изображение увеличивается, а при движениях мыши фокус увеличения перемещается.
  • На мобильных устройствах – увеличение происходит при клике на изображение.

Такой прием позволит посетителю рассмотреть все детали товара.

Также не забываем, что к основному изображению следует добавить еще несколько, объединив их в галерею. На последующих изображениях, товар следует демонстрировать в другом ракурсе или разобранном виде (как пример).

Галерея фото с товаром
Галерея фото с товаром

Более продвинутые интернет-магазины добавляют интерактив на карточку товара, создавая 3D изображения, благодаря которым пользователи могут осмотреть товар с любой стороны.

3D изображение
3D изображение

Не будет лишним, если кроме фотографий в галереи разместить видео-презентацию товара, это могут быть промо-ролики от производителя, либо обзор товара.

Преимущества:

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

Видеообзор товара
Видеообзор товара

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

Блок цены на товар

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

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

Пример блока с ценой
Пример блока с ценой

Кроме этого, блок с ценой может содержать различные варианты дополнительной возможности сэкономить, к примеру, с использованием скидочной карты или при оформлении кредита (продажа дополнительной услуги, либо беспроцентный вариант).

Если текущая цена товара не устраивает покупателя, чтобы удержать его, можно предложить настроить оповещение о снижении стоимости в будущем.

Также в этом блоке отображается информация о наличии товара в магазине (на складе), если он отсутствует, то предложите оповестить пользователя о поступлении.

Описание товара и его характеристики

Один из важнейших элементов карточки, именно в нем перечисляются технические характеристики товара, а также может содержаться мотивирующий к покупке текст (он актуален только для определенной категории, например, товаров премиум-класса).

Главный принцип создания описания товара – ответить на все основные вопросы посетителя. Если это характеристики, то не стоит сразу «вываливать» всю информацию. Лучше во вступительной части акцентировать внимание на самых важных параметрах, а ниже сделать ссылку, по которой будут разворачиваться второстепенные.

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

О товаре
О товаре

Инструкции и прочие характеристики
Инструкции и прочие характеристики

Как видно в примере блока характеристик, продавец также в нем разместил инструкцию по эксплуатации товара от производителя.

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

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

Отзывы других покупателей

Отзывы о товаре
Отзывы о товаре

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

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

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

Информация о доставке

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

Информация о доставке в  карточке товара
Информация о доставке в карточке товара

Кнопка добавления в корзину

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

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

Пример кнопки добавления в корзину
Пример кнопки добавления в корзину

К слову, расположение и внешнее оформление кнопки добавления товара может значительно сказываться на конверсии. Поэтому здесь важно проводить A/B-тестирование, а также перенимать опыт у крупных игроков рынка.

Дополнительные возможности

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

Добавление к сравнению позволяет оценить характеристики товара относительно похожих вариантов.

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

Основная цель – предложить посетителю альтернативу, если текущий товар его не устроил. Обычно этот блок располагается в виде горизонтального слайдера.

Блок «Похожие товары»
Блок «Похожие товары»

Блок «С этим товаром покупают»

Цель этого блока – увеличить средний чек. В нем предлагаются товары, которые будут дополнять текущий, к примеру, при покупке посудомоечной машины, предлагаются специальные моющие средства.

Пример блока «С этим товаром покупают»
Пример блока «С этим товаром покупают»

Здесь важно соблюсти релевантность предлагаемых товаров к текущему.

Дополнительные приемы

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

Учитывайте специфику своей продукции, старайтесь понять проблематику потребителя и на этом «играйте». К примеру, если это касается сферы доставки еды, то обычно ее заказывают с чувством голода. Ваша задача подогреть его сочными изображениями, быстрой доставкой и т.д.

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

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

Примеры продающих карточек товаров

Здесь собраны карточки товаров от известных интернет-магазинов.

Ozon

Карточка товара интернет-магазина Ozon
Карточка товара интернет-магазина Ozon

Один из лучших примеров оптимизированной карточки. Вся необходимая информация о товаре, доставке, скидках присутствует.

М.Видео

Карточка товара интернет-магазина М.Видео
Карточка товара интернет-магазина М.Видео

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

Додо Пицца

Здесь представлена оригинальная карточка товара, выполненная в виде всплывающего окна с интерактивными элементами. Посетителю предлагается наглядно «собрать» пиццу.

Карточка товара доставки Додо Пицца
Карточка товара доставки Додо Пицца

Оригинальная карточка товара Додо Пицца
Оригинальная карточка товара Додо Пицца

Доставка еды «5 пакетов»

Карточка товара - доставка еды
Карточка товара - доставка еды

В отличии от техники, здесь прослеживается другая специфика ниши. Магазин предлагает покупателю указать количество товарной единицы, сразу уведомляет о вариантах доставки, составе продукта и т.д.

Мебельный салон

Пример карточки товара мебельного магазина
Пример карточки товара мебельного магазина

В галереи представлены изображения кресла: фотографии, показывающие фурнитуру, качество швов текстуру материала обивки, а также чертеж и точные размеры.

Магазин надувных бассейнов

Карточка товара интернет-магазина надувных бассейнов
Карточка товара интернет-магазина надувных бассейнов

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

Магазин женского нижнего белья

Отличительной чертой карточек для подобных товаров, является наличие качественных фотографий.

Карточка товара для магазина женского нижнего белья
Карточка товара для магазина женского нижнего белья

SUNLIGHT

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

Пример карточки товара сети ювелирных украшений
Пример карточки товара сети ювелирных украшений

Магазин зоотоваров

Карточка товара для магазина зоотоваров
Карточка товара для магазина зоотоваров

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

Магазин парфюмерии и средств по уходу за телом

Дизайн карточки товара для магазина парфюмерии
Дизайн карточки товара для магазина парфюмерии

Карточка товара
Карточка товара

Минималистичный дизайн карточки включает в себя фотографии шампуня, его цену (в том числе по скидочной карте магазина, что мотивирует покупателя ее завести и стать постоянным клиентом). Подробные характеристики включают в себя указания для каких типов волос подходит шампунь – это упрощает выбор для посетителя.

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


Комментарии
ДОБАВИТЬ КОММЕНТАРИЙ
Увеличим ваши продажи через интернет!
Разрабатываем и поддерживаем сайты. Приводим на сайт целевой трафик с помощью SEO и рекламы. Увеличиваем конверсию сайтов. Имеем успешные кейсы увеличения продаж интернет-магазинов, медицинских центров, производителей, застройщиков, автоцентров, интернет-сервисов и пр. В команде 33 специалиста.

в топ-10 в SEO глазами клиентов 2014, 2016, 2017

В ТОП-10
«SEO глазами клиентов»

19 место
В топ-100 perfomance-агентств России

9 место в Топ-100 SEO-компаний России

9 место
В топ-100 SEO-
компаний России

1 место
Рейтинг агентств контекстной рекламы Новосибирска

Золотая сотня
Российского Digital

Сертифицированное агентство Яндекс 2020

Работающие инструменты SEO, интернет–рекламы, UX от
60 профессионалов
Директ Лайн — агентство интернет–маркетинга с 15-летним опытом, 1200+ клиентами и 50+ специалистами. Мы сами ведем этот блог. Раз в месяц пришлём самые интересные и полезные материалы.
  • #SEO
  • #интернет-реклама
  • #email-рассылки
  • #юзабилити сайта
  • #веб–разработка на bitrix
  • #кейсы
60 профессионалов
Раз в месяц
Без спама и СМС