Каким должен быть сайт для людей с ограниченными возможностями?

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

В отчете Всемирной организации здравоохранения, указанно, что около 2,2 миллиардов человек в мире - слепы или имеют нарушения зрения.

Среди них:

• близорукость, дальнозоркость или астигматизм – 88,4 миллиона человек;
• катарактой – 94 миллиона;
• глаукомой – 7,7 миллиона;
• помутнением роговицы – 4,2 миллиона;
• иные нарушения работы глаз при которых человек не может рассмотреть небольшие предметы на близком расстоянии – 826 миллионов человек.

 

В этой статье мы расскажем как сделать сайт дружелюбнее к людям с такими проблемами.

Особенности просмотра сайта людьми с нарушениями зрения

Выделяем общие моменты характерные для слабовидящих:

• Не любят сайты с мелким шрифтом, маленькими межбуквенными и межстрочными интервалами, низкой контрастностью;
• Разные блоки со схожими цветами, расположенные рядом друг с другом воспринимают, как одно и тоже;
• Не воспринимают инфографику с большим количеством цветов;
• Нуждаются в подсказках по состоянию кнопок (обводка, значок).
  
  

• Люди с дальтонизмом плохо различают некоторые цвета и их сочетания.

Например:

	Красный+Зеленый			Зеленый+Коричневый
	Голубой+Пурпурный			Светло-зеленый+Желтый
	Зеленый+Серый			Зеленый+Голубой
	Зеленый+Черный			Голубой+Серый

Сайт по ГОСТу

1 апреля 2020 года был введен в действие ГОСТ Р 52872-2019 в котором были перечислены требования доступности для людей с инвалидностью и других лиц с ограничениями жизнедеятельности.

Для сайтов госорганов и организаций нормы ГОСТа — обязательны к исполнению.

Если кратко изложить нормы ГОСТа, то:

• Текст и изображения должны быть контрастными. Не менее 4.5: 1, если 1: 1 — это полное отсутствие контраста (например, красный текст на красном фоне), а 21: 1 — это максимальный уровень контраста (например, белый текст на черном фоне).
• Не нужно часто использовать тонкие плохо заметные обводки (маленький контраст, эффект свечения и т.д.) на текстовых элементах.
• Обязательно должна быть возможность увеличить текст до 200%, изменить размеры межбуквенного и межстрочного интервала.
• У всех изображений, графиков и иного нетекстового контента должен быть заполнен атрибут alt, что бы можно было понять, что изображено на картинке без самой картинки.
• У pdf-вложений которые не подготовлены для людей с особенностями зрения, должны быть их текстовые аналоги.
• Не нужно использовать фреймы.
• Элементы сайта должны отличаться не только цветом, но и какими-нибудь иными способами.