Подбор цветового решения в веб-дизайне

Визуальная часть — одна из самых главных в разработке сайта, не менее важная чем, например CMS на которой будет работать сайт.

Визуальное оформление напрямую связано с юзабилити сайта и отвечает не просто за красивый вид, но и за время, которое гость проведёт на вашем сайте. В него укладывается не просто красота дизайна, но и тонкие психологические нюансы. Это работа с цветом, а цветовая гамма оказывает глубокое воздействие на подсознание человека.

Цветовая гамма сайта вызывает у посетителя ассоциации, напрямую взаимодействует с чувственным восприятием пространства, человек, глядя на сайт, ощущает и строит в своём сознании реальность, которая у него будет ассоциироваться с сайтом в будущем.

Почти все начинающие веб-дизайнеры допускают множество ошибок при создании дизайна сайтов. И самая грубая ошибка — это неграмотный подбор цветовой гаммы.

Не знаю почему, но многим хочется видеть сайт красочным и кричащим, что на самом деле есть неправильная мысль. Тут скорее следует подметить, что неправильна эта мысль для основных категорий сайтов.

Да, яркий красивый дизайн не всегда ошибочен, он имеет место для промо-сайтов — сайтов, которые ориентированы на рекламу и продвижение одного продукта. Но даже промо-сайты рисуются исходя из самих продуктов, для которых они создаются.

Цветовая гамма сайта должна быть сбалансирована. Этот баланс рассчитывается на основе содержимого сайта, то есть основной массе контента, который будет на нём публиковаться и целевой аудитории, которая будет посещать непосредственно сам Интернет-ресурс.

Например, вы задумали создать сайт с видео, вы решили на нём опубликовывать музыкальные клипы, трейлеры фильмов и другие всевозможные развлекательные видео непродолжительного содержания.

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

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

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

Выбор основных цветов для сайта упростит нам обзор уже существующих такой же, как у нас тематики, или же похожих, если тематика сайта планируется быть уникальной. Но как же не допустить ошибки при обзоре других похожих Интернет-проектов, если вдруг они могут также иметь неправильный подход в палитре своего дизайна?

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

Итак, подобранное цветовое решение из основных и второстепенных цветов необходимо наложить на сам сайт, на его интерфейс. Основные цвета отвечают за меню, блоки, кнопки, а второстепенные в свою очередь за дополнительные элементы оформления: границы блоков, границы меню, цвет основного текста, цвета ссылок в различных состояниях и пр. На этих двух группах цветов и будет стоять и рисоваться весь дизайн нашего сайта.

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

Это происходит обычно из-за одинаковых тематических категорий, к которым, эти сайты относятся. В основном, в Интернете преобладают сайты новостные, развлекательные, социальные, Интернет-магазины, промо-сайты и другие.

Среди всех этих категорий Интернет-ресурсов, самую большую схожесть не только в дизайне, но и в оформлении, имеют новостные сайты. Новостным сайтам характерна простота, а их основной дизайн составляет само содержание: графика, текст, видео и аудио.

Среди новостных встречаются и яркие по дизайну сайты, которые имеют отношение, например к новостям шоу-бизнеса, но в основном сейчас даже среди такой подкатегории новостных сайтов, в их дизайне всё чаще преобладает простота и строгость. Это грамотно, так как новости это 100% информации, а информации нужен минимум дизайна и максимум содержания.

Развлекательные ресурсы выделяются более сложными цветовыми схемами в своём дизайне. Ярких цветовых решений среди развлекательных сайтов больше у фото и игровых сайтов, иногда видео-сайтов.

Но видео-сайты не все одинаковы по своему функциональному решению. Социально-ориентированные видео-сайты, например YouTube предпочитают своему визуальному оформлению простоту.

Видео-сайты, где например, выкладывают фильмы для онлайн-просмотра или музыкальные клипы, отдают предпочтение яркому дизайну своего оформления. Это тоже по-своему правильно — в онлайн кинотеатре яркий дизайн уместен, но он должен иметь графические элементы, чётко подчёркивающие тематику фильмов и создавать атмосферу кинозала, хотя бы частично.

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

Сайты для общения, построенные на основе форумов, уже отвечают своим дизайном тематике форума — почти все форумы являются тематическими и их цветовые решения строятся исходя из ассоциации с тематикой.

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

Что касается Интернет-магазинов, то тут палитра дизайна должна иметь ассоциативное сходство с тематикой, то есть с продуктами, которые будут в нём предложены для покупки людям. Дизайну Интернет-магазинов позволительно иметь красочные графические элементы, но они должны строго соответствовать продуктам, которые в них продаются.

Промо-сайты — это одни из самых красивых и ярких сайтов. Так и должно быть по их сути. Промо-сайты отвечают за представление одного или нескольких продуктов, а посему в их дизайне допускается использование яркого оформления с обильной графикой как в глянцевых журналах.

Это единственный случай, когда обильная красочная графика себя оправдывает, так как продукт должен возбудить чувства человека, который просматривает его и заставить человека совершить действия положительного характера по отношения нему. Это всё подробности психологии рекламы, так как промо-сайт это по своей сути и есть реклама — рекламный сайт.

Визуальное оформление всегда должно соответствовать одному важному правилу в веб-дизайне — лёгкости. Имеется в виду, не цветовая лёгкость, а сам размер применяемых графических элементов, если таковые используются, а они используются, даже если сайт имеет самый просто вид.

Вся графика, которая содержится на сайте, должна быть максимально оптимизирована, а соответственно иметь как можно меньший размер. Хоть современные Интернет-каналы имеют высокую скорость почти у каждого пользователя Интернет сегодня, это не означает, что можно плевать на вес сайта и грузить его страницы графикой до веса в 2-3 мегабайта.

Представьте, что если у вас только графических элементов дизайна будет на 2 Мб и прибавьте к этому вес изображений или флеш-плееров с видео, которые могут содержаться на сайте. Итого получится весьма высокая нагрузка, даже для высокой скорости Интернет-соединения.

Нужно, чтобы вся графика на сайте загружалась максимально быстро, и пользователь не наблюдал перед собой картину загрузки вашего сайта по частям. Всё визуальное оформление и графические элементы вашего сайта должны быть оптимизированы настолько хорошо, насколько это возможно.

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




Комментировать

captcha

Проверенные сайты



Новые отзывы о сайтах


Авторизация

Если у Вас нет учетной записи, зарегистрируйтесь

Напомнить пароль
Создание учётной записи
Напомнить пароль
Войти в личный кабинет