Дизайн і підбір колірної гами – те, що відіграє не останню роль у створенні сайту. Вибір, зроблений вірно, важливий, адже палітра впливає на настрій людини і в якійсь мірі на його поведінку. Кольором однозначно можна привернути увагу або відштовхнути.
Щоб не втратити потенційних клієнтів, власник веб-ресурсу повинен враховувати думку професійного дизайнера. Але і самому корисно мати уявлення про підбір гармонійної колірної гами для сайту. Як підбирати відтінки, які сервіси допоможуть «підглянути» кольору для сайту і їх поєднання, як працюють колірні схеми. Що ще потрібно врахувати при виборі палітри для веб-ресурсу.
Правила підбору
Головний інструмент, який застосовують для комбінування відтінків, – це колірний круг. З його допомогою можна знайти ефектні поєднання, які гармонійно виглядають разом. Але спочатку треба зрозуміти принципи роботи з ним.
Гармонійні комбінації народжуються з:
- 3 кольорів, які в колі утворюють трикутник. Класична тріада – коли кожен елемент трійки віддалений від іншого на рівну відстань. Один колір панує, два інших доповнюють його. Ще є аналогові тріади – поєднання відтінків, що лежать поруч один з одним на колірному колі.
- 4 кольорів, що утворюють прямокутник. Складна схема, при якій 1 колір – головний, 2 – додаткових, а ще один – підкреслює акценти. Всі 4 кольори не можна використовувати як основні: з’явиться дисбаланс, дизайн буде, що називається, різати око.
- Контрастів, тобто поєднань 2 кольорів, розташованих в колі протилежно.
Такі комбінації називають колірними схемами. Вони залишаються гармонійними незалежно від того, який кут повороту.
Щоб швидше зорієнтуватися в підборі кольору, треба засвоїти ще кілька нескладних правил:
- Гармонійними є тони, які близькі за спектром. Наприклад, поряд з червоним в колі розташовуються рожевий, помаранчевий.
- Комплементарні або додаткові відтінки – пара, розташована в колі навпроти. Це, припустимо, синій з жовтим, зелений з червоний. Їх не можна використовувати на рівних: один – завжди основної, іншої – додатковий. Ступінь контрасту значний, і такі поєднання краще застосовувати, коли якусь інформацію необхідно підкреслити. Наприклад, синій – фон, жовтий – колір акценту.
Правил і схем в теорії кольору набагато більше, названі тільки основні. Але зараз багато безкоштовних сервісів, які допомагають і дизайнерам, і любителям швидко і легко знайти своє поєднання:
- Adobe Color CC. Є кілька режимів підбору, багато палітр.
- Paletton.com – теж легкий в роботі.
Одного онлайн-помічника більш ніж достатньо! Просто виберіть той, який зручніше особисто вам. Взагалі підбір кольорів для сайту – справа непроста і суб’єктивна. Завдання полегшується, коли вже розроблений фірмовий стиль: зрозуміло, які відтінки потрібно використовувати.
Значення відтінків
Багатьох при виборі кольору цікавить його значення. Коротко, як сприймаються кольори в дизайні сайту:
- Чорний: сила, лаконічність, влада.
- Білий: свіжість, ясність, чистота.
- Бежевий: скромність, нейтралітет, ніжність.
- Відтінок слонової кістки: стиль, елегантність, комфорт.
- Сірий: строгість, професіоналізм, контроль.
- Фіолетовий: еліта, розкіш, романтика.
- Синій: спокій, стабільність, безпека.
- Зелений: зростання, розвиток, природність.
- Помаранчевий: молодість, дружба, бадьорість.
- Жовтий: веселощі, ентузіазм, енергія.
- Червоний: пристрасть, дія, активність.
Можна довго розбиратися з психологічної точки зору, які кольори на що впливають і які пробуджують асоціації. Треба зрозуміти просту річ: важливо підібрати таку палітру, щоб вона не дратувала відвідувачів.
Смаки у всіх різні, на сприйняття впливає емоційний фон, самопочуття, настрій, призначений для користувача досвід, погода і ще 1 000 факторів. На всіх не догодиш! Вчені давно довели, що чоловіче і жіноче сприйняття кольору дуже відрізняються один від одного. Дуже складно знайти таке рішення, яке влаштує всіх. До речі, найбезпечнішим в цьому плані кольором виступає синій. Недарма саме його обрали багато соціальних мереж – Facebook, Твіттер.
Колір і тема сайту
Правильне рішення допоможе зробити сайт унікальним і помітним! І посприяє тому, щоб відвідувач затримався на веб-ресурсі. Як зробити дизайн сайту ще й зручним читайте тут. Для того щоб найбільш вдало підібрати колірну палітру, необхідно враховувати на тематику сайту.
Іноді вона задає тон і диктує свої умови:
- Уявімо, що сайт присвячений ландшафтному дизайну, благоустрою садів, продажу кімнатних рослин. В якості основного кольору тут явно напрошується зелений, твердо асоціюється зі світом флори!
- Якщо вміст сайту якимось чином пов’язано з водою (морськими подорожами, акваріумами, доставкою питної води), фаворитом буде синій.
- Сайти на різноманітні жіночі тематики часто використовують рожевий. І це обгрунтовано, адже він символізує жіночність, ніжність.
- Жовтий колір близький до золотого. Придивіться, і ви зрозумієте, що організації, пов’язані з фінансами, – банки, страхові компанії, МФК – часто вибирають наближені кольори.
Якщо підбір колірної гами викликає труднощі, зверніться за допомогою до природи, там реально знайти підказки! Натуральні природні кольори завжди гармонійно і ідеально поєднуються. Однак професійний веб-дизайнер допоможе швидше. Про те, як підібрати і оптимізувати зображення дя сайту читайте за посиланням.
Не варто забувати, що будь-який сайт розрахований на певну аудиторію. Звичайно, кожна людина має свої переваги щодо палітри, але є деякі закономірності. В тому числі, вікові:
- Дітей і молодь більше привертають барвисті і яскраві відтінки.
- Люди середнього віку віддають перевагу менш насиченій гаммі.
- Старше покоління краще сприймає м’які пастельні тони.
Тому, щоб вдало визначитися з колірною гамою сайту, потрібно вивчити цільову аудиторію, проаналізувати статистику відвідувачів, якщо компанія уже представлена в Мережі веб-ресурсом.
Колір і тип сайту
Палітри розрізняються не тільки в залежності від тематики, а й за типами сайтів.
Наприклад:
- Для новинних порталів підходять нейтральні кольори – чорний, білий, сірий. Їх користувачі більше звертають увагу на контент, тому колірна розмаїтість там зводиться до мінімуму.
- До цієї ж тенденції тяжіють комерційні сайти. Бізнес воліє строгий, діловий дизайн, з використанням нейтральних, спокійних тонів. Хоча загальну строгість часто розбавляють яскравими акцентами, щоб виділити найбільш важливу інформацію, підштовхнути відвідувача до активних дій.
- Для форумів і соцмереж важливі простота використання і комфорт відвідувачів. Тому оформлення рідко буває барвистим, зазвичай в дизайні застосовуються не більше двох-трьох кольорів.
- Інтернет-магазини часто мають ефектний дизайн. Треба стежити, щоб яскраві елементи відповідали пропонованим на сайті товарам. Але ці ресурси зазвичай оформлені ефектно, виразно.
- Лендінг сторінки призначені саме для того, щоб привертати увагу до продукту або пропозиції. Контент у них зазвичай досить короткий і ємний, а оформлення виступає на перший план. І такий ресурс зобов’язаний бути красивим. Але, звичайно, все добре в міру.
Реалізація кольору
Ось простий алгоритм, який підкаже, як вибирати колірну гамму сайту:
- Для початку потрібно визначитися, який тон буде переважаючим. У головному кольорі зазвичай виконується основне меню, важливі кнопки, інформаційні блоки.
- Далі вибирається комплементарний тон або декілька.
- Додаткові кольори використовуються в оформленні границь меню і блоків, а також в заголовках, посиланнях, кнопках і інших елементах.
Особливу увагу зверніть на поєднання додаткових кольорів. Вони повинні бути в міру контрастними і створювати гармонійну комбінацію. Дотримуючись цих нескладних рекомендацій, ви отримаєте хороший результат.
Текст
При підборі шрифтів треба стежити за тим, щоб текст легко читався і не зливався з фоном. Читабельність, зручний для сприйняття розмір – основне при підборі типографіки. Уникайте вигадливих, складних і погано помітних шрифтів, де букви зливаються або не приймаються.
Особливу увагу відображенню контенту треба приділити, якщо застосовується темний фон. При необхідності можна поміняти колір шрифту, підкреслювати або застосовувати окантовку. Хоча з кольором шрифтів варто обходитися вкрай обережно – для виділення іноді такий прийом використовують, але якщо допустити помилку, можна відштовхнути відвідувачів.
Важливо робити коректні відступи між блоками і рядками. Від цього може залежати, наскільки буде читабельним текст.
Фон
Сторінки сайту повинні мати якщо не однакові, то єдині по стилістиці дизайну. Якщо вони будуть виконані в декількох кольорах, з мінливими спецефектами, то не всім користувачам сподобається подібна строкатість.
Не обов’язково, щоб фон був однотонним. Можна спробувати міняти контрастність на різних ділянках, використовувати інші ефекти. Колір краще брати неяскравий. Іноді навмисно варто створити з колірною гамою сайту контраст. Тільки при цьому треба стежити, щоб фон не затьмарював собою контент. Всі елементи і текст повинні добре проглядатися.
Сьогодні дуже часто замість фону застосовують фото високої роздільної здатності, анімацію або відео. Поки це тренд, сучасне рішення, але воно не завжди вдається в реалізації. Потрібно контролювати, щоб швидкість завантаження залишалася на високому рівні. І, звичайно, ніякого звуку при запуску відео!
Підбирати колірну гамму для сайту можна самостійно. Але, пам’ятайте, що якою б цікавою не була інформація, розміщена на сайті, вона ризикує бути проігнорованою в разі неправильного оформлення. Тому звертайтеся до нас для професійної розробки сайту! Якщо у вас є задуми, побажання, переваги, вони будуть обов’язково враховані. Але якщо ви помиляєтеся в якомусь моменті, фахівець переконає вас передумати і запропонує найкраще рішення.