Юзабіліті сайту. Червоні кнопки на сайті – це небезпека!

Юзабіліті сайту — це не тільки правильна структура сайту або конкретної сторінки, це ще й правильно підібрані кольори, шрифти, кнопки та інші елементи.

У цій статті я хочу розповісти про кілька ситуацій, де не спрацювали червоні кнопки чи елементи сайту. Точніше вони виглядали погано чи лякали людину, викликаючи відчуття небезпеки.

Давайте відразу зроблю застереження про червоний колір, як одного з основних на сайті — це цілком може бути, і навіть виглядає стильно. І ось вам, як приклади, пару симпатичних сайтів.

Красный цвет как один из основных на сайте
Красный сайт

Тепер, давайте подивимося, коли червоний використовується для кнопки або елемента на сайті.

Коли червоні кнопки на сайті лякають клієнтів?

Приклад 1.

На вже відомому вам сайті воріт компанії Каскад є кнопки. Вони чорні і зливаються з основними елементами сайту, оскільки основні кольори — це чорний і жовто-жовтогарячий. Я запропонувала, як А/В тест змінити колір кнопок. Ідею прийняли добре. Але керівництву здавалося, що червона кнопка чи червоний текст на чорній кнопці буде найкращим варіантом.

Коли ми зробили червону кнопку, то побачили, що вона виглядає занадто різко у поєднанні з основними кольорами сайту, і більше насторожує, ніж хочеться натиснути на неї.

А коли ми зробили шрифт червоного кольору на чорній кнопці, то зрозуміли, що він став не читабельний взагалі. Було незрозуміло, що написано. А це означає, що на неї ніхто не натисне.

Остаточним кольором у нашому виборі став зелений. І кількість заявок саме через цю форму зросла.

Красные кнопки на сайте КАСКАДЪ

Приклад 2.

Один мій знайомий час від часу просив мене замовити йому квитки на поїзд на сайті uzgov. А цього разу він вирішив купити їх самостійно. Якоїсь миті він мене покликав з криком про допомогу в голосі: «Олена, підійди будь ласка, вони знущаються з мене. Кожен квиток, який я вибираю, не доступний. Навіщо вони показують квитки, що вже куплені».

Красный цвет для выбранного элемента

Коли я підійшла і попросила мені показати, що він робить, то побачила, що при виборі місця воно спалахує яскраво-червоним кольором. Це означало, що він вибрав місце, а внизу висвічувалися дані для оплати (але їх було погано видно). А ось мій знайомий сприйняв цей червоний колір, ніби йому повідомляють про помилку і потрібно зупинитися. До того моменту в кошику вже було 4 квитки. Але він їх теж не бачив, бо кошик був у першому екрані монітора, а вибір квитка у другому. Він просто не бачив, що щось змінюється.

Я допомогла йому завершити купівлю квитків, а сама подумала, ось простий тест, який відповідає на запитання: «Чи потрібно використовувати червоний колір для обраного місця?». Ви можете сказати, що це сприйняття мого друга, а в інших такої реакції може не бути. І я погоджусь із вами.

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

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

Тепер ви знаєте, як провести простий тест на юзабіліті сайту і для цього вам не потрібні ні професійні програмісти, ні якісь компанії.

Нехай ваш сайт приводить багато покупців.