Как противопоставить цвета фона и переднего плана в веб-дизайне

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

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

Сильные Контрасты

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

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

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

Стандарты брендинга и контрастные цвета

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

Что означают разные цвета для художников-графиков?

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

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

Онлайн инструменты

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

Кроме того, думая о выборе цвета, вы также должны учитывать доступность веб-сайта и людей, которые имеют формы дальтонизма. В этом может помочь WebAIM.org, а также ContrastChecker.com, который проверит ваш выбор на соответствие рекомендациям по доступности веб-контента.

Ссылка на основную публикацию