Кольори в web-дизайні: Вибір правильного поєднання для вашого сайту

Колір, безумовно, є важливим джерелом емоції. Кольори можуть встановлювати правильний тон і передавати необхідні емоції відвідувачам, можуть схвилювати, викликати безліч почуттів і стимулювати до дій. Він є надзвичайно потужним фактором впливу на користувачів.

При виборі колірної гами для сайту, важливо зробити це правильно, керуючись основними принципами теорії кольору. У статті розглядаються найбільш значущі аспекти при виборі, основні принципи поєднання, призначення кольору в web-дизайні та його символічному значенні. Крім того, Ви побачите кілька гарних прикладів відповідно до переважаючих кольорів, а також ознайомитеся з деякими корисними порадами, щоб ефективно використовувати кольори при створенні web-сайту.

Отже, приступимо до знайомства з магією кольору...

Теорія кольорів: основні принципи. Вміння поєднувати кольори

Добре коли у Вас є почуття смаку, і Ви без проблем можете підібрати колірну схему сайту. Не всі люди можуть зробити це легко. Для тих, хто не впевнений, як правильно об'єднати кольори при створенні web-сайту, я б рекомендував ознайомитися з основами теорії кольору.

Розгляньмо колірне коло.

Трохи історії: колірне коло винайшов Ісаак Ньютон. Обґрунтувавши теорію світла і квітів у 1666г. Саме вона лягла в основу становлення і розвитку сучасної оптики, малою і складовою частиною якої є web-дизайн. Ньютон за допомогою тригранної скляної призми розклав біле світло на сім кольорів (у спектр), тим самим довівши його складність (явище дисперсії), відкрив хроматичну аберацію.

Колірне коло є неодмінним атрибутом багатьох дизайнерів і художників по всьому світу. Це ідеальний доказ теорії, що геніальне завжди просто. Коло дозволяє вам вибрати кольори, які гармоніювали б разом. Він складається з 6 основних кольорів: червоний, помаранчевий, жовтий, зелений, синій, фіолетовий і додаткових кольорів.

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

Загальні кольори

Є три основних кольори: червоний (# ff0000 в HTML або # F00 в CSS), жовтий (# FFFF00 в HTML або # ff0 в CSS) і блакитний (# 0000FF в HTML або # 00f в CSS). Не можна їх отримати шляхом змішування інших кольорів. Додаткові кольори можуть бути сформовані шляхом об'єднання цих трьох кольорів.

Складені кольори

Є також три основних: помаранчевий (# ff9900 в HTML або # F90 в CSS), зелений (# 00FF00 в HTML або # 0f0 в CSS) і фіолетовий (# FF00FF в HTML або # f0f в CSS). Ви можете отримати їх шляхом змішування червоного і жовтого (помаранчевого), жовтого і синього (зелений) і синього і червоного (фіолетовий).

Третинні кольори

Щоб отримати один з третинних кольорів, потрібно змішати один колір і один вторинний колір. Можливості для третинних кольорів безмежні.

Додаткові кольори

Додаткові кольори розташовані прямо навпроти один одного на колірному колі: червоний і зелений, синій і помаранчевий, фіолетовий і жовтий. У поєднанні один з одним, вони складають разючий контраст. Такі поєднання, як правило, використовуються для виділення деяких елементів на веб-сайті.

Подібні кольори

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

Кольори в різних культурах: символізм

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

Давайте з'ясуємо, яке значення мають кольори в різних культурах:

Червоний

• Китай: колір нареченої, удачі, урочистості
• Індія: чистота
• Південна Африка: жалобні кольори
• Схід: радість (у поєднанні з білим)
• Захід: збудження, любов, пристрасть
• США: різдво (із зеленим), день святого Валентина (з білим)
• Івріт: жертва, гріх
• Японія: життя
• Християнство: жертва, пристрасть, любов
• Фен-шуй: Янь, вогонь, удача, повага, захист, живучість, гроші, визнання

Блакитний

• Європа: заспокоєння
• Іран: траур, колір неба і духовність
• Китай: безсмертя
• Індуїзм: колір Крішни
• Юдаїзм: святість
• Християнство: колір Христа
• Католицизм: кольори одягу Марії
• Близький Схід: захист
• У світі: колір безпеки
• Фен-шуй: Інь, вода, спокій, любов, зцілення, релаксація, довіра, пригоди
• Захід: печаль, депресія

Жовтий

• Європа: щастя, надія, радість, боягузтво в небезпеках, слабкість
• Азія: колір імперського
• Єгипет: траур
• Японія: мужність
• Індія: торговці
• Буддизм: мудрість
• Фен-шуй: Янь, Земля, сприятливий, сонячні промені, тепло, рух

Помаранчевий

• Європа: осінь, урожай, творчість
• Ірландія: протестанти (релігійні)
• США: Хелловін (з чорним), дешеві товари
• Індуїзм: шафран (персиковий помаранчевий) священний колір
• Фен-шуй: Янь, Земля, цілі, підсилює концентрацію

Коричневий

• Колумбія: перешкода продажам
• Австралійські аборигени: кольори землі, урочисте охра
• Фен-шуй: Янь, Земля, промисловість

Зелений

• Японія: життя
• Іслам: надія, чеснота
• Ірландія: символ всієї країни
• Європа/США: весна, нове народження, День Святого Патріка, Різдво (з червоним)
• США: гроші
• Індія: Іслам
• Фен-шуй: Інь, дерево, зцілення, здоров "я, заспокійливе

Фіолетовий

• Таїланд: траур (вдови)
• Католицизм: смерть, жалоба, розп'яття
• Фен-шуй: Інь, колір фізичного та психічного зцілення

Білий

• Європа: шлюб, ангели, лікарі, лікарня, світ
• Японія: траур, біла гвоздика символізує смерть
• Китай: траур, смерть,
• Індія: нещастя
• Схід: похорон
• Фен-шуй: Янь, метал, смерть, привиди, траур, рівновага, впевненість

Чорний

• Європа: траур, похорон, смерть, бунт, спокій
• Таїланд: нещастя, зло
• Юдаїзм: нещастя, зло
• Австралійські аборигени: колір людей
• Фен-шуй: Інь, вода, гроші, успіх в кар'єрі, дохід, стабільність, емоційний захист, сила

Значення кольорів

Давайте подивимося, які почуття може викликати кожен колір і подивимося на деякі готові рішення.

Червоний

В основному пов'язаний з азартом, сміливістю і бажанням. Червоний колір любові, сили, енергії, лідерства і хвилювання. Це сильний колір, і ви повинні знати про деякі його негативні емоції: небезпека, тривога.

Блакитний

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

Жовтий

Колір, який найчастіше асоціюється з живістю. Енергійний, дає відчуття щастя. Крім того, він асоціюється з цікавістю, розвагою, радістю, інтелектом, обережністю.

Помаранчевий

Бадьорість і творчість. Асоціюється з дружелюбністю, впевненістю, грайливістю, мужністю, стійкістю.

Фіолетовий

Традиційно асоціюється з владою, благородством і багатством. Мудрість, незалежність, благородство, розкіш, честолюбство, гідність, магія і таємниці.

Зелений

Колір гармонії, природи, зцілення, життя, харчування та здоров'я. Крім того, часто пов'язаний з грошима.

Коричневий

Колір релаксації та впевненості. Коричневий означає приземленість, природу, довговічність, комфорт, надійність.

Сірий

Викликає почуття серйозності, консерватизму і традиціоналізму. Збуджує відчуття чистоти і невинності.

Рожевий

Виражає ніжність, романтичність, жіночність, пасивність, прихильність, виховання, слабкість.

Чорний

Стильний і елегантний колір, пов'язаний з владою, вишуканістю. Якщо ви не хочете, щоб ваш сайт викликав важкі почуття, намагайтеся не використовувати його у великій кількості. З іншого боку, якщо ви зробите чорний фон, він може збільшити перспективу і глибину.

Білий

Білий пов'язаний з чистотою, простотою, свіжістю, добротою, невинністю.

Ув'язнення

Існують деякі корисні поради, які допоможуть Вам у виборі правильної колірної схеми для вашого сайту. Ці маленькі поради широко використовують професійні web-дизайнери.

1. Якщо ви бажаєте, щоб текстовий вміст був легким, вибирайте контрастні кольори.
2. Оптимальна кількість кольорів. Не робіть з Вашого сайту цирк.
3. Використовуйте необхідну кількість кольорів. Мінімальна кількість кольорів може сприяти серості Вашого сайту.
4. Якщо вам потрібно залучити відвідувача, застосовуйте інтенсивні кольори.
5. Ви можете знайти додаткові схеми кольорів частіше за природу.

Корисні посилання за темою:

• wikipedia.org/wiki/Color_theory
• com/edu/COM498/index.html
• sibagraphics.com/colour.php
• bwwsociety.org/feature/color.htm
• liquisoft.com
• about.com/od/color/Designing_With_Color.htm
• webdesign.org/web-design-basics/color-theory

Джерело: Colors in Web Design: Choosing a right combination for your Website