Каким должен быть сайт для людей с ограниченными возможностями?
В основном при разработке дизайна сайта главенствующую роль занимают понятия эстетики и юзабилити. Однако не стоит забывать о важной группе посетителей сайта с особенностями органов зрения.
В отчете Всемирной организации здравоохранения, указанно, что около 2,2 миллиардов человек в мире - слепы или имеют нарушения зрения.
Среди них:
- близорукость, дальнозоркость или астигматизм – 88,4 миллиона человек;
- катарактой – 94 миллиона;
- глаукомой – 7,7 миллиона;
- помутнением роговицы – 4,2 миллиона;
- иные нарушения работы глаз при которых человек не может рассмотреть небольшие предметы на близком расстоянии – 826 миллионов человек.
В этой статье мы расскажем как сделать сайт дружелюбнее к людям с такими проблемами.
Особенности просмотра сайта людьми с нарушениями зрения
Выделяем общие моменты характерные для слабовидящих:
- Не любят сайты с мелким шрифтом, маленькими межбуквенными и межстрочными интервалами, низкой контрастностью;
- Разные блоки со схожими цветами, расположенные рядом друг с другом воспринимают, как одно и тоже;
- Не воспринимают инфографику с большим количеством цветов;
- Нуждаются в подсказках по состоянию кнопок (обводка, значок).
- Люди с дальтонизмом плохо различают некоторые цвета и их сочетания.
Например:
![]() |
Красный+Зеленый | ![]() |
Зеленый+Коричневый | |
![]() |
Голубой+Пурпурный | ![]() |
Светло-зеленый+Желтый | |
![]() |
Зеленый+Серый | ![]() |
Зеленый+Голубой | |
![]() |
Зеленый+Черный | ![]() |
Голубой+Серый |
Сайт по ГОСТу
1 апреля 2020 года был введен в действие ГОСТ Р 52872-2019 в котором были перечислены требования доступности для людей с инвалидностью и других лиц с ограничениями жизнедеятельности.
Для сайтов госорганов и организаций нормы ГОСТа — обязательны к исполнению.
Если кратко изложить нормы ГОСТа, то:
- Текст и изображения должны быть контрастными. Не менее 4.5: 1, если 1: 1 — это полное отсутствие контраста (например, красный текст на красном фоне), а 21: 1 — это максимальный уровень контраста (например, белый текст на черном фоне).
- Не нужно часто использовать тонкие плохо заметные обводки (маленький контраст, эффект свечения и т.д.) на текстовых элементах.
- Обязательно должна быть возможность увеличить текст до 200%, изменить размеры межбуквенного и межстрочного интервала.
- У всех изображений, графиков и иного нетекстового контента должен быть заполнен атрибут alt, что бы можно было понять, что изображено на картинке без самой картинки.
- У pdf-вложений которые не подготовлены для людей с особенностями зрения, должны быть их текстовые аналоги.
- Не нужно использовать фреймы.
- Элементы сайта должны отличаться не только цветом, но и какими-нибудь иными способами.