Примеры страниц продукта для оптимизированной конверсии: в комплекте с руководством
Опубликовано: 2022-03-01Представьте себе: поздняя ночь, и вы оказались в сети. Вы ищете идеальное решение проблемы, которая беспокоила вас всю неделю. Вы были здесь раньше. Сгорбившись, голову в руки, и сон стучится в твою дверь. Прежде чем вся надежда будет потеряна, Эврика! Наконец-то вы получаете многообещающий результат поиска. Затаив дыхание, щелкаешь и…
Ничего не произошло. Спустя вечность белый экран начинает отображаться со стенами текста и одним крошечным пиксельным изображением продукта. Воспоминания из эпохи коммутируемого доступа наполняют ваш разум. Вы сканируете страницу в поисках какого-нибудь средства, но обнаруживаете, что нет ни информации о цене, ни отзывов клиентов, а несколько телефонных номеров предлагают вам позвонить для получения дополнительной информации. Не работающая информация о ссылке, и их единственное социальное доказательство — это анимация кота, говорящего вам, что этот продукт «Пррррррррр!» Это до боли очевидно: вы наткнулись на кладбище веб-сайтов.
Не позволяйте этому кошмару стать вашим магазином! Наилучший пользовательский опыт обеспечивают веб-сайты, которые интересны и регулярно обновляются, а не сайты, которые заставляют пользователя задуматься, следует ли им запускать свое антивирусное программное обеспечение. Если вы только начинаете или хотите обновить свой интернет-магазин, мы здесь, чтобы помочь!
В этой статье мы рассмотрим минимальные критерии, которые должна иметь каждая страница продукта, а также некоторые варианты дизайна, которых следует избегать. Мы даже собрали коллекцию наших любимых страниц продуктов с кратким списком плюсов и минусов для каждого, чтобы вдохновить вас на следующий проект!
Создание идеальной страницы продукта
Цель вашей страницы продукта — продать ваш продукт! Но это также и понимание того, что ваши посетители ожидают от вашего веб-сайта. Среднестатистический житель США проводит в Интернете семь часов и 50 минут в день. Так много времени каждый день тратится на просмотр различных веб-сайтов, и люди, посещающие ваш сайт, будут относиться к своему опыту так же, как первоклассный сомелье критикует бутылку вина. Ваши посетители способны уловить нюансы между хорошим и плохим опытом.
Ваша страница продукта должна не только включать в себя основные принципы, которые ожидают ваши посетители, но и обеспечивать беспрепятственный пользовательский опыт, а также включать ваш собственный уникальный стиль, который заставит их вернуться.
Удовлетворение ожиданий ваших пользователей может быть похоже на ходьбу по канату, если вы не уверены, что они ищут. Вот почему мы составили руководство, в котором описаны лучшие и худшие методы разработки страницы вашего продукта, которые помогут вам взаимодействовать с пользователями и в конечном итоге повысить коэффициент конверсии.
Рекомендации по использованию страницы продукта
Чтобы создать блестящие страницы продуктов, нужно многое, поэтому мы создали список функций и концепций страниц продуктов, которые мы считаем наиболее важными для улучшения опыта ваших посетителей при правильном использовании.
- Чистый URL
- Захватывающее имя
- Прозрачная и предварительная информация о ценах
- Призыв к действию с высокой видимостью (CTA)
- Наличие товара
- Отдельные варианты продукта
- Четкие фотографии продуктов с несколькими углами камеры, ситуациями и моделями
- Возможность сравнивать похожие товары.
- Кнопка «Добавить в избранное/список желаний»
- Высококачественные, оптимизированные для Интернета изображения, видео и гифки
- Раздел часто задаваемых вопросов
- Функция масштабирования
- Дополненная реальность
- 360° обзор
- Яркие описания продуктов
- Функция живого чата
- Смесь продуктовых и лайфстайл-медиа для повествования
- Отзывчивый дизайн
- Соответствующий раздел «сопутствующие товары»
- Раздел «Допродажи»
- Возможность увеличить количество товара
- Руководство по размеру/подгонке (если применимо)
- Бесшовная навигация
- Интуитивно понятные параметры фильтра
- Залипающая кнопка «Вернуться к началу»
- Высокая доступность для пользователей с разными способностями
- Политика предварительной доставки и возврата
- Липкие кнопки «Добавить в корзину» или «Купить сейчас»
- Социальное доказательство
- Расширенная информация (материалы, технические характеристики, размеры, вес, особенности и т. д.).
- Нет избыточности
- Просторный и интересный шрифт
- Быстрое время загрузки
- Кроссбраузерность
- Подходит для темного режима
Одно слово предостережения - будьте осторожны с расползанием функций. Это когда на странице появляется так много ненужных функций, что это в конечном итоге вредит общему пользовательскому опыту. Возможно, функция дополненной реальности не поможет компании, которая продает зубочистки, но поможет компании, которая продает большую мебель. Обязательно найдите время, чтобы оценить, какие функции могут помочь лучше продемонстрировать ваш продукт, не добавляя на свою страницу все, что есть под солнцем.
Наихудшие практики на странице продукта
Когда вы начнете внедрять лучшие методы на своем сайте, вы должны помнить о некоторых из худших практик, перечисленных ниже. Серьезность этих концепций может варьироваться от введения пользователей в заблуждение использованием синего цвета шрифта гиперссылки для обычного текста до чего-то более злонамеренного, например, кражи нежелательных товаров в корзину покупок.
- Слишком много цветов
- Запутанная цена
- Непоследовательный дизайн
- Приманка и смена тактики
- Скрыть дополнительные сборы
- Слишком длинное/слишком короткое или скопированное описание
- Несовместимые названия продуктов
- Ложные гарантии
- Рекомендовать нерелевантные товары
- Скрытый призыв к действию
- Маленькие и некачественные изображения, видео, гифки
- Отрицательный разговор/социальное доказательство
- Повторяющиеся всплывающие окна
- Подтвердить
- Спрячьте товары в корзину
- Непонятная навигация
- Компактный шрифт
- Занятое негативное пространство
- Нет часто задаваемых вопросов
- Нет социального доказательства
25 лучших страниц товаров
Грув Жизнь
Что нам понравилось
- Очень информативное и простое решение для определения размера кольца.
- Большое социальное давление (лента Instagram, отзывы)
- Описание легко усваивается.
Что нам не понравилось
- Цена не ясна
- Можно использовать липкую кнопку «Купить сейчас» на рабочем столе.
- Не использует никаких методов допродажи

Йети
Что нам понравилось
- Аккуратная функция, где она покажет вам ближайшее место, где вы можете купить
- Уникальная типографика
- Последовательный брендинг
Что нам не понравилось
- Большой бесполезный пробел под фотогалереей
- Отвратительно большой липкий раздел «Купить сейчас»
- Не использовать видео или гифки

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

Палубный
Что нам понравилось
- Страница способствует чувству общности среди покупателей с большим социальным доказательством
- Много CTA
- Типографика соответствует голосу бренда с соответствующими значками
Что нам не понравилось
- Изображения продуктов могли бы быть лучше интегрированы в верхнюю часть сгиба.
- Большое пустое пространство рядом с часто задаваемыми вопросами
- Отсутствует какой-либо липкий заголовок, кнопка «Купить сейчас» или способ перейти наверх

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

шутка
Что нам понравилось
- Допродажи, допродажи и еще раз допродажи!!
- Отличное использование цветов
- Правильное использование GIF, а не неподвижных изображений
Что нам не понравилось
- Непоследовательная цена
- Раздел обзора уводит вас со страницы продукта и не содержит социальных доказательств.
- Скрытая политика гарантии/возврата/доставки, можно использовать ссылки для дальнейшего чтения

DBБренд
Что нам понравилось
- Отличные возможности настройки, которые отражены в изображениях продукта.
- Фантастическое повествование, рассказанное беззастенчиво резким голосом бренда.
- Анимация прокрутки с фотографиями в высоком разрешении удерживает внимание пользователя
Что нам не понравилось1200
- Очень ограниченные призывы к действию
- Никаких допродаж или перекрестных продаж, только одна наводящая на размышления продажа
- Нет липкого заголовка или липкой кнопки «Добавить в корзину»

Весси
Что нам понравилось
- Отличные анимации, особенно анимация взрывающейся обуви.
- Красивый липкий заголовок с кнопкой «Добавить в корзину»
- Фантастический раздел обзора, который вы можете расширить
Что нам не понравилось
- Лента Instagram могла быть интерактивной
- Изображения могли увеличиваться при наведении, а не при клике
- Липкий заголовок мог бы позволить вам изменить цвет

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

Скопа
Что нам понравилось
- Интерактивно-информационный раздел «Особые возможности»
- Создайте раздел upsell и cross-sell
- Отличный липкий заголовок с навигацией и кнопкой «Купить сейчас»
Что нам не понравилось
- Очень длинный раздел обзора
- Изображения продуктов могли бы быть более уникальными между вариантами
- Большие пустые боковые столбцы, которые можно было бы использовать для расширения истории бренда, чего нет на странице.

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

Лезерман
Что нам понравилось
- Отличные изображения продуктов
- Раздел «Инструменты», «Функции» и «Спецификации» интерактивный, интуитивно понятный и информационный.
- Взаимодействие сообщества с @leathermantools в их ленте в Instagram
Что нам не понравилось
- Раздел обзора большой, а раздел обзора основных моментов лишний.
- История не рассказана
- Ничего липкого (кроме чата)

СодаСтрим
Что нам понравилось
- Розничные партнеры выставки
- Описание товара представляет собой не просто абзац текста, а разбито на легко усваиваемые пункты.
- Раздел сравнения хорош
Что нам не понравилось
- Чрезмерное пустое пространство
- Нет привлекательности для пользователя (нет истории, нет выгоды)
- Неорганизованный / нет потока к нему

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

ХУРУ
Что нам понравилось
- Хорошее использование дополнительных продаж
- Хорошо объясните продукт с помощью информативных изображений и описаний
- Хорошая функциональность корзины, липкое добавление в корзину внизу позволяет добавлять в корзину, оставаясь на странице.
Что нам не понравилось
- Раздел обзора должен быть ниже, клиенты привыкли, что он ниже
- У CTA нет цвета, но есть крутая анимация.
- Раздел обзора можно было бы свернуть

JBL
Что нам понравилось
- Лучшая липкая касса, которую мы когда-либо видели
- Отличное использование фирменных цветов
- Отличный раздел сравнения
Что нам не понравилось
- Ползунок функций не очень хорош, несовместимый цвет, плохая кнопка «Далее»
- Кнопки на странице ведут на отдельную страницу
- Резервные опорные секции

Корсар
Что нам понравилось
- Липкие кнопки, но липкий заголовок исчезает при прокрутке вниз, чтобы обеспечить максимальное пространство для остальной части страницы продукта. Он снова появляется при прокрутке вверх
- Отличное использование видео по всей странице
- Анимация прокрутки с фотографиями высокого разрешения и призывами к действию удерживает внимание пользователя.
Что нам не понравилось
- Скучно над областью сгиба по сравнению с остальной частью страницы
- Нет дополнительных продаж или раздела перекрестных продаж
- Медленная навигация по фотогалерее

Угмонк
Что нам понравилось
- грамм
- Правильное использование GIF, а не неподвижных изображений
- Правильное использование допродаж и перекрестных продаж
- Правильное использование социального доказательства
Что нам не понравилось
- Изображения избыточны
- Обзор продукта мог бы быть лучше (переносит вас на дно без быстрого пути назад)
- Нет возможности купить продукт быстро или в любой точке страницы

Эшелон
Что нам понравилось
- Отличное чувство общности через Instagram
- Очень мало пустого пространства
- Липкий заголовок включает кнопку «Купить сейчас».
Что нам не понравилось
- Раздел Pitbull поляризуется
- Раздел членства мог бы использовать какой-то интерактивный раздел
- В Safari возникает проблема прокрутки, которая застревает при попытке прокрутить фотогалерею.

DJI
Что нам понравилось
- Отличные дополнительные продажи с привлекательной кнопкой «Купить сейчас» с интеграцией оценки доставки.
- Хороший раздел "в коробке"
- Отличное использование изображений для раздела «Присмотритесь повнимательнее»
Что нам не понравилось
- Нет раздела обзора с небольшим социальным доказательством
- В разделе «Что лучше для вас» должны быть ссылки на упомянутые продукты.
- Не так много истории на странице продукта

Пиво Д-р (20)
Что нам понравилось
- Сохраняет цветовую схему на всей странице, включая звездочки в разделе обзора. Каждая страница продукта имеет уникальную цветовую схему, основанную на художественном стиле.
- Хорошие кросс-продажи других продуктов
- Фантастическое социальное доказательство на всей странице
Что нам не понравилось
- Нет дополнительных продаж (можно продать мерч)
- Очень длинный раздел обзора
- Нет липкого заголовка или кнопки «Вернуться к началу»

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

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

Сюжетные устройства
Что нам понравилось
- Приятный дизайн страницы
- Тон копии расслабленный
- Красиво интегрированные видео и изображения
Что нам не понравилось
- Нет социального доказательства
- Не интерактивный, когда он мог бы быть и мог бы использовать больше анимаций
- Нет дополнительных продаж

Чертовски крутой
Что нам понравилось
- Варианты настройки отражены в изображениях продукта.
- Фантастическое повествование, рассказанное беззастенчиво резким голосом бренда.
- Отличное использование социального доказательства в Instagram
Что нам не понравилось
- Нет залипающей кнопки «Купить сейчас»
- Нет дополнительных продаж
- Огромный раздел обзора

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

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