Библиотека Интернет Индустрии I2R.ru

Цветовое решение является одной из наиболее интересных и важных проблем на пути создания сайта. Здесь огромную роль играет человеческое восприятие цвета. Удивительно, как много зависит от всего лишь одной вещи - цвета:

• восприятие сайта в целом;
• человеческое состояние (психологическое и физиологическое);
• читабельность информации;
• форма объектов;
• видимость мелких деталей.

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

При этом нужно учитывать следующие вещи:

• особенности фирменного стиля, на основании которого разработан сайт;
• физиологические и психологические особенности пользователей;
• Фирменный стиль;

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

Физиологические и психологические особенности пользователей

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

Помимо этого, сайт должен, прежде всего, нравиться пользователю, а значит ему должны нравиться и цвета, используемые в его оформлении.

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

Структура цвета

Цвета как объекта реального мира не существует в принципе. Цвет на самом деле не больше, чем осознание воспринятого глазом электромагнитного излучения видимого диапазона. Человек бессознательно ассоциирует некоторые предметы с определенными цветами.

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

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

При нормальных условиях освещения человек с нормальным зрением воспринимает длины волн от ~360 nm до ~800 nm. У него развита система цветного зрения, состоящая из трех групп: красного, синего и зеленого спектров. Вся цветовая гамма получается из трех цветов путем смешивания. Такая система используется и в компьютере. Рассмотрим теперь модели, используемые в компьютере при работе с цветом.

Цветовые модели, используемые в компьютере

Модель RGB

Аддитивный цвет получается благодаря восприятию нами излученного каким-либо источником света. Принцип формирования аддитивного цвета заключается в смешении световых лучей различных цветов. Для получения полной цветовой палитры в этой системе используют три цвета: красный, зеленый и синий. Их смешение дает другие цвета. Такая цветовая модель получила название RGB (от англ. Red, Green, Blue — Красный, Зеленый, Синий).

Модель CMYK

Субтрактивный цвет формируется в процессе вычитания тех или иных цветов спектра из светового луча. В этой системе вся цветовая палитра формируется тоже на базе смешения трех основных цветов. Однако основными цветами считаются голубой, пурпурный и желтый. Отсюда исходит и название данной цветовой модели — CMY (от англ. Cyan, Magenta, Yellow — голубой, пурпурный, желтый). Систему цветов, основанную не такой четырехцветной печати именуют CMYK (от англ. Сyan, Magenta, Yellow, blacK — голубой, пурпурный, желтый, черный). Система CMYK создана и используется для печати. Все файлы, предназначенные для вывода в типографии, должны быть конвертированы в CMYK. Этот процесс называется цветоделением.

Цветовые модели HSB и HLS

Несколько иной принцип построения цвета используется в цветовой модели HSB. Данная модель базируется на более интуитивном способе описания цвета через тон, насыщенность и яркость. Отсюда и название цветовой модели — HSB (англ. Hue, Lightness, Saturation — тон, освещенность, насыщенность).

Индексированный цвет

Так называется модель Index Color, основанная на принципе использования 8-битного цвета. Применяется, прежде всего, в Интернете. Все оттенки в файле делятся на 256 возможных вариантов, каждому из которых присваивается номер. Далее, на основе получившейся палитры цветов, строится таблица, где каждому номеру ячейки приписывается цветовой оттенок в значениях RGB.

К форматам файлов, использующим только индексированные палитры, относится GIF. Чрезвычайно широкое распространение индексированная палитра получила в Интернете по причине различного отображения цветов на разных типах компьютеров, мониторов и браузеров. Что тоже необходимо учитывать при создании сайта. Так как в противном случае получающийся результат далеко не всегда выглядит корректно. Во избежание подобных неувязок рекомендуется пользоваться так называемыми Safe Web Color Pallete — безопасными цветовыми палитрами для web. Это наборы цветов, которые одинаково отображаются в различных браузерах.

Цветовая модель Grayscale

Цветовая модель Grayscale представляет собой ту же индексированную палитру, где вместо цвета пикселям назначена одна из 256 градаций серого.

Практические советы по использованию цветов

И, наконец, подытожим все выше упомянутое в виде практических советов по подбору правильного цветового решения.

При поиске цветового решения важно помнить о следующих моментах:

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

Отдельным пунктом стоит выделить подбор цвета для текста. Текст обязательно должен быть читабельным, но необязательно черным. Просто достаточно, чтобы он был в контексте с другими цветами и не затмевался ими.

При использовании цветов, нужно быть очень осторожным. Не стоит брать слишком много цветов.

Хотя стоит заметить, что сочетание несовместимых цветов иногда приводит к поразительному эффекту!

Возможны следующие методы сочетания цветов:

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

Имеются в виду близлежащие цвета в цветовом круге. Это традиционное использование подбора цвета на глаз.

Метод использования противоположных цветов, контрастность

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

Метод использования природных сочетаний цветов

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

Метод использования цвета разной степени насыщенности

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

Резюме

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

Почитать еще по этой теме:

• "Зачем нужен фирменный стиль?",
• "История дизайнерского искусства",
• "Психологическая атмосфера сайта".

Внимание! Все статьи, размещенные в разделе публикации, являются собственностью компании Euroweb. Свободное использование материалов возможно только при согласии авторов и соблюдении их прав (см. «Закон РФ об авторском праве и смежных правах»).

Предыдущие статьи об истории дизайна в Библиотеке Сайтостроительства:

• Основы цвета. Иоханес Иттен
• Дизайн цвета для web-сайтов