(Вы читаете перевод ускоренного курса UX. Курс включает 30 вопросов, которые встречаются на старте карьеры: UX Crash Course: 30 Std Questions. Если вы здесь впервые, то лучше начните сначала).
На ссылки какого цвета чаще нажимают?
В одном из предыдущих уроков мы обсуждали огромный A/B-тест от Google, который они проводили в поиске идеального оттенка синего.
Мы также обсуждали, что у красных ссылок репутация победителей A/B-тестов.
И мне лично случалось повысить количество кликов на 400% просто сделав кнопку желтой вместо фиолетовой.
Так какой же цвет самый лучший?
Глупый ответ:
Кому-то нужно провести A/B-тест всех цветов, чтобы решить эту дилемму раз и навсегда. (Но, вообще-то, ничего это не решит … читайте дальше).
Настоящий ответ:
Не нужно рассматривать цвет ссылок как изолированный элемент вашего дизайна.
Огромное значение имеет цвет фона!
Цвета бренда вокруг ссылки — это фактор.
Цвет обычного, не кликабельного текста — это фактор.
Выглядит ли ссылка как ссылка? — вот настоящий вопрос, который вы должны задавать себе. В каждом проекте. Всегда. Начиная со вчерашнего дня.
Когда дело доходит до кнопок и ссылок, все, что вам нужно, — это контраст.
Цвет ссылок должен быть противоположен цвету фона, они должны вписываться в цвета бренда, но при этом выделяться, они должны заметно отличаться от основного текста — даже если они не внутри этого текста! Сравните ваше меню и ваши ссылки с параграфом обычного текста. Они радикально отличаются или выглядят почти одинаково?
Вот почему этот вопрос совсем не глупый:
Новички мыслят конкретными случаями.
Контраст — это вещь относительная. Он означает отличие. Но отличие в чем?
Если вы хотите, чтобы люди на что-то кликнули, нужно сделать это что-то выделяющимся из окружающего хлама.
т.е. — увеличить контраст.
Представьте, что вы идете на одну из тех “белых вечеринок”. Нет, не расистских, а тех, где все одеты в белое, и идет какой-то концерт.
Давайте представим, что вы придурок, которому хочется выделиться на камеру, снимающую с вертолета. Что бы вы одели? Думай, придурок, думай!
Красный бы подошел. Синий бы подошел. Даже черный бы подошел. Да, по сути, какой угодно, только не белый.
А если бы это была “желтая вечеринка”? Или “красная вечеринка”? Или “синяя вечеринка”?
Если бы толпа на такой вечеринке плохо соблюдала инструкции, и люди вырядились бы в разные цвета, вам было бы сложнее стать заметным.
Так же работают и ссылки с кнопками. Если вы делаете все элементы разноцветными, то ссылки и кнопки пропадут в океане визуального шума.
Эксперты мыслят системно.
Будучи новичком, вы можете смотреть на дизайн так: “красный сработал у них, сработает и у меня”. Но вы должны учитывать контекст, который сделал так, чтобы красный сработал.
Не нужно просто предполагать, что красный сработал. Соберите информацию! Как узнать, что красный у них сработал?
Новички думают о кнопках и ссылках как о чем-то конкретном: конкретный цвет, конкретная форма, может быть, конкретный стиль (как в случае с плоским дизайном).
Опытные дизайнеры рассматривают кнопки и ссылки как часть системы. Некоторые части существуют, чтобы поддерживать другие: стиль основывается на согласованности и брендинге, а не на деталях, вроде плоских иконок и скругленных углов. Конкретный выбор цветов, форм, стилей и нижнего белья не имеет значения, если они в комплексе не работают на нужный вам результат. Особенно нижнее белье. Оно должно вносить вклад!
Чтобы на ссылки чаще нажимали, измените то, что не является ссылками!
Новички упускают из виду, что одна фиолетовая кнопка — в меню, на белом фоне — это совсем не то же самое, что другая фиолетовая кнопка — на фиолетовом фоне, в боковом меню.
Даже если это одна и та же кнопка.
Прокрутите это несколько раз в своей голове.
Завтра мы приступим к нескольким глупым вопросам о юзабилити, а начнем с “Почему номер кредитки нужно вводить без пробелов?”