Нет ничего важнее правильного подбора цветов для оживления веб-страницы
И ничего хуже неправильных цветов, которые наносят ущерб вашему контенту
Знаете ли вы о том, что первое впечатление о вашем сайте формируется у посетителя
в течение первых девяти секунд посещения? Очень важно удостовериться, что цветовая
схема дизайна сайта находится в соответствии с контентом и целевой аудиторией
проекта. Вы должны стремиться к тому, чтобы цветовая схема усиливала выразительность
сайта, при этом не отвлекая и не вводя в заблуждение ваших пользователей.
Цветовая гамма страницы дает возможность выделить такие наиболее важные части
страницы как навигационные элементы, содержательные блоки, акценты, взаимосвязи
и т.д. По этой причине, цвет - крайне важный элемент дизайна web-сайта.
Для большинства людей цвет играет роль подключения их внимания к объекту, или
же наоборот - отключения внимания от оного. Посетители вашего сайта, знают ли
они это или нет, реагируют на цвета и другие визуальные элементы на вашем сайте
на бессознательном уровне. Заинтригованный (и не сбитый с толку) посетитель сайта,
вероятнее всего, вовлекается в цели вашего сайта - то ли здесь можно найти информацию,
то ли развлечься, или же здесь продаются товары или услуги.
Можно перейти к некоторым из наиболее очевидных способов удостовериться, что
цветовая гамма находится в гармонии с содержанием сайта:
Цвета выражают настроение и индивидуальность вашего сайта
Цвета выражают назначение вашего сайта, его цели, и индивидуальность (также
как и той компании, которую он представляет). Чтобы проиллюстрировать это, рассмотрим
два варианта интерфейса сайтов розничной торговли:
Gap Online - пример тщательного
подбора цветовой гаммы. Сайт использует монохроматичную сине-серую палитру, которая
является очень эффективной для выделения представляемой одежды и моделей. Цвета
мягкие, ненасыщенные - и весь проект Gap смотрится и воспринимается легко и ненавязчиво.
Оценка: 5
В то время как BigSmart
переполнен насыщенными, яркими, контрастными цветовыми комбинациями. Вся эта красочная
мишура отвлекает внимание от той информации, которую она призвана донести. Все
изображения одежды просто теряются в общем визуальном шуме. Оценка: 2-
Цвета устанавливают идентичность
Цвета сайта и логотип компании должны дополнять друг друга и существовать в
одной палитре... Дизайн сайта должен быть спроектирован относительно лого так,
чтобы логотип не торчал как воспаленный большой палец. Хорошим примером вышесказанного
послужит цветовая гармония между сайтом Beck
Interactive и их логотипом . Это тем более важно, что в 99% случаев логотип
уже содержит специфические фирменные цвета той или иной организации.
Цветная палитра должна соответствовать содержанию сайта
Содержание и цвет на сайте должны гармонично дополнять друг друга. Давайте
вернемся к Gap Online еще раз:
цвета, выбранные для дизайна не отвлекают от процесса получения информации, и
это также создает дружественную привлекающую среду.
Цвета в контексте нашей эмоциональной и культурной действительности
Web-cайты, которые разрабатываются для глобальной аудитории, должны выбирать
цвета для дизайна, основываясь на понимании их культурного и эмоционального значения.
Web-дизайнер должен серьезно отнестись к анализу символики цвета. Например, красный
- цвет огня, пожара и крови и не ассоциируется со спокойствием или миром. Зеленая
шляпа в Китае сигнализирует, что жена человека обманывает его, но во многих других
регионах (например, в Индии), зеленый цвет ассоциируется с деньгами, процветанием
и благополучием. Так что является целесообразным осведомляться о цветовом и культурном
назначении дизайна.
Цвет для групп населения
Цвета должны подбираться в зависимости от аудитории или целевой группы сайта...
"The Meaning of Color"
от Natalia Khouw обращает внимание на некоторые интересные факты, полученные из
академических исследований о восприятии цвета различными группами населения, такие
как:
- Мужчины предпочитают синий цвет красному, в то время как женщины наоборот
- красный синему.
- Другой пример - мужчины предпочитают оранжевый желтому, тогда как женщины
предпочитают желтый оранжевому.
Так, знающие дизайнеры используют при разработке дизайна сайта для молодой
аудитории более яркие цвета, тогда как для старших/взрослых должны использоваться
более умеренные, спокойные и сдержанные цвета.
Сочетания различных цветов
Отдельный цвет сам по себе может быть слишком кричащим или слишком бледным
- однако он может быть хорошо обыгран в сочетании с другими цветами. Сочетание
черного и серого достаточно тоскливо, но попробуйте добавить к ним оранжевый и
БА-БАХ! - получилась славная комбинация. (Совет: На самом деле черный и серый
с ЛЮБЫМ другим единым цветом - динамит.)
Посетите http://www.clevelandbrowns.com
и http://www.hi-shock.com/dshock/Flash/dsflash.html
два хороших примера этой концепции.
Цвета и их естественные ассоциации
Если Вы разрабатываете сайт для бани или водного спорта, лучше использовать
голубые цвета и цвета морской волны. Если Вы делаете садоводческий сайт, пробуйте
оттенки зеленые и цвета земли. Если Вы делаете обычный информационный портал,
типа поискового сервера, используете простую, очень ограниченную цветовую палитру,
которая не имеет никакого специфического значения.
Некоторые общеизвестные цветовые значения/ассоциации:
- Красный !!! ассоциируется
с кровью, и с чувствами, которые являются энергичными, волнения, страсти или эротика.
Большинство цветов несет, и положительные и отрицательные значения. Обратная сторона
красного вызывает агрессивные чувства, вызывая гнев или насилие.
- Оранжевый !!! - цвет
тела, или же дружественной теплоты огня очага. Положительные значения этого цвета
предлагают доступность, непринужденность. Отрицательная сторона могла бы подразумевать
чрезмерную доступность - вашим предложением начинает пользоваться каждый первый,
что приводит к отсутствию избирательности и качества.
- Желтый !!! - цвет радости,
солнечного света. Этот цвет оптимистический, приподнятый, современный. Энергия
желтого может стать подавляющей. Поэтому желтый - не тот цвет, который имеет тенденцию
доминировать над модой в течение длительных периодов времени.
- Зеленый !!! В его положительном
значении зеленый предполагает натуральные, природные состояния (растительный мир,
леса), жизнь, стабильность, спокойствие, естественность. С другой стороны, зеленый
в некоторых своих оттенках или в некотором нетрадиционном контексте (типа зеленой
кожи) может вместо этого ассоциироваться с распадом (грибок, плесень), токсичностью,
искуственностью.
- Синий !!! предлагает
прохладу, отдаленность, духовность, или, возможно, сдержанную элегантность. Некоторые
оттенки синего приятны едва ли не каждому. В его отрицательном значении, мы можем
думать о "блюзе" - что может подразумевать печаль, пассивность, отчуждение, или
депрессию.
- Фиолетовый !!! - цвет
фантазии, игривости, импульсивности, и мечтательного состояния. В его отрицательном
качестве он может ассоциироваться с кошмарами или безумием.
Белый цвет
Используйте белый цвет. Используйте пространство. Пожалуйста!
Белый в своей несущественности работает как замечательное равновесие между
цветами. Если ваш сайт содержит богатый контент (интересные тексты), делайте ваши
веб-страницы как можно более простыми для визуального восприятия, оставляйте большое
количество незаполненного пространства, или освобождайте пространство между отдельными
элементами страницы.
Чем меньше - тем больше
Ограничивайте вашу цветовую палитру двумя или тремя главными цветами (полутоновыми
вариациями) и небольшими акцентами в некоторых местах. Ограниченные цвета в вебе
вообще и и цветовой палитры вашей графики в частности означают меньшие размеры
файла, более быструю загрузку и, что наиболее важно, более читаемый и привлекательный
сайт... который в конечном итоге приводит к большему успеху в бизнесе. Такие сайты,
как WWW. Apple.com, WWW.
EddieBauer.com использовали ограниченное цветовое пространство и все же выглядят
отчетливыми; даже CoolHomepages
главным образом использует 2 цвета, оранжевый и синий.
И последнее, но не наименее ценное... Сплетайте вашу сеть из красного, черного
и белого. В отношении WEB белый - самый яркий цвет, черный по отношению к нему
- наиболее контрастный, и красный обеспечивает акцент и отлично сочетается с обоими.
Если вы посещали такие проекты, как www.oli.org,
www.sprint.com, www.oracle.com,
www.coke.com, www.honda.com,
www.the-rev.com, вы конечно
согласитесь со мной:)