Правда и мифы о цвете кнопки “КУПИТЬ”

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

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

Даже если объединить зеленый и красный получится желтый – не оранжевый. Хотя цвет вольный, творческий и достаточно приятный, о чем и говорит нам социальная сеть Одноклассники откровенно “крича” на всю Европу своим игривым интерфейсом оранжевого цвета. На день сегодняшний суждение, оранжевого цвета как самого эффективного лишь банальное предположение. Подождем.

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

Но это, достаточно субъективно. Понимание ассоциации красного и зеленого у пользователей ресурсов самое разнообразное, а какое именно поможет определить Альфа/Бета тест. Проанализировал некоторые результаты сторонних исследований.

Эксперемент первый.
Один из проектов компании Dmix подвергнувшийся тестированию показал, что кнопка красного цвета более конверсионна – на 42% выше, чем кнопка зеленого цвета. Интересно, почему?

buy_button_1
Эксперемент второй.

Предприятие Spothub, таким же образом стестировала цвета кнопок. В тесте было задействовано более 2 500 юзеров самых разных категорий. Снова, красная кнопка запрета была первой. Ее конверсия составила на 23% больше зеленой.

buy_button_2
Эсперемент третий.
Наконец, крупнейший интернет-магазин мобильных девайсов решил все таки доказать, принадлежность красного цвета к эффективным интернет-цветам. В добавок, была интегрирована белая кнопка. В результате на первом месте, тот же красный, оранжевый. Конверсия на 7% выше иных вариантов.

buy_button_3
Эксперемент четвертый.

Что же мы видим, красная кнопка универсальна? Возможно дело в несоответствии цветов на подсознательном уровне? Попробуем заменить зеленый, к примеру на синий. Фирма Motat тестировала кнопку “Добавить в Корзину” в синем и оранжевом проявлении и что вы думаете? Именно синяя кнопка показала больший процент конверсии – 11%. Так почему же всесильный красный остался позади?

buy_button_4

Следующий пример, проясняет ситуацию. Корпорация RPT, во время тестов кнопки “Купить” определяла лучший цвет. Взгляните на первоначальную вариацию карточки товара.

buy_button_5
Оптимизированный вариант с иным оформлением кнопки и текста.

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

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

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

Что же имеет ключевые значения при конверсии?
RPT снова провела тестирование. Маркетологи заменили красную кнопку на желтую. И что вы думаете? Конверсия возросла на 7,2%.

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

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

buy_button_8

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

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

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

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s