×
Россия +7 (495) 139-20-33

Как создать идеальную карточку товара для интернет-магазина

Россия +7 (495) 139-20-33
Шрифт:
1 21978
Подпишитесь на нас в Telegram

Каждый SEO-специалист и маркетолог интернет-магазина знает, как важна подача информации о товаре и как это влияет на продажи.

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

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

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

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

Какой контент должна содержать карточка товара?

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

Поэтому не нужно забывать о таких важных моментах, как:

  • Принцип прототипичности – соответствие паттерному восприятию.
  • Интуитивность – понимание процесса принятия решения пользователем.
  • Убедительность – дизайн и контент страницы (в том числе стоит учитывать «психологию цвета»).

Удачная карточка товара включает в себя подробную и достоверную информацию о продукте. На странице обычно присутствуют:

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

Но, как вы понимаете, простое наличие этих элементов на товарной странице не означает ее высокой степени конверсии. Для 100% успеха потребуется соблюсти ряд правил и рекомендаций.

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

Изображение товара – уделяйте внимание визуализации

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

Почему оформление товаров важно не только в офлайне, но и в онлайне

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

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

Как демонстрация товаров в офлайне влияет на их восприятие покупателями

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

По данным исследования Forrester Consulting, около 55% людей никогда не покупают онлайн, так как предпочитают ознакомиться с продукцией лично. Эта цифра очень показательна: очевидно, что большинство людей хотят «увидеть» товар до приобретения. А так как посетители не могут его потрогать или примерить, то есть не взаимодействуют с продуктом лично, картинки на вашем сайте должны полностью компенсировать это. Качественные и яркие изображения помогут клиенту сделать выбор в вашу пользу и напрямую повлияют на вашу способность генерировать лиды.

№ 1: Высокое качество изображений товара

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

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

Почему качество изображений товара важно

№ 2: 360°, или Взгляд на продукт со всех сторон

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

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

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

Пример показа всех преимуществ товара в интернет-магазине

№ 3: Изображение всех вариантов продукта

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

Очень плохо, когда пользователь должен принимать решение о покупке с помощью палитры расцветок и материалов:

Как показать все вариации товара в интернет-магазине

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

Намного полезнее, если пользователь сможет увидеть продукт в других расцветках:

Удачный пример демонстрации всех цветовых решений на сайте интернет-магазина

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

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

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

Как Nike показывает модели в разных цветах на сайте интернет-магазина

Интернет-магазин Nike: как показать модели в разных цветах

№ 4: Возможность масштабирования

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

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

Как возможность масштабировать товары помогает покупателям

Зачем нужна возможность масштабировать товары на сайте интернет-магазина

№ 5: Товары в реальной жизни

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

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

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

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

Пример № 2: Вы продаете сумки. Размер на изображении может быть обманчив, поэтому делайте снимки с предметами повседневного обихода или в руках модели – такие фото дают лучшее представление о габаритах товара. Вы также можете показать, какие предметы поместятся внутрь.

Как показать товар в реальной обстановке на примере аксессуаров

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

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

Видеодемонстрация продукта

Изображения товара – хорошо, но видео – еще лучше!

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

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

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

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

Пример видеодемонстрации продукта на сайте Decatlon

Описание продукта

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

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

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

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

Хороший пример демонстрации и описания продукта – сайт divan.ru. В карточках товаров даны не просто технические характеристики, но и подробное описание, которое дополнено фотографиями и видео.

Как оформить описание продукта на сайте интернет-магазина

Цена и кнопка «Купить»

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

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

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

Сравните отображение цен на двух разных сайтах:

Как отобразить цену товара на сайте интернет-магазина

В первом варианте цена выглядит более выигрышно.

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

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

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

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

Проверьте правильность оформления карточки – если кнопку «В корзину» нельзя обнаружить в течение 3 секунд, значит, она недостаточно большая или контрастная.

Отзывы и рейтинг

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

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

Как оформить блок с отзывами и рейтингом на сайте интернет-магазина

Как оформить отзывы и рейтинг на сайте интернет-магазина

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

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

Друзья, теперь вы можете поддержать SEOnews https://pay.cloudtips.ru/p/8828f772
Ваши донаты помогут нам развивать издание и дальше радовать вас полезным контентом.

Есть о чем рассказать? Тогда присылайте свои материалы Марине Ибушевой


Новые 
Новые
Лучшие
Старые
Сообщество
Подписаться 
Подписаться на дискуссию:
E-mail:
ОК
Вы подписаны на комментарии
Ошибка. Пожалуйста, попробуйте ещё раз.
Отправить отзыв
  • Гость
    1
    комментарий
    0
    читателей
    Гость
    больше года назад
    Можно подобные статьи про цвет, типографику, современные бренды и дизайн в 2019?)
    -
    7
    +
    Ответить
ПОПУЛЯРНЫЕ ОБСУЖДЕНИЯ НА SEONEWS
Альманах фатальных ошибок b2b-сайта: как владельцы бизнеса обрекают сайты на бесславное существование. Часть первая
Сергей Ерофеев
3
комментария
0
читателей
Полный профиль
Сергей Ерофеев - Спасибо за комментарий! Вы правы, если за CMS следит заинтересованный профессионал - риски минимальны. Но мы же с вами понимаем, что: а) Не каждый разработчик делает все, как "для себя". б) После создания сайта разработчик редко остается на проекте в) Часто разработчик не является маркетологом. В этом случае принцип "функционал работает и этого достаточно" может быть на первом месте. Мы тоже видели большое количество хороших и качественных проектов на бесплатных CMS, но проблемных проектов мы видели сильно больше. Просто статистика.
Белые и серые методы продвижения. Тренды 2023
sarges
2
комментария
0
читателей
Полный профиль
sarges - Нужно учитывать и тот факт, что со временем методы продвижения меняются и необходимо подстраиваться под новые реалии. Посоветую заглянуть на zenlink.ru/blog/kak-izmenilsja-internet-marketing-za-10-let и почитать статью, там рассказывается о том, как изменился интернет-маркетинг за последние 10 лет, какие сейчас тенденции и какие прогнозы в этой сфере.
Почему сайтам нужно переезжать с конструкторов на полноценные CMS
Seodm.ru
3
комментария
0
читателей
Полный профиль
Seodm.ru - Ааа по мне, сам seo специалист, вероятность внедрения необходимого контента на тильда того же блока этапом работы или преимуществ, намного выше чем на движке. А что тильда что движок малый бизнес норм продвигается особо супер разработки не требуется
Как автоматизировать мессенджеры для бизнеса в CRM-системе
Алиналина
1
комментарий
0
читателей
Полный профиль
Алиналина - Кстати да. Но мы зарегались, CRMка реально интересная
Как мы увеличили для клиента трафик из поиска в 7 раз. Кейс
Кирилл Половников
2
комментария
0
читателей
Полный профиль
Кирилл Половников - Оба этих статуса (редирект и малополезная) преобладали в качестве проблем с индексацией. Помогла работа с .htaccess (в нем были ошибки и его чистили), работа над корректировкой редиректов, каноникалами и прочими техническими ошибками. Нельзя сказать, что только редиректы были ключевым препятствием.
Как показывать рекламу посетителям сайтов конкурентов
Павел
2
комментария
0
читателей
Полный профиль
Павел - Спасибо за комментарий. Гипотеза была в том, что с указанными счетчиками конкурентов показы будут не просто похожей аудитории их сайтов (как при рекламе по доменам), а именно на аудиторию которую Яндекс для себя разметил как целевая дл сайтов конкурентов. Важно, это гипотеза. А про белые нитки, как говорится, доверяй, но проверяй))
Кейс MediaNation: увеличили еженедельный трафик автомобильной компании на 50% за год и вышли в топ поиска по 300 запросам
Игорь Скляр
1
комментарий
0
читателей
Полный профиль
Игорь Скляр - Действительно, изначально рост был именно по информационным запросам. Но рост позиций и трафика по информационным запросам положительно повлиял и на связанные позиции по коммерческим запросам и сдвинул видимость с мёртвой точки
Чек-лист: как настроить рекламу в Яндекс Директе и избежать ошибок
Сергей Ильин
2
комментария
0
читателей
Полный профиль
Сергей Ильин - я ваще не туда написал
Как дожать сайт до ТОПа? Выжимаем весь сок из SEO под Яндекс и Google
Фанит
2
комментария
0
читателей
Полный профиль
Фанит - Спасибо автору за статью, полезно! По поводу сниппета сайта, для увеличения CTR можно дополнительно внедрить основные схемы микроразметки и улучшить его, чтобы выделялся на фоне конкурентов, особенно заметно в Google.
Можно ли продвигать сайт спонсорскими ссылками: разбор кейса
Александр
1
комментарий
0
читателей
Полный профиль
Александр - Хм.... ооочень сомнительный результат. За 10 000 в месяц получить 1 запрос в топ10, да ещё и в google, который на ссылки всегда лучше Яндекса реагировал - такое себе.... При этом достаточно странно были отобраны запросы с местами за ТОП50. Ведь давно известно же, что ссылки так быстро не сработают, к тому же за такое короткое время максимально, на что можно рассчитывать - это небольшое повышение средней. Поэтому тут логично было бы подобрать запросы, либо те, которые находятся близко к ТОП10, например на 11-15 местах, и посмотреть на их динамику. Либо на запросы, которые уже в топ10 находятся (5-10 места). Ведь после отключения контекста CTR в google кратно вырос и, например, разница 1 и 2-х местах отличается почти в два раза! Поэтому, если бы ссылки сработали на рост позиций с 5-10 мест, на 1-4 - это был бы кратный толк как в росте трафика, так и с точки зрения отдачи от вложений. Тем более как раз подвижки в 2-3 позиции уже дали бы ощутимый результат (если это, конечно не НЧ и микроНЧ запросы).... Так что считаю, эксперимент изначально был провальным уже на этапе отбора запросов.
ТОП КОММЕНТАТОРОВ
Комментариев
910
Комментариев
834
Комментариев
554
Комментариев
540
Комментариев
483
Комментариев
385
Комментариев
373
Комментариев
262
Комментариев
249
Комментариев
171
Комментариев
156
Комментариев
141
Комментариев
121
Комментариев
116
Комментариев
100
Комментариев
97
Комментариев
97
Комментариев
96
Комментариев
80
Комментариев
77
Комментариев
74
Комментариев
67
Комментариев
64
Комментариев
60
Комментариев
59

Отправьте отзыв!
Отправьте отзыв!