Как я узнаю, как пользователи видят цвета при разработке сайта?


11

Как я узнаю, как пользователи видят цвета при разработке сайта? Я вижу цвета веб-сайта не так, как на моем компьютере Macbook и Windows / ноутбуке. Особенно я не вижу светлых цветов на рабочем столе, например, серые границы таблиц не видны.

О чем мне следует заботиться при разработке? Могу ли я сделать все экраны очень похожими с дизайнерским решением?


Связанные и возможные дубликаты: graphicdesign.stackexchange.com/questions/94401/…
Винсент

1
И просто чтобы добавить к путанице, почти 10% людей страдают от слепоты - но, по крайней мере, благодаря тому, что есть расширения для Chrome, по крайней мере, которые позволяют (предположим, что нет) примерно увидеть, как это будет выглядеть для того, кто ...
Rycochet

... а на уровне предприятия гамма / контрастность + другие параметры экрана могут быть повсеместно на мониторах в офисе (на вашем клиенте) в ситуации, когда они установлены ИТ-специалистами, которые часто используют параметры удаленного доступа и групп для управления сетями ПК. В моей последней компании ИТ находились в другой стране, и мне было мало симпатий к дизайну - я получил доступ администратора и добавил свой собственный монитор и настройки! Работать в соответствии со стандартами и избегать крайностей - лучший подход, отмечая, что некоторые клиенты (например, государственные) будут иметь строгий доступ - попросите об этом
заранее,

Ответы:


23

Краткий ответ: нет.

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

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

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


8
Интересно, читают ли эти принципы эти принципы? У меня довольно хорошее зрение, но контраст между фоном и цветом подсветки ссылок на многих сайтах SE (включая этот) плохой.
Бармар

1
Хотелось бы, чтобы я проголосовал за это не раз! Я сам использую расширение для браузера темного читателя, поэтому, независимо от того, насколько хорош ваш сайт, я полностью уничтожу его ради того, чтобы в пятьдесят лет у меня было приличное зрение!
PieBie

Согласно этому веб-сайту webaim.org/resources/contrastchecker , цветовой контраст между фоном и ссылками не соответствует стандартам доступности на этом сайте SE. Так что, вероятно, можно предположить, что люди из SE не читают такие рекомендации
ESR

2

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

sRGB - это всемирное стандартное цветовое пространство для воспроизведения цвета в Интернете.

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


И откалибруйте свои дисплеи для sRGB, так что по крайней мере ваши дисплеи показывают, как это должно быть
joojaa

Комментарии не для расширенного обсуждения; этот разговор был перенесен в чат .
Винсент

1

Современные браузеры и компьютеры сегодня редко имеют проблемы с отображением правильных цветов (см. Https://websafecolors.info/learn для получения дополнительной информации об этом).

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

Я бы порекомендовал использовать Inspect Element и посмотреть на шестнадцатеричный код цветов на каждой платформе. Если они идентичны, то вы знаете, что это дисплеи. Решение будет состоять в том, чтобы использовать цвета с большей контрастностью друг к другу, чтобы у них был больше шансов выделиться на всех экранах. В качестве альтернативы, попробуйте более толстые границы или даже мягкие столы без полей! У большинства пользователей есть экраны высокой четкости, которые открывают широкие возможности для оформления таблиц, в которых обычно используется текст и форматирование с толщиной в пиксели.


0

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

background-color: #D2B48C

2
Привет, Салли, я исправила шрифт в твоем ответе, но я точно не знаю, как это ответ на вопрос. Не могли бы вы уточнить?
PieBie

Это не решает актуальную проблему. Проблема в том, что на разных мониторах #D2B48C будет выглядеть по-разному, и вопрос в том, как это решить.
труба
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.