Сочетание цветов в веб-дизайне как эффективный инструмент маркетинга. Сочетание цветов в веб-дизайне

Цвета и их значения

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

Красный Оранжевый Желтый


Зеленый Синий Пурпурный


Черный Серый Коричневый


Бежевый Кремовый Белый

Варианты и примеры использования

Один цвет в разных вариантах дизайна можно использовать как фоновым, так и для выделения важных элементов. Примеры:


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


А для этого сайта голубой цвет выбран в качестве основного и важные продающие элементы выделяются именно с помощью него.


Здесь красный цвет используется в качестве фонового.


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

Выбор цвета для сайта

  1. 1. Выбирать цвета для сайта нужно не наобум, а руководствуясь будущими целями сайта. Первое, с чего нужно начать выбор - узнать, не сделали ли его до вас). У многих коммерческих (и чуть реже некоммерческих) сайтов очень часто есть жесткая привязка к существующему логотипу, узнаваемым цветам и элементам предыдущей версии сайта, или попросту выработан фирменный стиль.
  1. 2. Если сайт в дальнейшем планируется продвигать в поиске или контекстной рекламе, то лучше просмотреть Топ 20, или Топ 30 (включая рекламные площадки) сайтов конкурентов. Нужно это для того чтобы найти цвета, оттенки и их сочетания которые реже используются в вашей тематике. Сайт должен запоминаться как самим дизайном, так и его уникальными цветовыми решениями, а не быть похожим на сайты конкурентов.
  1. 3. Далее следует выбрать основные цвета:
  • подложки сайта (чаще всего берутся нейтральные цвета);
  • основных элементов сайта (выбор зависит от задач);
  • для выделения продающих и важных моментов (обычно используют яркие оттенки тёплых).

Подбирать цвета нужно руководствуясь правилами сочетания цветов. Начинающим дизайнерам советую использовать аналогичные (близкие по палитре) цвета или методы триад и квадратов по палитре цветового круга.


Аналогичные. Этот метод основан на использовании двух – трех близких по палитре цветов и всего многообразия их оттенков. Триады и квадраты. Равносторонний треугольник или квадрат на цветовом круге подскажут правильное сочетание цветов, упростив выбор дизайнера.

  1. 4. Ну и после этого очень важно согласовать выбранные цвета с маркетологом и владельцем сайта). И можно приступать непосредственно к работе над дизайн-макетом будущего сайта.

И помните! Даже самое небольшое изменение одного цветового оттенка может вызвать абсолютное другое восприятие у пользователей. В практике нашей студии был случай, когда изменение основного цвета сайта дало увеличение конверсии и KPI почти в 2 раза.

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

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

К цветовой гамме сайта предъявляются довольно серьезные требования, так как сочетание цветов для веб-дизайна не только определяет внешний вид вашего ресурса, но и будет ассоциироваться с вашим брендом в интернете. Большинство сайтов имеет палитру от 2 до 4 цветов, не считая черного и белого. Давайте попробуем разобраться, как создать наиболее привлекательное и эффективное сочетание цветов в дизайне сайта.

Выбираем основной цвет

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

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

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

Самыми безопасными цветами являются фиолетовый и синий. Фиолетовый везде, кроме Таиланда, считается цветом богатства, власти и высокого социального статуса (в Таиланде он является символом скорби). Синий ассоциируется с оптимизмом, уверенностью, счастьем. Правда, в Японии он означает злодеяние, а в Индии - грусть.

Виды цветовых контрастов

В статье я обещал вам подробнее рассказать о цветовых контрастах. Знание и применение основных принципов контраста может стать эффективным инструментом в вашем арсенале веб-дизайнера.

Если вы только начинаете знакомство с инструментарием веб-дизайна, советую обратиться к комплексным видеокурсам, включающим специальные уроки по колористике.

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

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

В своей книге «Искусство цвета» известный швейцарский художник и «цветовед» Иттен Иоханнес описывает семь видов контрастных противопоставлений. В сегодняшней статье мы не будем рассматривать все контрастные схемы, остановимся подробнее на трех из них:

Контраст по тону. Этот вид противопоставления нужно применять осторожно, желательно, в сочетании с другими видами контраста, и только тогда, когда это обоснованно. Наиболее выраженным контрастом в веб-дизайне считается сочетание трех цветов: красного, желтого и синего. Чем дальше сочетаемые цвета стоят в цветовом круге от этих трех, тем слабее контраст по тону.

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

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

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

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

Курс на минимализм

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

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

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

Цвет как средство навигации

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

Давайте подведем итоги. Цвет и умение сочетать цвета в web-дизайне - это важнейший инструмент веб-дизайнера. Если его грамотно использовать и не забывать о юзабилити сайта, то можно выгодно выделить контент, мягко и ненавязчиво «направив» посетителя на совершение определенных действий.

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

Надеюсь, данный материал оказался для вас полезен. Подписывайтесь на обновления нашего блога, чтобы не пропустить все самое интересное. Пока!

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

Однако многие дизайнеры, работая над подбором цветовых сочетаний, часто забывают о том, что не все люди воспринимают цвета одинаково. Существует небольшое количество людей, которые не различают какой-либо цвет, поэтому, работая над дизайном сайта, нужно помнить о пользователях-дальтониках. Ведь порой очень красиво оформленный сайт может просто не работать для этой категории пользователей, так как они не смогут на нем ориентироваться. И это действительно проблема: среди мужчин процент дальтоников может достигать 8%, а среди женщин – примерно 1%. Так что лучше не рисковать потерей 9% аудитории и подобрать цветовую гамму сайта так, чтобы он нормально воспринимался всеми людьми, в том числе и дальтониками.

ТЕОРИЯ ЦВЕТА МОЖЕТ УЛУЧШИТЬ ДОСТУПНОСТЬ САЙТА

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

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

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

КАК СОЗДАТЬ САЙТ С ВЫСОКИМ ПОКАЗАТЕЛЕМ ДОСТУПНОСТИ

Конечно, создать сайт, который будет удобным абсолютно для всех категорий пользователей – невыполнимая задача. И в первую очередь потому, что трудно определить, как именно дальтоники видят тот или иной цвет. Но это еще не все: люди, дальтониками не являющиеся, также видят цвета немного по-разному. Было проведено множество исследований, целью которых было выяснить, как именно различаются цвета людьми с разными типами дальтонизма. Но каких-то точных результатов эти исследования не дали, так что вопрос, как именно видит дальтоник, все еще является открытым.

Начиная работу над дизайном сайта, нужно сразу же позаботиться о цветовой различимости элементов навигации и контента. Есть много способов это сделать и самый первый – использовать контрастные цвета для фона и важных элементов дизайна. К примеру, использование черного текста на белом фоне позволит сделать контент доступным для всех пользователей. Но черный и белый – это далеко не все «безопасные» цвета – их гораздо больше. Просто нужно сделать так, чтобы ссылки, кнопки и другие элементы дизайна были заметными и выделялись на фоне.

КАКИЕ ЦВЕТА НУЖНО ИСПОЛЬЗОВАТЬ?

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


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

  • коричневый/зеленый
  • зеленый/синий
  • фиолетовый/синий
  • серый/синий
  • зеленый/серый
  • черный/зеленый
  • желтый/светло зеленый

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

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

КОМПЛИМЕНТАРНЫЕ ОТТЕНКИ

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


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

МОНОХРОМНЫЕ ПАЛИТРЫ

Работая над доступной цветовой гаммой, нужно все время следить, чтобы рядом не использовались элементы из неудачных цветовых пар. А чтобы создать наверняка дружественную по отношению к дальтоникам страницу, лучше всего использовать монохромную палитру. Неважно, как пользователь будет воспринимать цвет – он будет ориентироваться лишь на контраст. К тому же, монохром сегодня в моде, такие палитры сегодня очень часто используют на сайтах с минималистским дизайном.


ИНСТРУМЕНТЫ ДЛЯ ПОДБОРА ЦВЕТОВЫХ ПАЛИТР

Vischeck – это симулятор, с помощью которого можно протестировать веб-страницы на доступность для дальтоников. С помощью этого инструмента можно узнать, как люди с разными типами цветовой слепоты видят конкретный сайт и, если потребуется, быстро внести изменения в дизайн.

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

Еще один инструмент для онлайн-проверки сайтов на доступность для дальтоников. Можно проверить, как палитра, составленная из 216 цветов, воспринимается людьми с разными типами цветовой слепоты.

ВЫВОД

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

Люди всё ещё спорят, является ли содержание главным. Если вы спросите меня, то я полностью соглашусь с ними, и моё мнение основано на моем собственном опыте. Несмотря на то, является оно доминирующим или нет, есть нечто, что не менее важно! Что это, спросите вы? Знаю, все любят говорить: «Не судите о книге по её обложке». Но как еще вы планируете привлечь внимание кого-либо , как не оригинальной обложкой? Очевидно, когда вы привлекли чье-то внимание, остальные усилия вы можете потратить на содержание. Речь будет идти о цветах веб-дизайна, и как управлять ими.

Первое впечатление вы производите лишь однажды


Всегда существует одно конкретное действие, которое вы хотите заставить сделать посетителя вашего сайта. Это действие, на которое вы делаете самый большой акцент. Это может быть кнопка подписки, кнопка «далее», или кнопка «купить».

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

В этой статье вы узнаете о 5 самых популярных цветах, которые заставят ваш сайт заинтересовать и заинтриговать посетителей.

«Pinterest» использует множество красных оттенков


Без сомнения красный считается самым горячим цветом. Если Вы посмотрите на цветовую палитру «Pinterest», вы сразу обратите внимание, что красный является их основным цветом.

Красный часто ассоциируется с любовью. Это сильный и динамичный цвет, который может заставить вас ощущать влюблённость во что либо, что находится рядом с этим цветом.

Этот цвет часто встречается в оформлении акций, так как его интенсивность создает ощущение срочности.

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

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

Практический пример использования красного цвета:


Человеческий глаз видит красный цвет, когда он смотрит на свет с длиной волны между 630 и 700 нанометров. Свет выше этого диапазона называется инфракрасным, и не воспринимается человеческим глазом, но он может быть идентифицирован как тепло. - Wikipedia

Более широкое использование палитры красного цвета (по jimjim421):

10 ассоциаций с красным цветом:

  • кровь
  • война
  • пожар
  • мужественность
  • страсть
  • обольщение
  • принуждение
  • энергия
  • храбрость

«Amazon » любит насыщенный оранжевый:


Оранжевый — теплый и ​​активный цвет, но не настолько интенсивный, как красный. Оранжевый цвет — скорее теплый, чем горячий.

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

Практический пример использования оранжевого цвета:


Более широкое использование оранжевой палитры по manekineko :

10 ассоциаций с оранжевым:

  • оптимизм
  • определение
  • пожар
  • предупреждение
  • осень
  • религия
  • выносливость
  • сострадание
  • Хэллоуин
  • организм

Синий цвет facebook создает ощущение безопасности:


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

Практический пример использования синего цвета:


Могу поспорить, что вы не знали:

Опрос, который был проведён в Германии и опубликован в 2009 году доказал, что синий — любимый цвет 46 процентов опрошенных мужчин и 44 процентов женщин. — Wikipedia

Более широкое использование синей цветовой палитры по entitydesigns :

10 ассоциаций с синим:

  • правдивость
  • дружелюбие
  • магия
  • парни
  • безвозмездность
  • полиция

Сила зеленого цвета на


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

Все, кто каким-то образом связан экологией, имеет больше возможностей использовать зеленый цвет в создании своих сайтов. Обратите внимание на 100-долларовую банкноту. Здесь преобладает зеленый цвет! Такие сайты, как Groupon, также имеют достаточно зеленого цвета в своём бренде, так как они непосредственно имеют дело с деньгами. Зеленый цвет очень освежает и расслабляет, оставляя у людей чувство сбалансированности и вдохновения. Он представляет собой баланс и гармонию в дизайне.

Практический пример использования зеленого цвета:


Могу поспорить, что вы не знали:

В некоторых языках, в том числе старокитайском, тайском, старояпонском, и вьетнамском, одно и то же слово может одновременно означать и синий, и зеленый цвет. Не существует природных источников для зеленых пищевых красителей, которые были бы одобрены организацией контроля за продуктами и лекарствами США. - Wikipedia

Более широкое использование зеленого цвета по Skybluue2u :

10 ассоциаций с зеленым:

  • деньги
  • жадность
  • зависть
  • природа
  • весна
  • здоровье
  • молодость
  • трава
  • надежда

Yahoo! и фиолетовый цвет на их логотипе


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

Практический пример использования фиолетового цвета:


Могу поспорить, что вы не знали:

В апреле 2007 года учёные предположили,что ранние археи, возможно, использовали фиолетовый пигмент по принципу хлорофилла, для того, что бы поглощать энергию солнца. Если бы это действительно было так, то огромные площади океанов и береговых линий были бы фиолетового цвета. Эта теория называется «фиолетовой гипотезой Земли». — Wikipedia

Более широкое использование фиолетового цвета по

10 ассоциаций с фиолетовым

  • богатство
  • щедрость
  • благородство
  • утонченность
  • романтика
  • искусство
  • экзотика
  • духовность
  • роскошь
  • женственность

1WD разумно используют монохромные цвета


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

Практический пример использования монохромного цвета:


Могу поспорить, что вы не знали:

Цифровая монохромная фотография охватывает только оттенки черного, которые воспринимает датчик фотокамеры. При пост-обработке цветных изображений можно преобразовать воспринимаемую яркость путем объединения показателей нескольких каналов. - Wikipedia

Более широкое использование монохромной палитры по munsteri

10 ассоциаций с монохромными цветами

  • власть
  • элегантность
  • пространство
  • мягкость
  • невиновность
  • пессимизм
  • депрессия
  • скука

А какой Ваш любимый цвет? И какие ощущения и эмоции он у Вас вызывает?

Перевод — Дежурка

То задача подобрать нужные цвета, обеспечивая удачное их сочетание должна быть у вас на переднем плане для любого принимаемого решения. Зеленый цвет – это смесь синего и желтого. Расположенный в середине спектра (т.е. нейтральный), он всегда был известен своим успокаивающим действием на наше подсознание. Вот почему различные оттенки зеленого нашли свое применение в спецодежде мед. работников или в интерьере медицинских учреждений. В странах с жарким климатом он считается сильным цветом. В религии его считают «райским», это цвет знамени пророка и мантии патриарха.

Исторически зеленый цвет всегда был символом весны, роста, плодородия, свободы… Можно сказать, что это наиболее знаковый цвет от самой природы.

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

Но как добиться цветовой гармонии? Прежде всего, стоит подбор цветов делать в соответствии с каким-либо их объединяющим принципом. Для усиления разнообразия не обязательно задействовать еще один основной цвет, можно вполне успешно использовать:

  • разную текстуру для объектов композиции
  • нейтральные цвета () для отдельных элементов

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

Вот всего несколько способов, которые могут заставить зеленый цвет работать на вас.

Скрытые значения цветов: оттенки зеленого


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

Зеленый – это наиболее удачный цвет для «bio», «eco» и подобных тематик, подразумевающих экологическую дружественность.


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

Зеленоватый оттенок применить можно тонко и неуловимо, при этом получив значительный эффект.

Еще примеры известных «ЗЕЛЕНЫХ» сайтов


Сочетание цветов в дизайне сайта - зеленый и желтый

Полностью зеленый сайт, построенный на основе монохроматической цветовой схемы, с его собственным «семейством тонов» вряд ли будет привлекателен для взгляда пользователя. Нужно подобрать правильное цвето-сочетание.

Сайт компании Energy Helpline предоставляет клиентам широкие возможности для поиска предприятий, поставщиков по экологически значимым критериям.


Дизайнеры использовали зеленый, желтый и синий. Зеленого цвета логотип, зеленоватые оттенки изображений и текстовые блоки в разных частях сайта – создают спокойствие и эстетическую привлекательность.

Еще один дизайн с сине-зелено-желтой палитрой цветов.


Нидерландский сайт эко-тематики с символичной раскраской (зелень, вода, тепло солнечного света)

зеленый и розовый


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

Читайте также: Цвета в Web дизайне: колор-тенденции (яркие тона)

Сочетание цветов в дизайне сайта - зеленый и коричневый


Классическое сочетание зеленого и коричневого действительно ассоциируется с размышлениями о природе. Его можно гармонично использовать для самых разных случаев. Сайт Beanstalk использует коричневый фон, с зеленого цвета логотипом, изображениями и заголовками. Такое цветосочетание выбрано с целью подчеркнуть контент.


Альтернативный вариант для этого сочетания представляет Go Glamping . Густой зеленый цвет в шапке сайта, блоки с темно-зеленым текстом на фоне текстуры дерева с теплым оттенком создают веселый и эффективный стиль.


Интересный пример логичного использования зеленого и коричневого цветов в дизайне проекта «Деревья – наше будущее» на поддомене e-commerce сайта с био-тематикой tcv.org.uk (также сочетающего зеленую шапку с коричневым футером). В первом экране минисайту задают веселый стиль: контраст забавных мультяшных шрифтов, гранжевый заголовок, красивое меню оформленное необычным образом – с зелеными листиками, креативом подсветки пунктов и добавлением акварельного эффекта.