Главное Авторские колонки Вакансии Образование
1 109 0 В избр. Сохранено
Авторизуйтесь
Вход с паролем

​Какие оттенки цветов подходят друг другу? Какие цвета сочетаются на сайтах гармонично?

Покажем, как правильно воздействовать на подсознание ваших покупателей через дизайн сайта.
Мнение автора может не совпадать с мнением редакции

Начнем с суровой и неумолимой статистики: свыше 50% покупателей никогда не вернутся на сайт, который не понравился им визуально.

Иногда клиент сразу знает, чего хочет. И мы в А25 просто помогаем ему реализовать техническую сторону его нового сайта или магазина. Но иногда клиент хочет "красиво". И тут могут начинаться долгие диалоги с клиентами, мучительно определяющихся с цветом нового элемента на странице, цветом шрифта у заголовков или дизайном нового сайта. Все вот эти "давай зеленый покраснее сделаем, может?" или "на желтом сайте фиолетовый отлично смотрелся, давайте на наш красный сайт тоже этот цвет возьмем. А или оба сразу?". Наткнулись тут на Design Seeds, публикующих гармоничные сочетания цветов. Дополнили их примерами того, как эти сочетания цветов могут быть реализовано на сайте. Советы не универсальные, но будут полезны тем, кто продумываетцветовую концепцию будущего сайта.

1. цвета бонсай

sochetaniya_cvetov_dlya_sai_ta.jpg

Пример сайта:

snimok_ekrana_2016-07-26_v_16_33_05.png

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

2. aboard color

sochetaniya_cvetov_ottenki_sinego.jpg

Пример дизайна сайта с использованием этих цветов:

snimok_ekrana_2016-07-26_v_16_48_30.png

Данные оттенки идеально подходят для компаний, имеющих отношение к воде или морю: туристические сайты, сайты морских круизов и экскурсий, сайты рыболовных баз, морской автотранспорт и т.д. Скриншот выше сделан с сайта рыболовной базы Верхнелебяжье.

3. swimmingly color

j4rptvkzaaa.jpg

Пример сайта:

snimok_ekrana_2016-07-26_v_16_59_35.png

Интернет-агентство "МК-Периодика" использует яркие блоки, чередующиеся с блоками нейтрального белого цвета.

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

snimok_ekrana_2016-07-26_v_17_15_36.png

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

snimok_ekrana_2016-07-26_v_17_09_10.png

4. цвета spring

sochetanie_cvetov_dlya_sai_ta_fioletovyi

Пример сайта:

snimok_ekrana_2016-07-26_v_17_06_44.png

лендинг парковок во Внуково.

5. матовая яркость (серый, голубой, красный, желтый, фиолетовый)

sochetanie_cvetom_dlya_sai_ta.jpg

Пример сайта:

snimok_ekrana_2016-07-26_v_17_24_47.png

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

6. Сочетание матовых цветов "от зеленого к розовому"

sochetanie_cvetov_dlya_bannerov_a25_ru.j

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

Пример сайта - сайт компании по ремонту деталей пневмоподвески AirBarter:

snimok_ekrana_2016-07-26_v_17_31_58.png

Немного статистики: свыше 50% покупателей никогда не вернутся на сайт, который не понравился им визуально. Но это не повод забывать о хорошем контенте, ярких заголовках и юзабилити! Успешных проектов и красивых сайтов!

Сочетания цветов для сайтов и магазинов

+1
В избр. Сохранено
Авторизуйтесь
Вход с паролем
Комментарии
Выбрать файл
Блог проекта
Расскажите историю о создании или развитии проекта, поиске команды, проблемах и решениях
Написать
Личный блог
Продвигайте свои услуги или личный бренд через интересные кейсы и статьи
Написать

Spark использует cookie-файлы. С их помощью мы улучшаем работу нашего сайта и ваше взаимодействие с ним.