Сочетание цветов при выборе веб-дизайна для сайтов

Автор: WF


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

О совместимости цветов при выборе веб-дизайна мы и поговорим.

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

Обратите внимание на углы, которые для наглядности отмечены буквами, где:

Ж - желтый

С - синий

К - красный

З - зеленый

Ф - фиолетовый

О - оранжевый

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

Другими словами, если Вы создаете сайт и его дизайн основан на сочетании цветов: Ж-С-К (или, например, Ж-С, Ж-К, С-К), то веб-дизайн Вашего сайта выполнен правильно с позиции подбора цветовой гаммы.

То же можно сказать и о вершинах другого треугольника. Сочетаются между собой цвета: З-О-Ф (и, соответственно З-О, О-Ф и З-Ф).

Теперь совместим эти два треугольника:

Что мы получили? - Теперь мы имеем следующую картину:

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

Т.е., помимо предыдущих допустимых цветовых сочетаний (Ж-С-К и З-О-Ф), добавляются еще следующие возможные цветовые дизайн-решения (смотрим, начиная с желтого): Ж-О-К, О-К-Ф, К-Ф-С, Ф-С-З, С-З-Ж и З-Ж-О.

Этот принцип следует обязательно учитывать при выборе веб-дизайна для Ваших сайтов.

Более углубленно варианты сочетающихся цветов можно увидеть на следующем рисунке:

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

И, напоследок, - при создании дизайна для своего сайта по возможности старайтесь избегать обилия ярких, "кричащих" цветов. Лучше сделать полутона - это будет смотреться не только профессиональнее, но и эстетичнее.

Желаю Удачи Вам в изучении такой интересной науки, как веб-дизайн!



  • Веб-дизайн сайта. Основные правила.
  • Проверяем хостинг-провайдера и мониторим работу своего сайта.
  • Как создавать иконки для сайтов
  • Онлайн-статистика посетителей
  • Руководство по Adobe Photoshop
  • Антивирус Panda Internet Security 2009 — бесплатно на год!
  • Где регистрировать домен и как проверить информацию о любом домене.

  • 7 комментариев на «Сочетание цветов при выборе веб-дизайна для сайтов»

    1. Валерий в 24.12.2008 at 12:35

      Благодарю за познания в области веб-дизайна. На самом деле сочетание цветов — это очень важно! Это именно тот фактор, что определит новичка с первого взгляда.

    2. Гарик в 04.01.2009 at 14:58

      Спасибо, одно из лучших объяснений, что я встретил в сети :) Респект!

    3. Ленька в 09.04.2009 at 11:20

      Почему так не поясняют у нас в университете?!?! =)

    4. Maddog в 08.06.2009 at 13:05

      Спасибо за подробное и краткое обьяснение!!!

    5. Nyura в 22.04.2010 at 21:36

      Пригодится ваш рассказ по поводу веб-дизайна спасибо огромное)

    6. Евгений в 11.09.2010 at 17:43

      Зачёт! отличное описание самого важного! Понятные и наглядные схемы. Важная тема, именно эта область определяет количество времени, которое пользователь проведет на сайте и вообще вернется ли он на него! Спасибос)

    7. марик в 21.09.2010 at 15:59

      Очень поверхностная статья на тему цвета в веб-дизайне.
      Соотношения светлоты цветов вообще не затронуты, как и впрочем не дан ответ на вопрос, — почему именно такие фигуры?
      ЗЫ: Для тех кто хочет разобраться с цветом, в том числе и в веб-дизайне — читайте Иттена «Гармония цвета»

    Оставьте свой комментарий