Перемещение курсора в программе чтения с экрана

Задний план

У меня есть сайт, на котором есть типичный дизайн с подробным описанием. Основное представление - это столбчатая диаграмма, в которой щелчок по одному из столбцов (каждый столбец представляет один месяц) изменяет подробное представление (которое представляет собой вложенную таблицу, в которой перечислены некоторые сведения за этот период). Я начал аудит доступности, и как вы понимаете, он не очень доступен. Я решил диаграмму, добавив aria-hidden="true" и добавив невидимую таблицу с тем же содержимым с кнопками в строках месяца. Теперь активация кнопок будет делать то же самое, что и щелчок по столбцам диаграммы - изменить представление подробностей.

Перемещение фокуса

Когда нажимается кнопка в таблице в главном представлении, моя программа чтения с экрана (в данном случае VoiceOver Safari) читает «Кнопка нажата», но затем использование клавиш курсора продолжает читать таблицу. Я предполагаю, что пользователь, когда он решит, какую кнопку нажать, хотел бы прочитать подробное представление, и поэтому я хотел бы переместить его туда.

Что я пробовал

Я изменил кнопки на <a href="#detail-view" ng-click="loadDetail"> и присвоил div контейнера подробных представлений id="detail-view". Похоже, это ничего не делает.


javascript html angularjs accessibility voiceover
person Jakub Hampl    schedule 10.08.2015    source источник
comment
Отправка фокуса в подробное представление с использованием href, как вы описали, должна позволить программе чтения с экрана двигаться вперед из нового местоположения. И ссылка - хороший способ сделать это, поскольку люди ожидают, что она приведет их в новое место. Когда вы говорите, что это не работает, не могли бы вы уточнить, что происходит?   -  person stringy    schedule 11.08.2015
comment
@stringy «Моя программа чтения с экрана (в данном случае VoiceOver Safari) читает« Кнопка нажата », но затем при использовании клавиш курсора продолжается чтение таблицы», - вот что происходит. То есть SR просто подтверждает, что ссылка или кнопка была нажата, но затем продолжает чтение в текущей позиции в таблице.   -  person Jakub Hampl    schedule 13.08.2015

Ответы (1)


arrow_upward
1
arrow_downward

Простой ответ: не надо. Смещение внимания к незрячему пользователю на самом деле является нарушением доступности. См. Критерии WCAG 3.2.2.

Короче говоря, вы не должны инициировать изменение контекста автоматически после нажатия кнопки или другого управляющего взаимодействия. Что вам следует сделать, так это сообщить пользователю о новом содержимом либо объявлением, либо описанием изменения в тексте доступности самого элемента управления. Примером предоставления этого контекста может быть объявление ваших основных ячеек как «вкладок». Простая ассоциация кнопки с вкладкой дает много информации!

Чтобы сделать ваше приложение более доступным, вы должны убедиться, что пользователь знает, что он находится в элементе управления типа master-detail, предоставив правильную информацию о ролях (я нахожу здесь, скорее всего, «вкладку», но могут быть применимы и другие роли). Кроме того, укажите заголовок в верхней части основного представления и подробного представления, чтобы они могли легко перемещаться между ними. Пока они знают, где находятся, и могут легко переходить к важным областям страницы, с ними все в порядке. Автоматическое смещение фокуса на самом деле является нарушением доступности, и его следует избегать.

person ChrisCM    schedule 11.08.2015
comment
Интересно, однако, если бы это была традиционная веб-страница, нажатие на ссылку вызвало бы перезагрузку и, следовательно, сдвиг контекста. Так ясно, что, щелкнув ссылку, вы ожидаете, что что-то произойдет, не так ли? - person Jakub Hampl; 13.08.2015
comment
В качестве отступления: критерий 3.2.2 WCAG касается «изменения настройки любого компонента пользовательского интерфейса», то есть переключателя или флажка. На этой странице поясняется, что «установка флажка , ввод текста в текстовое поле или изменение выбранного параметра в элементе управления списком изменяет его настройку, но активация ссылки или кнопки - нет ». - person Jakub Hampl; 13.08.2015
comment
Загрузка ссылки - это не то же самое, что нажатие на кнопку. Когда загружается новая страница, вы ожидаете, что фокус сместится на начало нового содержимого. Это сильно отличается от выбора пользователем кнопки (не вкладки или ссылки) и случайного смещения фокуса. Тот факт, что элемент управления работает как вкладка, является важной информацией. Элемент управления с ролью кнопки никогда не должен инициировать изменение контекста без предупреждения. Добавление роли вкладки или ссылки предполагает это изменение контекста, и это совсем другой сценарий. - person ChrisCM; 13.08.2015
comment
Далее на этой странице вы также увидите список вещей, которые составляют изменение контекста. Изменения в контексте включают изменения: агента пользователя; область просмотра; фокус; контент, изменяющий смысл веб-страницы. Распространение этого поведения на кнопки может быть наилучшей практикой, а не чистым нарушением, но я поддерживаю решение. Информирование пользователя о том, что элемент управления ведет себя как вкладка, и добавление заголовков более доступны и проще в реализации, чем смещение фокуса. - person ChrisCM; 13.08.2015
comment
Вы также можете, согласно этой логике, указать это как нарушение 4.1.2, что может быть более применимо. - person ChrisCM; 13.08.2015