Цвет для сайта: что привлекает покупателей

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

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

Как выбрать цвет сайта: основы знаний

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

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

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

Теория цвета состоит из трех основных частей:

1. Контраст

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

   
   

2. Дополнение

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

3. Резонанс

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

   Читайте также!

   «Создание дизайна сайта: как правильно заявить о себе в интернете» Подробнее

   Компания BBC News специально сделала на своем веб-ресурсе красную навигационную панель, чтобы пробудить читателя, усилить его возбуждённое состояние. С учетом специфики данного ресурса (сенсационные новости) такое решение является вполне логичным.

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

13 советов по выбору основных цветов сайта

Известно ли вам, что около 85 % всех покупателей решают купить товар только из-за его цвета?

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

McDonald’s — желтый и красный.

Nike — белый и черный.

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

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

Как вы считаете, какой элемент является неотъемлемой частью бренда?

Конечно же, логотип.

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

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

Грамотное оформление сайта не менее важно, чем оформление логотипа бренда. Не стоит основываться лишь на словах «смотрится классно» или подбирать комбинацию оттенков наугад. Убедитесь в том, что выбранный вами цвет выделяется. И не забудьте позаботиться об эстетике. Хорошенько обдумайте своё решение.

Зачем?

Дело в том, что в течение 1,5 минуты после первого осмотра продукта люди подсознательно делают о нем выводы. А 62–90 % их мнения основано лишь на восприятии цвета.

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

13 эффективных рекомендаций по подбору оптимальной цветовой схемы, основанных на личном опыте профессиональных маркетологов и результатах научных исследований:

1. Разберитесь в том, как цвет влияет на эмоциональный фон человека

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

Для этого посмотрите, как покупатели реагируют на разноцветные кнопки призыва к действию:

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

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

В различных культурах цвет имеет свое значение.

Красный: 

• Фэн-шуй: признание, Ян, деньги, огонь, живучесть, удача, защита, уважение.

• Китай: торжество, удача, невеста.

• Христианство: любовь, страсть, жертва.

• Индия: чистота.

• Япония: жизнь.

• Южная Африка: траур.

• Иврит: грех, жертва.

• Восток: радость (в комбинации с белым).

• США: день святого Валентина (с белым), Рождество (с зеленым).

• Запад: страсть, любовь, возбуждение.

Голубой: 

• Запад: депрессия, печаль.

• Европа: успокоение.

• Фэн-шуй: приключения, Инь, доверие, вода, релаксация, спокойствие, исцеление, любовь.

• Иран: духовность, небо, траур.

• В мире: безопасность.

• Китай: бессмертие.

• Ближний Восток: защита.

• Индуизм: символ Кришны.

• Католицизм: одежды девы Марии.

• Иудаизм: святость.

• Христианство: символ Христа.

Желтый: 

• Фэн-шуй: движение, Ян, тепло, Земля, солнечные лучи, благоприятный.

• Европа: слабость, счастье, трусость, надежда, радость.

• Буддизм: мудрость.

• Азия: имперский символ.

• Индия: торговля.

• Египет: траур.

• Япония: мужество.

Оранжевый: 

• Фэн-шуй: усиление концентрации, Ян, цель, Земля.

• Европа: творчество, урожай, осень.

• Индуизм: шафран (персиковый оттенок), святость.

• Ирландия: религиозное протестантство.

• США: бюджетные товары, Хэллоуин (в комбинации с черным).

Коричневый: 

• Фэн-шуй: промышленность, Земля, Ян.

• Аборигены Австралии: торжественное (охра), земля.

• Колумбия: препятствие торговле.

Зеленый: 

• Фэн-шуй: покой, Инь, здоровье, дерево, исцеление.

• Япония: жизнь.

• США: деньги.

• Ирландия: символ страны.

• США/Европа: Рождество (в комбинации с красным), весна, день Святого Патрика, новое рождение.

Фиолетовый:

• Фэн-шуй: исцеление (психическое и физическое), Инь.

• Католицизм: распятие, траур, смерть.

• Таиланд: вдовий траур.

Белый:

• Фэн-шуй: уверенность, Ян, равновесие, металл, траур, смерть, призраки.

• Европа: мир, брак, больница, ангелы, врачи.

• Восток: похороны.

• Япония: смерть (белая гвоздика), траур.

• Индия: беды и несчастья.

• Китай: смерть, траур.

Черный:

• Фэн-шуй: сила, Инь, эмоциональная защита, вода, стабильность, деньги, доход, успех в карьере.

• Европа: спокойствие, траур, бунт, похороны, смерть.

• Аборигены Австралии: люди.

• Таиланд: зло, несчастье.

• Иудаизм: зло, несчастье.

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

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

2. Проанализируйте демографические данные своих потребителей

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

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

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

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

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

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

Фиолетовый — мудрость, величие, успех и богатство. Действует на человека успокаивающе, нередко используется в оформлении косметики.

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

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

Чёрный — символ роскоши, элегантности, опытности и влияния. Вызывает ассоциации с аккуратностью, силой, профессионализмом. Применяется для презентации элитной продукции.

Что представляет собой ваш целевой клиент? Он юный и энергичный человек? Или более зрелый и опытный, с хорошим заработком? Ваши товары (услуги) больше рассчитаны на женщин или на мужчин? А может, они подходят лишь конкретной возрастной группе?

Постарайтесь понять эмоции и индивидуальность ваших покупателей: это очень важно.

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

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

3. При выборе цвета учитывайте пол потенциальных покупателей

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

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

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

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

• Ахроматические цвета

Это все оттенки серого, черный и белый. Они чаще привлекают мужчин, чем женщин.

• Светлые и темные оттенки

Оказывается, у женщин восприятие некоторых цветов усилено. Именно поэтому им так нравятся светлые оттенки.

Женщины:

• Менее предпочтительны: серый, коричневый, оранжевый.

• Более предпочтительны: зеленый, фиолетовый, синий.

Мужчины:

• Менее предпочтительны: фиолетовый, оранжевый, коричневый.

• Более предпочтительны: черный, зеленый, синий.

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

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

4. Не забывайте о возрасте потребителей

Другой немаловажный момент — возрастная группа. Известно ли вам, что с возрастом у человека меняются предпочтения в цветовой гамме? Научные исследования это подтверждают.

Любимые цвета людей разных возрастных групп:

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

5. Забудьте о предубеждениях

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

Они основываются вовсе не на психологии, а лишь на своих личных предпочтениях.

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

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

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

6. Примите решение о количестве цветов, которое вы будете использовать при оформлении сайта

По прошествии всех предыдущих этапов вы должны окончательно определиться с основным цветом для сайта. Готовы двигаться дальше? Тогда давайте выясним, сколько всего оттенков вам следует использовать. Разумеется, единой для всех формулы успеха не существует. Однако есть одно полезное правило под названием «60-30-10».

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

Выглядит это примерно таким образом:

• основной — 60 %;

• второй по важности — 30 %;

• акцентирующий — 10 %.

В веб-дизайне предполагается, что основной оттенок будет занимать около 60 % всего пространства интернет-площадки, следующий по важности — примерно 30 %, а акцентирующий — 10 %.

На сайте QuickSprout вы можете посмотреть наглядный пример применения правила «60-30-10».

Роль основного цвета на данном ресурсе играет голубой, вторичного — зеленый, а акцентирующего — синий.

Конечно, вы можете задействовать и меньше. Но не больше. Если оттенков будет 4 и более, то задача пользователя усложнится, а внешний вид сайта может стать отталкивающим.

7. Определитесь с набором цветов

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

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

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

К примеру, подписаться на обновления, заполнить форму, позвонить по указанному номеру и пр.

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

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

Области использования вспомогательного цвета:

• второстепенная информация;

• подзаголовки;

• активная кнопка меню.

8. Правильно выберите фоновый цвет сайта

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

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

То же самое относится к выбору цвета фона для сайта.

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

Разумеется, нет. Ведь у этих помещений абсолютно разное предназначение.

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

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

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

9. Изучите цветовое колесо

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

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

Варианты сочетания аналогичных цветов — синий и зеленый, красный и оранжевый.

Примеры комбинации взаимодополняющих цветов — оранжевый и зеленый, фиолетовый и желтый.

10. Выберите правильный цвет шрифта для сайта

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

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

11. Пользуйтесь вспомогательными инструментами

К примеру, Colorspire.

Он позволит вам просто и быстро протестировать и оценить цветовые сочетания.

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

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

12. Изучите сайты своих конкурентов

Противники могут многому вас научить. Рекомендуем посетить хотя бы 3 конкурирующих с вами ресурса и оценить их цветовую палитру.

Посмотрите, какой цвет сайта они используют.

Далее решите, чего именно вы хотите:

• отличиться от остальных, двигаться в противоположном направлении;

• использовать похожую цветовую схему, стандартную, классическую.

Если ваша цель — сделать уникальный бренд, который будет выделяться среди других, то выбирайте первый путь.

13. Сравните несколько разных цветовых схем

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

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

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

Важно иметь хотя бы общее представление о правиле «60-30-10», а также о работе цветового колеса. Дайте волю фантазии, поэкспериментируйте, и оптимальная комбинация непременно найдется.

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

Как выбрать цветовую схему сайта в зависимости от решаемых задач

• Сайты с большим количеством контента или интернет-коммерция

Возможно, вы заметили, что онлайн-магазины и информационные порталы чаще всего выбирают нейтральные или белые цвета сайтов.

Все дело в цели этих ресурсов — продвижение продуктов или идей.

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

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

• Корпоративные сайты и сервисы

Корпоративные ресурсы всегда создаются с целью продвижения услуг и товаров.

Скачайте полезный документ по теме:

Деловая переписка: чек-лист для составления идеального письма

Оформляйте фон в зависимости от цели своего сайта.

1. Продвижение бренда

   Желаете создать запоминающийся образ бренда? Тогда попробуйте заполнить фон разными оттенками преобладающего цвета или своим фирменным цветом.

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

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

   
   

2. Продвижение сервиса

   Нейтральный и белый фон помогают привлечь внимание клиентов к портфолио или сервису.

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

• Стильные и креативные сайты с большим количеством графики

К сайтам, связанным с творчеством (красота, мода, кафе и рестораны, дизайн и пр.), не применяются какие-либо ограничения.

Такие площадки могут использовать любой фон. Можно добавить драматизма, сделав панель черной. Или взбодрить посетителей радужным фоном:

Самое главное, чтобы выбранный фон не затруднял прочтение текста.

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

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

При выборе цветовой схемы отбросьте свои личные пристрастия и чутье.

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

В работе над оформлением не место случайностям. Ещё раз напоминаем, какие цвета вам нужно выбрать:

• основной;

• дополнительный;

• фоновый.

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

6 наиболее эффективных схем выбора цвета для сайта

В цветовой гамме любого ресурса преобладающий оттенок используют для заполнения большей части пространства. Помните о воздействии цвета на настроение и разум человека и подбирайте его очень тщательно.

Как сочетать цвета для сайта? Есть множество различных вариантов, но в данной статье мы рассмотрим 3 самых эффективных способа.

1. Триада (тройная гармония, треугольник)

   
   

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

   Выберите на цветовом круге любые 3 оттенка (1 для фона и 2 для навигационной панели и контента), находящиеся в 120 градусах друг от друга.

2. Двойная комплиментарная система

   
   

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

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

   
   

3. Аналоги (последовательная система)

   
   

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

   Читайте также!

   «Оформление сайта: от главной страницы к текстовому наполнению» Подробнее

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

   Атмосфера умиротворения и спокойствия царит на сайте Blinksale благодаря сочетанию зеленого, бирюзового и голубого. Посмотрите, как жёлтый подчеркивает особенно важные детали.

   
   

4. Раздельный выбор

   
   

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

5. Прямоугольник

   
   

   Здесь задействуют 4 цвета: 1 преобладающий, 2 вспомогательных и 1 акцентирующий.

6. Квадрат

   
   

   Это самое энергичное, яркое и динамичное решение.

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

8 сервисов, которые помогут подобрать цвет для сайта

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

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

• colorscheme.ru 

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

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

• color.adobe.com

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

Чтобы открыть галерею всевозможных комбинаций, в левом верхнем меню нажмите кнопку «Смотреть».

• paletton.com

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

Следующие два ресурса создают палитру из картинки, которую вы выберете.

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

• Color Palette Generator

Здесь нужно указать ссылку на изображение.

• palettegenerator.com

А этот ресурс позволяет загрузить картинку с компьютера.

• palettable.io

Достаточно простой и удобный инструмент, который позволяет подобрать цвет для сайта онлайн по принципу «нравится — не нравится».

• materialpalette.com

«Материал дизайн» — ещё одно модное направление. Сервис подбирает цветовые комбинации для UI (user interface). Также на сайте имеется широкий выбор иконок.

• getuicolors.com

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

Автор статьи

Дмитрий Свистунов

Руководитель SEO-отдела и разработки

Последние статьи этого автора:

• Адаптивная верстка сайта: гайд для начинающих
• Анкор ссылки: виды, правила составления, влияние на продвижение
• Белая раскрутка сайта без перехода на темную сторону

Забрать гарантированный подарок

Полезные
материалы
для руководителей

Скачать 3,2 MB