Первое впечатление - самое важное. А скорейший способ передать настроение в веб-дизайне - это цвет. Цвет - безусловно, важнейшее выразительное средство, если не на уровне изображения, то уж точно на уровне восприятия. Разные цвета создают разное настроение, так что стоит подумать, как их лучше вместе применить.
Статья The Art of Coordinating Colours in Web Design проводит для нас небольшой мастер-класс различных способов подбора цветов. Приводится много примеров реальных дизайнов сайтов, иллюстрирующих излагаемые принципы.
Какие же именно принципы следует соблюдать, чтобы создать благоприятное впечатление у посетителей сайта?
Сочетаемость цветов
Если при разработке дизайна страницы мы привычно выбираем цвета, исходя из их соотношений в цветовом круге,то что делать, когда мы кладем цветную фотографию на цветную подложку? А происходит все то же: эти цвета также должны гармонировать, демонстрировать единство. Да и фото вы отбираете не просто так, они должны хорошо ложиться в ваши шаблоны и иллюстрировать основную тему сайта.
Сами цвета при этом не обязаны составлять идеальное сочетание. Наш глаз способен инстинктивно определять цветовые соотношения.
Фото должно обязательно выглядеть реалистичным, поэтому в иллюстративных целях стоит немного "пережать" цвета, сделать их чуть более яркими, чем в жизни. Общую гамму фотографий легко откорректировать в Фотошоп так, чтобы она гармонировала с цветом вашего фона.
Такой подход иллюстрирует огромное множество сайтов отелей, курортов и прочих живописных мест. В статье можно увидеть дюжину конкретных примеров.
Кстати, при оформлении сайтов отелей подбирайте фото тщательно и присматривайтесь к основной палитре цветов, выбранных для оформления интерьеров. Вполне возможно, вам стоит подправить главные цвета сайта об этом отеле так, чтобы они гармонировали с основными цветами интерьеров или подчеркивали (усиливали) их.
Некоторые сайты применяют прием использования иллюстраций на основе сочетания двух каких-то цветов. Оформление сайта в этих случаях также желательно выполнить в тех же цветах, подчеркивая художественность съемки и настроение, навеваемое образами.
Другие способы сочетания цветов
Еще один прием состоит в подчеркивании какого-то одного, важного цвета на фотографиях.
Это может дать дополнительное привлечение внимания к нужным деталям. А окружающий шаблон может выглядеть как рамка для картинок, размещенных внутри.
Особенно сильное воздействие может быть, например, если такой цвет повторен в важнейших местах сайта, например, в логотипе или плашках.
Такую технику иллюстрирует средняя подборка сайтов, приведенных в статье.
Однако, при применении этого подхода нужно как следует думать, сравнивать и сопоставлять, чтобы цвета были не только гармоничными, но и не мешали восприятию главного на сайте.
Засчет значительно различных цветов может возникнуть сильный контраст. Постарайтесь сделать так, чтобы не нарушить единство передачи цветом настроения, которое несут фотографии.
Сочетание цвета с цветами фоновой картинки
В отличие от случаев, рассмотренных ранее, где шаблон и фотографии были физически разделены, применение огромной фоновой картинки на сайте требует несколько другого подхода. Элементы шаблона теперь укладываются поверх фотографии, и теперь уже они должны поддерживать цветовую палитру, заданную фоновой картинкой.
Если правильно пользоваться этим приемом, можно создать весьма впечатляющие сайты (и шаблоны для блогов!).
Причем, здесь есть две выгоды. Первое, то, что на сайте по фоновому изображению сразу видна его основная цель и направленность. Второе - мы не теряем ощущение, которое нам дает главное фото, если элементы управления не слишком видны. Вместо того, чтобы быть стандартной рамкой, элементы управления органично вплетаются в поверхность фото.
При выборе цветов здесь следует поддерживать разумное равновесие между визуальным впечатлением, целостным впечатлением от дизайна и наглядностью управления.
Чтобы элементы управления были видны наверняка, лучше использовать контрастные сочетания цветов. Но, если с контрастом переборщить, дизайн может выглядеть неприятно.
Другай крайность - дизайн элементов управления выбран настолько мягким, что фоновое изображение начинает доминировать над ними.
Как обычно, истина - в соблюдении меры между изобразительными средствами и бизнес-целями сайта, дизайн которого вы разрабатываете.
Итак, стараемся осмысленно строить отношения между цветами иллюстративных материалов и элементов шаблона. Они должны помогать друг другу в создании на сайте атмосферы приятного настроения от дизайна в целом и не мешать восприятию информации.
Источник: Scott Carmichael
Комментариев нет:
Отправить комментарий