Responsive Web Design: Improved translate Avoid Colorblindness Issues by Using Sufficient Contrast (#19641)
This commit is contained in:
@ -7,7 +7,7 @@ localeTitle: 'Избегайте проблем со слепотой, испо
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> Цвет - большая часть визуального дизайна, но его использование представляет две проблемы доступности. Во-первых, цвет сам по себе не должен использоваться как единственный способ передачи важной информации, потому что пользователи экранного чтения не видят этого. Во-вторых, цвета переднего и заднего фона требуют достаточного контраста, чтобы пользователи цветного следа могли различать их. Предыдущие проблемы охватывали наличие текстовых альтернатив для решения первой проблемы. Последняя задача заключалась в инструментах проверки контраста, чтобы помочь во втором. Контрастность, рекомендованная WCAG, равная 4,5: 1, применяется для использования цвета, а также для комбинаций по шкале серого. Пользователи Colorblind не могут отличить некоторые цвета от других - обычно в оттенке, но иногда и в легкости. Вы можете вспомнить, что коэффициент контрастности рассчитывается с использованием значений относительной яркости (или яркости) цветов переднего плана и фона. На практике соотношение 4,5: 1 может быть достигнуто путем затемнения более темного цвета и облегчения более легкого с помощью анализатора цветного контраста. Более темные цвета на цветном колесе считаются блюзом, фиалки, пурпуры и красные, тогда как более светлые цвета - апельсины, желтые, зеленые и сине-зеленые. </section>
|
||||
<section id="description"> Цвет - большая часть визуального дизайна, но его использование представляет две проблемы доступности. Во-первых, цвет сам по себе не должен использоваться как единственный способ передачи важной информации, потому что пользователи экранного чтения не видят этого. Во-вторых, цвета переднего и заднего фона требуют достаточного контраста, чтобы пользователи, имеющие проблемы с различием цветов, могли различать их. Предыдущие проблемы охватывали наличие текстовых альтернатив для решения первой проблемы. Последняя задача заключалась в инструментах проверки контраста, чтобы помочь во втором. Контрастность, рекомендованная WCAG, равная 4,5: 1, применяется для использования цвета, а также для комбинаций по шкале серого. Пользователи, страдающие дальтонизмом, не могут отличить некоторые цвета от других - обычно в оттенке, но иногда и в легкости. Вы можете вспомнить, что коэффициент контрастности рассчитывается с использованием значений относительной яркости (или яркости) цветов переднего плана и фона. На практике соотношение 4,5: 1 может быть достигнуто путем затемнения более темного цвета и облегчения более легкого с помощью анализатора цветного контраста. Более темными цветами на цветном колесе считаются синий, фиолетовый, пурпурный и красный, тогда как более светлыми цветами - оранжевый, желтый, зеленый и сине-зеленый. </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> Camper Cat экспериментирует с использованием цвета для текста своего блога и фона, но его текущая комбинация зеленоватого <code>background-color</code> с <code>color</code> текстом в темно-коричневом <code>color</code> имеет коэффициент контрастности 2,5: 1. Вы можете легко регулировать яркость цветов, так как он объявил их, используя <code>hsl()</code> CSS <code>hsl()</code> (которое означает оттенок, насыщенность, легкость), изменив третий аргумент. Увеличьте значение светочувствительности <code>background-color</code> с 35% до 55% и уменьшите значение <code>color</code> яркости от 20% до 15%. Это улучшает контрастность до 5.9: 1. </section>
|
||||
|
Reference in New Issue
Block a user