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

ИЗОБРАЖЕНИЯ

Слайд шоуГалерея слайд шоуМодальное изображениеЛайтбоксОтзывчивая сетка изображенийСетка изображенийГалерея вкладокЭффект наведения на изображениеНаложение слайда на изображениеНаложение на изображениеНаложение заголовка на изображениеНаложение иконки на изображениеЭффект к изображениюЧерно-белое изображениеТекст на изображенииИзображение с текстовым блокомИзображение c прозрачным текстомИзображение на всю страницуФорма на изображенииИзображение герояРазмытое фоновое изображениеФоновое изображениеВыравненные изображенияОкругленные изображенияИзображение аватарОтзывчивое изображениеИзображение по центруМинитюрное изображениеЗнакомство с командойЛипкое изображениеЗеркальное изображениеДрожание изображенияГалерея портфолиоПортфолио фильтрЗум изображенияЛупа изображенияПолзунок сравнения

Карточка товара в email рассылке

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

Чтобы такой блок с карточками товаров был более разнообразным, можно добавить ссылку на полезный материал по теме. Например, строительный гипермаркет Leroy Merlin предлагает карточки дверей и помощь в выборе:


Типичный блок с карточками товаров в рассылке строительного гипермаркета Leroy Merlin

На мой взгляд, это скучно. Гораздо круче делать подводку по теме и сразу показывать, как выглядит товар в жизни. Письмо с интерьерными товарами от La Redoute следует именно такому принципу: короткая подводка рассказывает, почему нужно немедленно купить эти вещи, классное фото делает все остальное. Здесь нет кнопок: можно просто кликнуть на название или цену товара, и из письма попадаешь на его карточку на сайте.


Письмо с необычной подачей товаров от магазина LaRedoute

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


Пример простого и стильного оформления карточек товаров в письме

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

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

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

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

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

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

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

Привлекательный внешний вид

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

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

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

Сайт Dribbble.

Как спроектировать карточку

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

Высота карточки может быть фиксированной или переменной. Источник изображения: Intercom

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

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

Источник изображения: Behance

ЕЩЁ

Полноэкранное видеоМодальное окноШкала времениИндикатор прокрутки Индикатор выполненияПанель навыковПолзунок диапазонаПодсказки при наведенииВсплывающие окнаСкладная секцияКалендарьВключить HTMLСписок делЗагрузчикиЗвездный рейтингПользовательский рейтингНаложениеКонтактные чипыКарточкиФлип-картаКарточка профиляКарточка товараОкно тревогиВыноска сообщенияПримечаниеМеткиКругиHR Горизонтальная линияКупонГруппа списковОтзывчивый текстВырезанный текстСветящийся текстФиксированный подвалЛипкий элементРавная высота столбцовОчистка поплавкаОтзывчивые поплавкиСнэк-бар/тостПолноэкранное режимЧертеж при прокруткеПлавная прокруткаГрадиент фонаЛипкий заголовокИзменить заголовок при прокруткеОтзывчивые столбцы ценПараллаксСоотношение сторонПереключатель нравится/не нравитсяПереключатель скрыть/показатьПереключаель текстаПереключатель классаДобавить классУдалить классАктивный классДревовидное представлениеУдалить свойствоАвтономный режим обнаруженияСделать скрытый элементПеренаправление веб страницыУвеличить при наведенииФлип-боксЭлемент вертикально по центруПереход при наведении курсораСтрелкиФигурыСсылка для скачиванияПолная высота элементаОкно браузераПользовательская полоса прокруткиРазличные устройстваЦвет заполнителяЦвет выделения текстаЦвет макераВертикальная линияАнимированные иконкиТаймер обратного отсчетаПишущая машинкаСтраница заставкиСообщение чатаВсплывающее окно чатаРазделенный экранРекомендацииСчетчик разделаСлайд-шоу цитатЗакрываемые злементы спискаТипичные точки прерыванияПеретаскиваемый HTML элементМедиа запросы JSПодсветка синтаксисаJS анимацииПолучить элементы Iframe

Сколько вешать в граммах: определяем объем текста для карточек товаров

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

В интернете вы можете столкнуться с мнением, что для карточки товара достаточно 500–1 000 символов. Иногда да, но все-таки порой этого мало, а порой много. Вопрос состоит в том, о каком именно товаре идет речь: допустим для откидного болта DIN 444 с ушком достаточно только технических характеристик, цены и фотографии – тексты никто читать не будет. А вот для флагманского смартфона Samsung Galaxy S20 нужен практически целый лендинг – чтобы красиво презентовать все его преимущества, которые помогут сделать пользователю выбор.

Поэтому при определении объема и содержания текста карточки товара следуйте простой инструкции:

Выберите товар, для которого вы планируете подготовить текст. Пускай в нашем случае это будет смартфон Xiaomi Mi 10 Ultra

Посмотрите результаты поисковой выдачи по запросам с названием товара – «Xiaomi Mi 10 Ultra», «купить Xiaomi Mi 10 Ultra», «Xiaomi Mi 10 Ultra цена». Не забывайте, что нас интересует прежде всего не контекстная реклама, а органическая выдача – с этими сайтми вы будете конкурировать

Оцените обстановку – откройте 3–5 сайтов, чтобы узнать, как вообще обстоят дела с карточками товаров

Обратите внимание на три важных момента: объем и содержание текстов, функционал и дизайн страницы. Ведь чтобы хотя бы приблизиться к ТОПу, ваша карточка Xiaomi Mi 10 Ultra должна быть не хуже, чем у прямых конкурентов

Допустим, если у конкурентов в карточках товаров почти по 1 000 символов – то вам нужен текст такого же либо чуть большего объема. Что касается содержания, то ситуация аналогичная – смотрим и повторяем.

Таким образом, для страницы Xiaomi Mi 10 Ultra нужен текст объемом 1 000 символов, в котором будут кратко описаны преимущества смартфона с точки зрения выгодны покупателя

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

По аналогии с телефоном можно определить объем и содержание текста для карточки совершенного любого товара.

Что делать, когда товаров очень много

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

Можно обойтись и без таких жертв. Проанализируйте по 1–3 товарам из каждой категории, этого будет вполне достаточно, чтобы уловить суть.

Хорошая карточка дает исчерпывающую информацию о товаре

Иначе говоря, отвечает на все возможные вопросы потенциального покупателя. Поэтому если для дорогой двуспальной кровати с мягкой дизайнерской спинкой нужно 4 000 символов, чтобы рассказать обо всех ее преимуществах – подготавливайте текст именно такого объема. А если для подарочного пакета достаточно буквально одного предложения, то обойдитесь им – не заставляйте копирайтера писать бессмыслицу на 1 000 символов.

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

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

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

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

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

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

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

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

ФОРМЫ

Форма входаФорма регистрацииФорма оформления заказаКонтактная формаФорма входа в соц сетиРегистрацияФорма с иконкамиРассылка по почтеСложенная формаАдаптивная формаФорма всплывающаяФорма линейнаяОчистить поле вводаКопирование текста в буфер обменаАнимированный поискКнопка поискаПолноэкранный поискПоле ввода в менюФорма входа в менюПользовательский флажок/радиоПользовательский выборТумблер перключательУстановить флажокОпределить Caps LockКнопка запуска на EnterПроверка пароляПереключение видимости пароляМногоступенчатая формаФункция автозаполнения

МЕНЮ

Панель иконокЗначок менюАккордеонВкладкиВертикальные вкладкиЗаголовки вкладокВкладки полностраничныеВкладки при наведенииВерхняя навигацияОтзывчивый верхний навигаторНавигация с иконкамиМеню поискаСтрока поискаФиксированная боковая панельАнимированные боковые панелиОтзывчивая боковая панельПолноэкранная навигация наложенияМеню Off-CanvasБоковые кнопки навигацииБоковая панель с иконкамиМеню с горизонтальной прокруткойВертикальное менюНижняя навигацияОтзывчивая нижняя навигацияГраницы навигацииМеню по правому краюСсылка меню по центруМеню равной шириныФиксированное менюСкольжение вниз по полосе прокруткиСкрыть меню при прокруткеУменьшить меню при прокруткеЛипкая навигацияНавигация на изображенияВыпадающее менюВыпадающий при кликеВыпадающее меню в навигацииВыпадающий список в боковой навигацииОтзывчивая навигация с выпадающимПодменю навигацияВсплывающее менюМега менюМобильное менюМеню занавесСвернуть боковой барСвернуть боковую панельПагинацияХлебные крошкиГруппа кнопокГруппа вертикальных кнопокЛипкий социальный барНавигация таблеткиОтзывчивый заголовок

Карточка расписания (Kanban):

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

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

Карточки Канбан разделяются по категориям состояния. Основные статусы — это “Выполнено”, “В работе” и “Завершено”, но в разных проектах статусы отличаются.

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

Выводы

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

  • Элементы минималистичного дизайна
  • Новые правила дизайна интерфейсов в Google
  • Как разработать систему для 100 миллионов пользователей: руководство для начинающих

Читайте нас в Telegram, VK и

Триггеры доверия

Гарантия возврата

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

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

Условия гарантийного обслуживания

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

Человек проще совершит дорогую покупку, потому что у него будет больше уверенности — если вдруг с покупкой что-то случится, он может бесплатно выяснить и, возможно, вернуть деньги

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

Подробное описание товара (преимущества товара)

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

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

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

Подумайте, что обычно важно для покупателей того или иного товара

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

Тень, свечение и градиент

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

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

Слева — карточка с жесткой рамкой, а справа — карточка с тенью вместо рамки

Как НЕ надо делать: лишняя информация в карточке товара

А теперь перечислим то, что стоит убрать на странице.

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

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

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

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

Как создать карточку

Шаг 1) добавить HTML:

Пример

<div class=»card»>  <img src=»img_avatar.png» alt=»Avatar»
style=»width:100%»>  <div class=»container»>   
<h4><b>HTML CSS</b></h4>     <p>Architect & Engineer</p>
  </div></div>

Шаг 2) добавить CSS:

Пример

.card {    /* Add shadows to create the «card» effect */    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);   
transition: 0.3s;}/* On mouse-over, add a deeper shadow */.card:hover {    box-shadow:
0 8px 16px 0 rgba(0,0,0,0.2);}/* Add some padding inside the card container */.container {   
padding: 2px 16px;}

С закругленными углами:

Пример

.card {    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);   
transition: 0.3s;    border-radius: 5px; /* 5px rounded corners */}/* Add rounded corners to the top left and the top right corner of the image */img {   
border-radius: 5px 5px 0 0;}

Совет: Перейдите в наш CSS Shadow Effects Учебник, чтобы узнать больше о тенях.

❮ Назад
Дальше ❯

Что стоит запомнить

Карточка товара — это страница со всеми его характеристиками, фото, видео, ценой и кнопкой «Купить».

Обязательные элементы карточки товара:

  • название, производитель и модель товара;
  • цена;
  • иллюстрации;
  • кнопка «Купить»;
  • дополнительные опции (цвет, размер);
  • описание и характеристики;
  • гарантии, доставка, преимущества магазина.

Первые четыре элемента — главные на странице. Больше всего места по правилам занимают иллюстрации, а самый яркий элемент — кнопка «Купить».

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

Оптимизируйте карточки товаров для поисковых систем. Для этого пропишите теги:

  • Title — это заголовок страницы, который отображается в результатах поиска, в названии вкладки и при репосте в соцсети.
  • H1 — название самой страницы, которое видно на сайте.
  • Description — текст-описание страницы до 160 знаков с ключевыми словами.

Разметьте карточку товара по HTML микро-разметке Schema, чтобы она красиво отображалась в поиске. По возможности добавьте ключевые слова в описание товара.

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

Как мы смотрим сайты

Эксперты в области юзабилити-тестировании проводили много опытов. Они использовали технологию eye-tracking. Это наблюдение за движением глаз пользователя, когда он смотрит сайты или работает с какой-то программой. На экране есть области, в которых глаз человека останавливается надолго, а есть слепые зоны, которые сознание пользователя не воспринимает.

Специалисты выделили две схемы: F- и Z-паттерны.

F-модель просмотра сайта

При такой схеме глаз человека заостряется не некоторых областях страницы. Они образуют контур буквы F.

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

Человек не вчитывается в текст при таком просмотре страницы. Но если мы расположим важные элементы — фото продукта, преимущества или информацию о скидке — с учетом F-паттерна, человек даже при беглом просмотре карточки продукта получит те сведения, которые мы хотим до него донести.

Z-модель просмотра сайта

Другой метод просмотра сайта — Z-паттерн

Точки, привлекающие внимание пользователя, располагаются в форме буквы Z

Зона 1 получает больше всего внимания человека, а зона 4 — меньше всего.

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

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

Почему важно располагать элементы в верном порядке

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

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

Карточка товара на сайте: необходимые элементы

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

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

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

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

Краткая информация о товаре

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

Располагать информацию лучше справа от фотографии товара:

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

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

Располагаем подобные кнопки рядом с краткой информацией.

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

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

Или поменять надпись на кнопке и добавить ссылку на корзину:

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

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

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

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

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

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

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

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

Или список похожих товаров:

Или блок с рекомендованными товарами:

Допускается показать все три вида подборок, но лучше выбрать одну-две, чтобы сильно не удлинять страницу.

И уже как элемент навигации внизу страницы стоит разместить блок с ранее просмотренными товарами: