Призывы к действию в интернет-магазине

На основе материала E-commercecalls to action: 10 best practice tips, источник – Econsultancy

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

Тестирование

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

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

Цвет

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

Слова на кнопке

Слова на кнопке призыва к действию должны однозначно указывать на результат действия. Чаще всего используются «Купить», «В корзину». Это – ожидаемые пользователями формулировки, и лучше не вводить их в заблуждение, называя кнопку как-то иначе. В самой корзине кнопка перехода к оформлению заказа обычно так и называется: «Оформить заказ». Однако некоторые интернет-магазины умудряются даже в двух словах «соригинальничать»:

Обратите внимание на «Process order». Перевести эту формулировку можно как «Обработать заказ», что запросто может заставить некоторых посетителей подумать дважды перед тем, как кликнуть по этой кнопке.

Размер кнопок призыва к действию

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

Расположение кнопки

Очевидно, что кнопка должна располагаться там, где посетитель ее заметит, где он ожидает ее увидеть. Типичные места расположения кнопки «В корзину» – сразу под ценой или справа от описания товара. Если страница товара имеет «разворот», то есть не умещается целиком на один экран, есть смысл добавить еще несколько кнопок «В корзину», чтобы вне зависимости от того, насколько глубоко пользователь «ушел» в страницу, он всегда имел возможность купить товар. Таким путем пошел Амазон, страницы товаров которого обычно достаточно длинны из-за множества комментариев и прочего связанного с продуктом контента. Другой вариант – «плавающая» кнопка, которая всегда остается в видимой области экрана.

Осмысленная пустота

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

Приоритет самых важных призывов

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

Безотлагательность действия

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

Модификация под различные устройства

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

Автор: Vyacheslav Vityuk

Подписаться на новости

Читайте также

27 ноября 2017 / Комментарии

Как Customer Experience изменил бизнес-процессы маркетплейса Goods

В результате нескольких месяцев проектирования «М.Видео» пришлось скорректировать бизнес-процессы под Customer Experience, другими словами, чтобы платформа стала удобнее для покупателя. Попробуем разобраться почему.

далее →

16 ноября 2017 / Комментарии

И еще 11 мифов юзабилити

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

далее →

19 октября 2017 / Комментарии

4 вопроса о поиске в интернет-магазине, ответы на которые меняют всё

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

далее →

12 июля 2017 / Комментарии

Пять объединяющих особенностей тысячи самых успешных посадочных страниц современности

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

далее →

25 мая 2017 / Комментарии

Когнитивные особенности проектирования интерфейсов

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

далее →

X
Нажмите «Нравится»,
чтобы читать Shopolog.ru в Facebook