Перевела некоторые рекомендации из статьи про доступность интерфейсов
🔸 Думайте сверху вниз и слева направо
Именно в такой последовательности специальные программы помогают незрячим людям считывать текст в интерфейсе. Они воспроизводят контент последовательно, произнося отдельно каждую строку или элемент. Поэтому незрячим людям сложно сразу воспринять полную картинку экрана или даже отдельного блока.
Это важно учитывать, например, при добавлении в интерфейс пояснений или инструкций. Возьмем поле для создания пароля. Часто под ним указаны требования: число символов, нужны ли цифры или специальные знаки. Незрячий человек не сразу узнает про эти инструкции. Сначала программа сообщит ему, что это поле для пароля, потом он введет какой-то пароль и, возможно, столкнется с ошибкой. Поэтому все важные инструкции и пояснения стоит размещать над полем, а не после него.
🔸 Закройте глаза и произнесите, что написали
Иногда текст очень зависим от контекста или иллюстрации, которой он сопровождается. Например, empty state с текстом вроде: здесь так тихо… Поймет ли незрячий человек, услышав эту фразу, о чем вообще идет речь? Скорее всего, нет.
А бывает, что редактор и вовсе отказывается от текста в пользу визуального элемента. На странице успеха может быть просто зеленая галочка или веселый смайлик. В таком случае незрячему пользователю будет сложно понять, удалось ли ему достигнуть цели. Поэтому так важно представлять, как текст работает вне визуального контекста.
🔸 Предлагайте письменную альтернативу каждой иконке и картинке
Программы, которыми пользуются незрячие люди, сами по себе картинки считывать не умеют, но здесь на помощь приходит так называемый alt-текст. Это часть кода, которая не отображается на экране, но программа ее видит и воспроизводит.
Такие тексты должны быть краткими, но не сухими и формальными. Мало написать, например, просто «мужчина», «кот», «небо». Описания должны передавать настроение и эмоции — то есть выполнять ровно ту же функцию, что и для зрячих.
Важный момент: если речь об иконках, в описании учитывайте их функцию, а не форму. Например, иконку с домиком будет корректно подписать домашней страницей, а шестеренку — настройками.
