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

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

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

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

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

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

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

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

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

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

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

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

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

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

background-color: #D2B48C