Лого vc.ru

19 советов по оформлению карточки товара в интернет-магазине

19 советов по оформлению карточки товара в интернет-магазине

Маркетолог агентства Roma.net.ua Алена Пустовая написала колонку по мотивам выступления на конференции UWDC — о том, как оформить страницу карточки товара в интернет-магазине.

Поделиться

Программист скажет, что важно не «напаривать» и не быть назойливыми. «Эти ужасные всплывающие окна, чаты! Я бы ни за что тут не купил».

SEO-специалист попросит упомянуть чаще слова «купить» и «Москва» и разместить SEO-текст над товарами. Потому что простыня текста за $3 более важна для поисковой системы, чем фотографии и тексты товара.

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

Чем отличается опытный заказчик от начинающего интернет-торговца

Начинающий послушает одного специалиста. И в лучшем случае ему поверит. И всё сделает с перекосом на одну сторону. В худшем — доверится своему вкусу и через год переделает всё заново. Но до этого он вынесет мозг дизайнеру «что-то у вас главная скучная», «поиграйтесь со шрифтами» и «мне не нравится логотип, давайте ещё поищем».

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

И тут он начнёт отрисовывать страницу товара. Хотя это самая главная страница в интернет-магазине. Опытный интернет-торговец начинает с дизайна страницы товара.

Почему страница товара — главная

Решение о покупке принимается на карточке товара (кроме очень знакомых товаров, типа продуктов или канцтоваров, где из названия и цены и так всё понятно). Не все покупатели попадут на главную страницу.

Кто-то придёт на каталог, а кто-то сразу на карточку товара. Что можно сказать точно — все покупатели пройдут через карточку товара.

Основные блоки хорошей карточки товара

  • Название.
  • Фото, видео.
  • Цена.
  • В корзину.
  • Наличие.
  • Отзывы.
  • Описание.
  • Характеристики и выгоды.
  • Доставка, оплата, гарантия, УТП.
  • Телефон/чат.
  • Акция на товар.
  • Комплекты.
  • Блямбы.

Фотолинза

Используйте фотолинзу как альтернативу увеличение фото в новом окне или в лайтбоксе.

Каких проблем ждать при реализации? Фотолинза увеличивает картинку в 2-3 раза. Поэтому важно использовать изображения только высокого качества. Поставщик не всегда даёт качественные фото. Или даёт, но не в тех ракурсах.

Сделайте фото товаров самостоятельно. Не стоит фотографировать все продукты. Хватит и 20% самых продаваемых товаров.

Чтобы добавить фотолинзу на сайт, используйте специальный скрипт.

Цена, экономия, скидка

Покажите пользователю, почему выгодно покупать именно у вас.

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

Тестируйте разные варианты блоков, чтобы выбирать наиболее эффективный.

«В корзину» или «Купить»

Тут можно подумать, а какая разница? Мы тестировали кнопки «Купить» и «В корзину» в нескольких проектах. Измеряли конверсию и средний чек. Разница есть.

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

Если у вас магазин электроники — пользователь, скорее всего, купит 1 товар. Для таких сайтов лучше работает «Купить».

Хотите протестировать кнопку? Используйте Visual Website Optimizer. Или пробуйте свое решение для A/B-тестов, потому что, по нашему опыту, VWO не всегда корректно считает.

Что однозначно работает? Если кнопка оформлена не в цветах сайта. Если сайт зелёный — добавьте красную кнопку. Синий сайт — кнопка оранжевая. Выделяйте кнопку, чтобы привлекать внимание пользователей.

Дополнительное полезное действие

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

  • добавить в закладки;
  • в избранное;
  • отложить товар;
  • лайкнуть товар, чтобы сохранить его.

Это действие, которое не требует так много обязательств. Поэтому пользователь охотней оставит свои контакты.

Что делать с новым контактом

  1. Догоняйте пользователя с помощью ремаркетинга.
  2. Отправляйте триггер «Заброшенная корзина».
  3. Напишите email, что товар заканчивается или на него действует скидка.
  4. Через 30 дней напишите, что заканчивается срок действия корзины. Если пользователь не купит, мы очистим сохранённый список.

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

«Есть в наличии» или «Есть на складе»

Чтобы выбрать более эффективный вариант для вашего проекта, используйте A/B-тесты. Как и с кнопкой «Купить» или «В корзину».

Что ещё увеличивает эффективность такого блока? Напишите, сколько товаров осталось в наличии. И добавить дату обновления информации. Важно добавлять правдивую информацию. И формировать правильные ожидания у клиентов.

Например, пользователь видит, что на складе осталось только три товара. Информация свежая. Обновили сегодня. Хочешь получить товар? Поспеши оформить заказ.

Характеристики и выгоды

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

Как это сделать?

  • Выделите самые частые характеристики товаров на сайте.
  • Пропишите для каждой характеристики выгоду.
  • Настройте автоматическую генерацию выгоды в описание товара.

Например, одна из возможных характеристик товара — «кружевное белье». Мы один раз написали текст выгоды для «кружевного белья»:

«Изюминка Вашего облика — кружево. Сейчас оно обрело «второе дыхание». Кружево — это воплощение шика и благородства, изысканности и нежности. Готовы ловить завистливые взгляды? Подберите одежду с кружевом».

Если в карточке товара появляется характеристика «кружевное белье», сайт автоматически генерирует описание. В нём — наш стандартный текст с выгодой.

Доставка, оплата, гарантия и преимущества

Условия доставки, оплаты, гарантии и преимущества — это то, что влияет на решения пользователя покупать. Отвечайте на эти вопросы на странице товара.

Создайте единый привлекательный блок с УТП (уникальное торговое предложение). Вы сразу показываете свои преимущества. И отвечаете на страхи покупателя. Узнайте, как подготовить хороший блок с УТП в блоге Антона Рожкова.

Добавьте блок с УТП на другие страницы сайта — на главную, в корзину. Читайте, как размещение блока с УТП увеличивает конверсию на 25,5%.

Персонализация

Как использовать персонализацию в карточке товара?

Транслируйте разные объявления в будние дни и по выходным. Пример блока на сайте, который появляется только в воскресенье:

Персонализируйте сайт для разных регионов:

  • С какого источника пришёл пользователь?
  • Это первая или вторая покупка?
  • Сейчас день или ночь?

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

Акции

Вы объявили акцию. Добавили информацию о ней на главную страницу. Супер. Добавьте информацию и на карточку акционного товара.

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

Комплекты

Продаёте телефон? Предложите клиенту чехол. Продаёте кожаные ботинки? Предложите крем по уходу за кожаной обувью и силиконовые стельки.

Комплекты увеличивают средний чек. И соответственно — вашу прибыль.

Блямбы

Блямбы — это символы, которые дают дополнительно представление о магазине. Яркие, привлекающие внимание. Они транслируют выгоду потребителя. Блямбы могут быть кликабельными или нет.

Ещё в 1990 году компании Nielsen Norman Group провела исследование. Выяснили, что только 16% интернет-пользователей вчитываются в тексты. Остальные — просто сканируют сайт. Смотрят заголовки, выделенные слова, графические символы. Поэтому используйте яркие блямбы вместо текстов о преимуществах компании.

Иллюзия выбора

Чтобы повысить вероятность покупки — предложите клиенту выбор. Создайте два варианта товаров. Один из них — явно привлекательней. Люди начнут охотнее делать заказ. Подробней о психологических механизмах иллюзии выбора читайте в книге «Предсказуемая иррациональность».

Выводы

  1. Начинайте создавать сайт не с главной, а с карточки товара.
  2. Проверьте на странице товара наличие основных блоков по списку.
  3. Тестируйте, тестируйте и еще раз тестируйте.

Полное выступление по ссылке.

Популярные статьи
Показать еще
Комментарии отсортированы
как обычно по времени по популярности

Как всегда Романет на высоте!

Если тестировали и проверяли, то где описания тестов и цифры?

Буллшит

В статье прописные истины, для новичков то что надо.

Ребят, вычитывайте тексты! Когда я читаю какой-то материал и вижу грамматические ошибки или «описки», доверие к нему резко падает. И не только к статье, но и к сайту в целом. Наверняка не у меня одного так.

«Тестируйте разные варианты блоков, чтобы выбирайте наиболее эффективный»

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

Когда я читаю какой-то комментарий и вижу грамматические ошибки или «описки», доверие к нему резко падает. И не только к комментарию, но и к человеку в целом. Наверняка не у меня одного так.

«Истины, конечно, прописные, но почему-то с этим всем возникают проблемы проблемы у большинства»

(это я к тому, что тексты мы вычитываем, но ошибки, конечно, проскакивают, для рапорта можно использовать сочетание CTRL+Enter)

Хорошо, Константин, в следующий раз воспользуюсь, если не забуду.

0

Нет, не вычитываете. Ошибки супер заметные.

Хорошо, если замечаете их, присылайте нам, пожалуйста.

0

хохлы, сэр!

самостийность - в школах вместо уроков русского языка какая-то никому не нужная "великодержавна українська мова"

По ценам спорно. При наличии сервиса продавать можно и нужно, не снижая цену по сравнению с конкурентами.

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

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

> Фотолинза
> Используйте фотолинзу как альтернативу увеличение фото в новом окне или в лайтбоксе.

За фотолинзу хочется пиздить ногами.

Это из разряда "Запилите-как мне лэндос"

"Решение о покупке принимается на карточке товара"
Серьёзно? Есть такие экземпляры?

Для меня решение покупке осуществляется в 3 шага:
1. Осознавание необходимости этой вещи.
2. Сравнение моделей и отзывов на яндекс маркете
3. Сравнение цен и далее покупка, где цена ниже.

Если все покупают по самой низкой цене — то зачем тогда вообще делать разные сайты?

Я не говорил про всех, я описал свои действия и задался вопросом о существовании тех, кто так не делает. На что вы меня спрашиваете про разные сайты.

Напомнило анекдот:
- А правда, что у вас в Одессе принято отвечать вопросом на вопрос?
- А кто вам такое сказал?

А теперь когда мы вернулись к контексту моего первого комментария, предлагаю вынести из него одну простую вещь: я не куплю товар, если он мне не нужен.

Поэтому фраза "Решение о покупке принимается на карточке товара" абсурдна сама по себе и с этим бесполезно спорить.

Да, Вы правы, с Вами бесполезно спорить :)

Поэтому вы привели в порядок мысли, обдумали ход своих действия, набрались мужества, собрали статистику...и поставили минус на мой коммент?

Очень круто, вы мой кумир!

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

Однако ваша модель действий представляет собой лишь одну из возможных.

Не все покупатели пользуются Яндекс Маркетом.

Из тех, кто пользуется не все ищут самую низкую цену по нему (не все магазины работают с Яндекс Маркетом).

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

"Мы тестировали кнопки «Купить» и «В корзину» в нескольких проектах. Измеряли конверсию и средний чек. Разница есть."

А не думали, что просто в разных случаях были разные группы пользователей с разной необходимостью потребности товара?

Если я смотрел цены на чайники вчера, на сайте была кнопка "купить", подумал денек, решил, что чайник мне точно нужен за такую стоимость, зашёл сегодня, кнопку переименовали в "В корзину", я оформил, то кнопка "В корзину" работает лучше?

Да чушь!

Судя по комментарию вы незнакомы с принципами a/b тестирования. Если вам показали «купить» — то пока не сотрете куки будет «купить».

0

Знаком и очень даже хорошо. Я по образованию программист, поэтому про куки можете мне не рассказывать.

Дело в том, что сейчас очень много людей "А-ля, интернет-маркетолог 86 лвл" смешивают понятия "a/b тестирование" и "страдание хернёй".

Если заменить картинку, заголовок, и, допустим, сократить поля в ФОС - это изменения, которые можно отнести к существенным. Это можно назвать a/b тестированием и это может повлиять на конверсию.

Но если у нас дизайн сайта выполнен в голубых тонах, кнопка "Купить" - оранжевая, то переименовав её в "В корзину" и сделав фиолетовой, не изменится НИХРЕНА.

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

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

Не изменится НИХРЕНА если быть диванным критиком.
Мы тестировали и у нас надпись на кнопке влияла на per session value достоверно.

0

Спасибо огромное за потрясающий материал.

Относительно пункта:
Характеристики и выгоды.

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

Что вы думаете по этому поводу?
Какие решения в связи с этим вы применяете?

0

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

Тогда уточняющие вопросы по этому ответу:

1. Допустим это так, мы продвигаем категории. Но наличие дублированного контента все-же сказывается на общем авторитете сайта в глазах поисковика?

2. Рома, подскажи, как вы технически решали скрытие от индексации? Какие подходы?

0

1. Тут лучше самих представителей поисковых систем спрашивать и матерых сеошников. Меня волнует в этот вопросе польза для посетителя и описание товара, независимо от нагрузки контент-отдела.

2. Мы не скрывали, но подходы не секретны: noindex для Яши или ajax подгрузка для обоих ПС. Но с учетом того, что ПС всё лучше разбирают js — то это всё временно.

0

То же касается и пункта:

Доставка, оплата, гарантия и преимущества

0

Можно картинками, при желании. Но, по уму, как раз эту часть поисковые системы должны понимать.

0

А все же, естли какой-то опыт или какие-то факты из документации гугл, что он это реально понимает и не считает дублем и следовательно не занижает в выдаче?

0

Я не искал пруфоф. Но мне кажется, что доставка, оплата, гарантия для ПС — это де факто маркеры, что страница интернет-магазина и может ранжироваться по коммерческим запросам. Для меня это как пытаться убрать кнопку В корзину или Меню — можно, но поисковая система и сама должна понимать.

0

Не помешали бы цифры)
А вцелом, полезненько !

0

"с регионов" - это на каком языке? Рагульском?

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

Сейчас обсуждают
Дмитрий Лимонов

потому что ресторан не означает "дорого, бохато", как привыкли в РФ. Это всего лишь пункт общественного питания. Да, есть элитные рестораны, а есть в формате закусочных. Мир не кончается там, где ваши представления о нём не совпадают с реальностью.

«Будьте нашим гостем»: кому McDonald's даёт право бесплатно есть в своих ресторанах
0
Владимир Тихомиров

Похоже, пора на собеседовании в Яндекс спрашивать, в самом конце: вилкой в глаз или в жопу раз? И оценивать креативность процесса поиска правильного ответа... Будем перенимать международный опыт с адаптацией под наши условия, так сказать

Бывший глава Google затруднился ответить на один из традиционных вопросов компании на собеседованиях
0
Александр Васильев

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

«Никому не выгодно, чтобы у вас скапливались деньги»
0
Artem Zinnatullin
Juno

Не собираюсь оправдывать ролик сбера, но если вы про вот это видео с футболистом youtu.be/VGEfNcvntno, то оно ничем не лучше, тк там блин оператор(ы) по полю бегают, сверху съемка ведется и рядом с полем люди явно не на телефон снимают. Всем участникам было понятно, что это какой-то прикол. Была бы скрытая съемка — без вопросов.

Так можно и в сбере снять реального инвалида, но с кучей операторов, камер и режиссером рядом, понятное дело, его будут обслуживать максимально хорошо.

Видео: Герман Греф в «костюме инвалида» в отделении «Сбербанка»
0
Artem Zinnatullin
Juno

Я может не понимаю, но в чем большая разница между "в имитирующем инвалида костюме" и "под видом инвалида"?

Не вижу "небо и земля" на скриншоте. У всех одинаково желтушные заголовки.

Видео: Герман Греф в «костюме инвалида» в отделении «Сбербанка»
0
Показать еще