Як вказати кольорову гаму, як я звертаюся до дизайну веб-сайтів?

Просто так є щось конкретне для обговорення, скажімо, у мене така кольорова гама:

Джерело

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

Чи є великі правила чи загальні рекомендації, які допомагають вирішити, які кольори йти куди?

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

Отже, перші кольори, які я люблю вибирати під час створення кольорової гами у веб-проекті, - це фон для тіла та основний колір тексту. Зазвичай це гарна ідея вибрати два найконтрастніші кольори для заповнення цих ролей, і ваша палітра для прикладу не є винятком, тому в цьому випадку кольорами є # DEE1DD і # 28363D. Тепер нам належить вирішити, що використовувати для тексту, а що використовувати для фону, і в більшості випадків я намагаюся використовувати більш світлий колір для фону і темніший для тексту. Провели чималі дослідження, які показали, що ми читаємо темний колір на світлому кольорі легше, ніж світлий на темному, тому я зазвичай замовчуюсь, якщо немає причин для більш темного вигляду (як, наприклад, ви робите веб-сайт для важкого металу гурт чи щось таке, я вважаю, що це не так). Так,

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

Далі ви нагадали на заголовок, який потрібно було пофарбувати, і знову нам потрібен контраст із фоном. В інтересах мінімалізму я намагаюся використовувати повторно кольори, які я вже використовував у тілі, і в цьому випадку колір тексту, ймовірно, занадто темний, щоб заповнювати велику кількість простору, тому я схиляюся до вибору # 2F575D і для З усіх перерахованих вище причин я б використовував колір тіла # DEE1DD, щоб заповнити будь-який текст або посилання у заголовку.

Нарешті, я висвітлюю неістотні елементи дизайну, як, наприклад, колись, і у нас є кілька різних зелені, щоб вибрати. Знову ж таки, це, ймовірно, повинно контрастувати з фоном достатньо, оскільки посилання не зникають при переході на них, тому, якщо схильні перейти з # 658B6F ...

І ... Вуаля! Тепер у вас є (основна) 4 колірна гамма. Я сподіваюся, що цей процес вам допомагає стільки, скільки мені допомагає :)!

Веб-сайт, на який ви пов’язані, показує, як використовувати ці кольори:

#28363D for the active state 
#2F575D as the navigation background 
#DEE1DD as background 
#C4CDC1 as banner ...

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

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

сподіваюся, що це допомагає

Не існує формули, що слід брати, що має бути тлом тощо, тому дизайн - це мистецтво.

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

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

Як я бачу, у вас повинна бути готова структура для веб-сайту, після чого вам потрібно буде визначити, який ваш основний контент, як ви хочете його представити. Може бути більш м’яким кольором на підкомпонентах, який не потребує негайної уваги.

Як ви знаєте, добре це чи ні? Легко, як тільки ти кажеш «Це добре», тобто коли це добре. Це завжди допомагає отримати другу думку від інших людей.

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

@Color Combination: Комбінація, яку надає веб-сайт, досить хороша для початку.

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

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