Як підібрати кольори для сайту?

Вибрати колірне рішення для сайту – це завдання не з легких, особливо якщо немає знань у колористиці. Колір впливає на нашу підсвідомість, керує увагою та допомагає виділити важливе та другорядне. Якщо цим питанням не зайнятися, то сторінка виглядатиме блякло, нецікаво і незабаром вивітриться з пам'яті відвідувачів. І навпаки: якщо перемудрити і намішати дуже багато кольорів, веб-сайт буде кричущим і дивним.

Знання ключових правил колористики допоможе обрати грамотне рішення кольору.

Як кольори впливають на бренд та сайт?

Якщо згадати при якійсь людині про Кока-Кола, швидше за все у нього в голові спливе характерний логотип: напій з білими літерами на червоному тлі. Це вже усталена асоціація. Яскраво-червоний відтінок такий же відомий і запам'ятовується для людей, як сам напій, як усіма улюблена пісня з реклами «Свято до нас приходить».

Використання червоного кольору у бренді Кока-Коли має дві підстави:

1. Яскравий колір добре виділяється на полицях серед інших напоїв із менш помітними етикетками.
2. Колір викликає певні емоції, до яких апелює компанія: червоний завжди асоціюється з любов'ю, пристрастю, певною енергетикою.

Грамотно та правильно підібране колірне рішення не тільки створить сам сайт привабливим та цікавим для відвідувачів, але й зробить бренд в цілому пізнаваним і незабутнім. Згідно зі статистикою, у більш ніж 85% випадків покупку можна виправдати дією на свідомість людини певного кольору. А ще, якщо у бренду буде свій характерний особливий колір, він стане більш пізнаваним на 80%.

Розробляючи дизайн, потрібно звернути увагу на три нюанси:

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

Як вибрати ключовий колір?

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

1. Червоний, помаранчевий, насичений синій та чорний – відтінки, що підштовхують до спонтанних покупок, тому їх часто використовують у кафе, у бутіках одягу, під час розпродажів.
2. Темний синій та бірюза мотивують здійснити покупку людей з обмеженим доходом. Так що таке поєднання часто застосовується в оформленні банків та великих супермаркетів.
3. Блакитний, салатовий, яскраво-рожевий та малиновий – відтінки для всіх категорій покупців, вони часто зустрічаються в магазинах товарів не першої необхідності, які прагнуть підвищити якість життя, наприклад, бутики одягу.

Варто також враховувати значення кольорів

1. Зелений символізує здоров'я, спокій, достаток та природу. Цей колір приємний для сприйняття, допомагає розслабитись. До речі, за статистикою зелений – один із найприємніших відтінків як для чоловіків, так і для жінок.
2. червоний – символ любові, пристрасті чи небезпеки та тривоги. У маркетингу часто використовується, щоб підштовхнути людину до покупки, повідомити про вигідні умови, необхідність угоди. У громадському харчуванні допомагає викликати апетит.
3. Жовтий уособлює молодість, свіжість, оптимізм. Популярний для привернення уваги. Але треба знати ще, що жовтий може стати причиною емоційної напруги, тому застосовувати його потрібно з обережністю.
4. Рожевий завжди пов'язаний з романтикою, жіночністю, ніжністю та легкістю, тому його беруть в основному для дизайну сайтів з товарами та послугами для дівчат.
5. Помаранчевий - Це символ творчості, дружелюбності. Він спонукає людей до дії, мотивує. Такий колір здатний підштовхувати до імпульсних покупок та кроків, тому його часто використовують для оформлення Call-to-action кнопок.
6. Синій вселяє певну впевненість, почуття безпеки, спокою та умиротворення. Через це колір широко використовується різними комерційними організаціями та банками.
7. Чорний - Елегантний і розкішний колір. Популярний для реклами та просування люксових дорогих продуктів.
8. Фіолетовий асоціюється з достатком, успішністю та мудрістю. Заспокоює людей, вселяє довіру. Дуже популярний для оформлення сайтів, пов'язаних із косметикою.
9. Сірий – це універсальність, лаконічність та мінімалізм. Він символізує обережність та надійність.

Як сприймають кольори чоловіки та жінки?

Чоловіки краще сприймають яскраві та соковиті відтінки, а жінки – спокійніші. І для чоловіків, і для жінок однаково приємні і світлі, і темні кольори. Чоловіки більше віддають перевагу ахроматичним кольорам – білий, сірий, чорний. Жінки їх сприймають не так люб'язно. Жіноча стать краще реагує на світлі, пастельні тони, а чоловіки – на темні.

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

Для чоловічої цільової аудиторії переважно використовувати чорний, відтінки синього та зеленого. А ось коричневого, фіолетового та вогненно-жовтогарячого варто уникати.

Де на сайті використовувати основний колір?

Якщо тепер ви вже вирішили,який колір буде головним на вашій сторінці потрібно визначитися, де і як саме його потрібно застосовувати. Цей відтінок повинен акцентувати увагу, тому не варто їм оформлювати все поспіль. Використовуйте основний колір у тих місцях, які вважаєте ключовими, де хочете затримати увагу відвідувача або мотивувати його зробити якусь дію (кнопки Call-to-action).

Де найкраще застосувати основний колір?

1. Логотип;
2. Розділ меню;
3. Головна кнопка, що закликає до дії;
4. Назва
5. Важливі факти.

Як застосовувати акцентні відтінки?

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

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

Де можна використати акцентні кольори?

1. Кнопки
2. Підзаголовки;
3. Додаткова інформація важливий характер;
4. Кнопка переходу до розділу меню.

Як вибрати та використовувати фоновий колір?

Залежно від мети та спрямованості сайту потрібно вибирати відповідний колір тла. Головне правило - ніколи не вибирайте відтінок, на якому важко прочитати текст. Якщо не впевнені, як дивитиметься той чи інший колір на фоні, краще застосовуйте стандартні тони: сірий, білий. Можливо, це не дуже оригінально, зате не заважатиме і відволікатиме увагу від важливого.

Сервіси для вибору кольору на сайт

Ми вже розібралися, які кольори хтось і як сприймає. Але як їх між собою поєднувати – поки що питання. Для цього можна скористатися спеціальними сервісами.

1.Adobe Color

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

2.Hailpixel

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

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

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

1. виберіть основний колір відповідно до логотипу;
2. підберіть правильні додаткові кольори;
3. Виберіть фон, який поєднується з іншими кольорами та не перекриває текст.

І не полінуйтеся скористатися якимось сервісом по підбору кольорів, щоб поєднання було справді приємним та привабливим для ваших клієнтів.