<commit_before>---
id: 587d778f367417b2b2512aac
title: Avoid Colorblindness Issues by Using Sufficient Contrast
challengeType: 0
videoUrl: ''
localeTitle: 'Избегайте недостаточной контрастности текста и фона, чтобы пользователю было легче их воспринимать'
---


## Description (Описание)
<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. Camper Cat обозначил выбранные цвета, используя <code>hsl()</code> CSS <code>hsl()</code> (которое означает оттенок, насыщенность, освещенность). Вы можете легко отрегулировать яркость цвета всего лишь изменив третий аргумент. Увеличьте значение светочувствительности <code>background-color</code> с 35% до 55% и уменьшите значение <code>color</code> яркости от 20% до 15%. Это улучшит контрастность до 5.9: 1. </section>

## Tests (Тесты)<commit_msg>Fixed a few words for the Russian translation. (#33421)<commit_after>---
id: 587d778f367417b2b2512aac
title: Avoid Colorblindness Issues by Using Sufficient Contrast
challengeType: 0
videoUrl: ''
localeTitle: 'Избегайте недостаточной контрастности текста и фона, чтобы пользователю было легче их воспринимать'
---

## Description
<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>

## Tests (Тесты)
{'fraction_non_alphanumeric': 0.06089127929312332, 'fraction_numerical': 0.0155589704187476, 'mean_word_length': 5.961229946524064, 'pattern_counts': {'":': 0, '<': 39, '<?xml version=': 0, '>': 39, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5838054', 'n_tokens_mistral': 2024, 'n_tokens_neox': 2396, 'n_words': 628}