Встроенное увеличение в браузере
Любой браузер умеет увеличивать страницу. Увеличьте её вдвое и посмотрите, не обрезается ли текст, не перекрывают ли друг друга блоки и не пропадает ли меню.
Инструменты
Инструменты
Для первой проверки доступности не нужны платные программы и особая подготовка. Почти всё необходимое уже есть в вашем браузере, компьютере и телефоне. Если знать, где это включается, за полчаса можно найти большинство очевидных помех на своей странице.
Самый честный тест — попробовать воспользоваться сайтом так, как пользуются им другие: без мыши, с крупным шрифтом или на слух.
Как устроен раздел: мы описываем виды помощников, а не конкретные программы и расширения. Названия пунктов меню отличаются от устройства к устройству, но сами возможности есть почти в любой современной системе и браузере.
Что пригодится
Небольшой набор, которого хватает, чтобы оценить сайт глазами разных посетителей.
Клавиатура
Клавиша табуляции переводит фокус вперёд, вместе с клавишей смены регистра — назад, клавиша ввода нажимает ссылку или кнопку. Если без мыши что-то недоступно, это заметят многие.
Режим высокой контрастности системы
В настройках специальных возможностей компьютера и телефона есть режим высокой контрастности. Включите его и проверьте, не исчезли ли значки, рамки полей и границы кнопок.
Встроенный экранный диктор
В телефонах и компьютерах есть встроенная функция, которая читает экран вслух. Послушайте свою главную страницу: понятны ли ссылки, описаны ли картинки, озвучиваются ли кнопки.
Проверка контраста цветов
Существует немало проверок, которые по двум цветам показывают коэффициент контраста. Сверяйте результат с порогами WCAG: 4,5:1 для обычного текста и 3:1 для крупного.
Валидатор разметки
Проверка разметки показывает незакрытые элементы, повторяющиеся идентификаторы и другие ошибки, из-за которых вспомогательные программы понимают страницу неверно.
Читайте также
- Инструкции
Пошаговые инструкции: как сделать текст читаемым, страницу — понятной по заголовкам, а форму обратной связи — удобной для всех. Здесь же каталог публикаций.
- Если не работает
Что делать, если не видно фокуса, текст не помещается при увеличении, кнопка без надписи, ошибки формы непонятны или видео идёт без субтитров.
- Сравнения
Уровни соответствия A, AA и AAA; альтернативный текст, подпись и расшифровка; субтитры, расшифровка и сурдоперевод — в сравнительных таблицах.
- Словарь
Словарь терминов: доступность, WCAG, ГОСТ Р 52872-2019, контраст, альтернативный текст, фокус, экранный диктор, субтитры и простой язык.
- Риски
Ловушки доступности: непроходимая капча, исчезающие сообщения, мигание, короткие таймауты, сканы вместо текста и «оверлеи», обещающие исправить всё сразу.
Источники
- W3C — рекомендации WCAG 2.2
- ГОСТ Р 52872-2019
- Редакционные материалы справочника Wpget
Сведения изложены общими словами на дату подготовки. Рекомендации, браузеры и привычки читателей постепенно меняются, поэтому в спорных случаях сверяйтесь с первоисточниками: текстом рекомендаций WCAG и действующим ГОСТ Р 52872-2019.