Найти в Дзене
Школа дизайна artTech

Цвет в веб-дизайне: как вызвать у пользователя нужные эмоции

Поведением и реакцией человека можно управлять, даже если сам человек не осознает этого влияния. С помощью цвета вы можете заставить человека радоваться или грустить, вызовете чувство голода или страха, поможете чувствовать себя в безопасности. Веб-дизайнеры умело используют разные инструменты влияния, один из них — цвет. Читайте статью, чтобы научиться вызывать у пользователей нужные эмоции. Учащает сердцебиение, вызывает страсть. Ассоциируется с очень разными чувствами: любовь, опасность, страх или восхищение огнем. Подойдет для сайтов, которые предупреждают об опасности, например, антивирусы. Красные элементы для привлечения внимания можно использовать также для: Не стоит использовать красный цвет на медицинских сайтов, потому что в этой теме он может вызвать тревогу. Ассоциируется со стабильностью, покоем. Напоминает о море или небе. Синий цвет стоит использовать для сайтов: Синий цвет не подойдет для сайта ресторана. Он успокоит и подавит чувство голода, из-за чего посетитель може
Оглавление

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

Красный

Учащает сердцебиение, вызывает страсть. Ассоциируется с очень разными чувствами: любовь, опасность, страх или восхищение огнем.

Подойдет для сайтов, которые предупреждают об опасности, например, антивирусы.

Красные элементы для привлечения внимания можно использовать также для:

  • кафе и ресторанов — усиливает чувство голода;
  • сайтов знакомств — ассоциируется с романтикой, любовью, страстью;
  • магазина одежды — делает акцент на новинках, акциях и скидках.
Сайт и приложение популярного сервиса знакомств Tinder использует красный цвет в лого. кнопках и других важных элементах
Сайт и приложение популярного сервиса знакомств Tinder использует красный цвет в лого. кнопках и других важных элементах

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

Синий

Ассоциируется со стабильностью, покоем. Напоминает о море или небе.

Синий цвет стоит использовать для сайтов:

  • банков и финансовых организаций — вызывает доверие, успокаивает;
  • автомобилей — гарантирует надежность;
  • средств гигиены — напоминает о чистоте и свежести.
Газпромбанк применяет разные оттенки синего в сочетании с оранжевым
Газпромбанк применяет разные оттенки синего в сочетании с оранжевым

Синий цвет не подойдет для сайта ресторана. Он успокоит и подавит чувство голода, из-за чего посетитель может отказаться от идеи заказать что-то вкусное.

Желтый

Яркий, сочный, энергичный цвет. Ассоциируется с летом и солнцем.

Желтый цвет рекомендуется использовать на сайтах:

  • фастфуда — вызывает аппетит и напоминает о скорости жизни и готовки;
  • товаров для детей — ассоциируется с весельем и играми;
  • сельского хозяйства — напоминает о пшенице, солнце, говорит о хорошей урожайности.
Желтый — основной цвет Яндекса, который ассоциируется сегодня со скоростью, молодостью, активностью и развитием
Желтый — основной цвет Яндекса, который ассоциируется сегодня со скоростью, молодостью, активностью и развитием

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

Зеленый

Ассоциируется с природой, надежностью,. Также напоминает о деньгах.

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

ВкусВилл — сеть магазинов здорового питания. И зеленый цвет для компании подходит как нельзя лучше
ВкусВилл — сеть магазинов здорового питания. И зеленый цвет для компании подходит как нельзя лучше

Этот цвет подойдет для сайтов:

  • банков — гарантирует стабильность и надежность;
  • бытовой химии или средств гигиены — напоминает о природе, ассоциируется с натуральным происхождением, заботой об экологии;
  • супермаркетов — ассоциируется со свежестью продуктов.

Белый

Создает ощущение простора и свободы. Напоминает о свежести и легкости.

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

Компания Dove для своей веб-страницы выбрала сочетание белого, синего и золотого
Компания Dove для своей веб-страницы выбрала сочетание белого, синего и золотого

Много белого цвета используют на сайтах:

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

Черный

Весьма противоречивый цвет. Может ассоциироваться как с роскошью, так и вызывать тревогу, напоминать о трауре.

Техника Apple ассоциируется с технологичностью и роскошью, что подчеркивает черный цвет на сайте
Техника Apple ассоциируется с технологичностью и роскошью, что подчеркивает черный цвет на сайте

Стоит использовать в дизайне сайтов:

  • премиум-брендов — напоминает о роскоши и элегантности;
  • техники — привлекает лаконичностью и сдержанностью;
  • спортивных товаров — говорит о минималистичности дизайна и скорости.

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

  1. Чтобы текст легко читался, используйте контрастные цвета: белый и черный, желтый и синий. При подборе ориентируйтесь на цветовой круг Иттена.
  2. Используйте в оформлении максимум три цвета. Иначе разные оттенки и эмоции смешаются, и пользователь просто не поймет, что ему нужно делать на сайте.
  3. Используйте интенсивные цвета, чтобы привлечь внимание. Заголовки, кнопки, призыв к действию — всё это должно выделяться. Посетитель вряд ли запомнит всё, что вы разместите на сайте, но самое главное должно остаться в памяти.