Карточки товара в интернет-магазине: как их создавать и оптимизировать

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

Какой должна быть идеальная карточка?

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

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

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

Карточка товара в интернет–магазине: обязательные элементы и дополнительный функционал

Основоположник UX–дизайна Якоб Нильсен еще в 2006 году доказал, что при просмотре отдельных страниц в Интернете взгляд пользователя перемещается по траектории, напоминающей английскую F: от левого верхнего угла к правому, затем — от середины страницы вправо, и вниз. Поэтому располагать важную информацию следует именно так. Какие блоки являются самыми важными и как выбрать дизайн, который повысит конверсию?

Человекопонятный URL

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

Наименование товара

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

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

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

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

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

Отложенные товары/Избранное

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

Сравнение и расшар

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

Стоимость товара

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

Оценка товара и отзывы покупателей

Количество звезд или баллов, полученных конкретной товарной позицией, свидетельствует о ее популярности и высоком спросе. Такая пометка положительно влияет на продажи, повышая лояльность и доверие тех, кто только собирается сделать покупку. Обязательно дайте покупателям возможность поделиться собственным мнением и ознакомиться с отзывами других клиентов. Это не только облегчает выбор, но и заменяет опыт реального взаимодействия с продуктом. Согласно статистике, более 88% процентов постоянных покупателей интернет–магазинов и маркетплейсов принимают решение о покупке на основании отзывов, а 65% из них — оформляют заказы только на тех площадках, где отзывы уже есть.

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

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

Область покупки

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

«Добавить в корзину»

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

Несколько слов о SEO

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

Используйте уникальные тексты. Даже если вы и конкуренты предлагаете абсолютно аналогичный товар, копировать описание не стоит. Низкая уникальность или ее полное отсутствие может стать причиной блокировки вашего сайта. А если ее и не последует, то о первой странице поисковой выдачи придется забыть
Вставляйте в текст ключевые слова. Подобрать их поможет сервис Яндекс.Wordstat и Google Adwords
Не пренебрегайте заполнением мета–данных: title, description, заголовок первого уровня H1. Достаточно разместить в них название продукта, краткое описание параметров и ключевые коммерческие запросы «купить», «доставка», «цена», «интернет–магазин»
Используйте внутреннюю перелинковку. Добавляйте в карточку ссылки на другие разделы вашего ресурса.
Заполняйте мета–теги для визуала. Чтобы краулеры лучше индексировали контент в карточке, заполните title и alt к каждому изображению. Достаточно названия и одного – двух ключевых слов. Учтите: описание должно соответствовать изображению.
Настраивайте микроразметку. Такие теги, как «product», «offer», «Review» позволяют структурировать информацию на странице как для посетителей, так и для краулеров. А еще — помогают отобразить сведения о ваших товарах в сниппетах поисковой выдачи.
Не забывайте про адаптивный дизайн. Каждая карточка товара должна одинаково корректно отображаться как с компьютера и различных браузеров, так и при использовании других гаджетов с возможностью выхода в интернет. Наличие мобильной версии или специального приложения — жирный «плюс в карму» для любого магазина, а значит — практически гарантия высокого места в топе поисковой выдачи.

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

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

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

Если ваших навыков веб–дизайна не достаточно для создания магазина с нуля, загляните в наш маркетплейс. Здесь собраны сотни шаблонов, созданных профессионалами: от отдельных блоков и элементов, до готовых сайтов любой тематики. Вам останется только внести свои данные, использовать айдентику бренда и загрузить товары, чтобы запустить свой бизнес в области e–commerce.