вкладки роли арии со стрелками

Question

вкладки роли арии со стрелками

1

WCAG имеет отличный дизайн для реализации вкладок с Tabpanels здесь

Он использует "индекс ровинговой вкладки" и клавиши со стрелками клавиатуры для перехода между вкладками. Это отлично работает, но я недавно получил запрос на создание виджета tab/tabpanel, который отображает только одну вкладку за раз, и имеет кнопки "предыдущий" и "следующий", чтобы перебирать вкладки.

Визуально кнопки со стрелками расположены с обеих сторон активной вкладки. Но с точки зрения табуляции в шаблоне проектирования WCAG указано, что вкладка, связанная с активной вкладкой, должна следовать за ней в порядке табуляции.

Будет ли это нарушать какие-либо правила доступности, чтобы добавить эти новые кнопки навигации стрелки к виджету, если я уверяю, что их порядок вкладок до или после вкладки/вкладки? Я полагаю, что функциональность клавиатуры может оставаться такой, какой она есть в настоящее время (с помощью клавиш со стрелками для переключения между вкладками)

slopps 16 июнь 2018, в 05:10

Источник

Теги:

javascript

html5

accessibility

wai-aria

web-accessibility

1 ответ

Ещё вопросы

QuentinC · Accepted Answer · 2018-06-16T02-29-00.000Z

Я слепой читатель экрана. Я бы сохранил клавиши со стрелками влево/вправо, чтобы перемещаться по вкладкам, как обычно, и не делайте кнопки со стрелками фокусируемыми вообще.

Мое рассуждение заключается в следующем:

Ваши кнопки со стрелками управляют прокруткой и прокруткой - это чистый визуальный материал
Обычно, как пользователь экрана, у нас нет доступа клавиатуры к кнопкам в полосах прокрутки. Это совершенно прозрачно для нас.

Например, если вы используете многострочную текстовую область, стрелка вниз всегда переходит к следующей строке, независимо от того, находится ли курсор в нижней части экрана. У нас нет ничего особенного, и особенно нам не нужно вручную нажимать кнопку со стрелкой вниз на полосе прокрутки. Курсор переходит к следующей строке, и текстовое содержимое автоматически прокручивается на одну строку вниз, если необходимо.

То же самое происходит для элемента управления вкладкой, если слишком много вкладок для одной строки. В этом случае в популярных настольных библиотеках графического интерфейса вы можете отображать кнопки со стрелками со стрелками или делать вкладки spand несколькими строками. Он никогда не меняет способ навигации: клавиши со стрелками влево и вправо всегда идут на следующую или предыдущую вкладку, независимо от того, что должно происходить визуально.

Как бонус, обычно, когда вы нажимаете кнопку кнопки прокрутки, фокус не переходит к кнопке; он немедленно возвращается к реальному контенту, то есть к тексту в текстовой области, или к текущей активной вкладке для элемента управления вкладкой. Это одно или несколько подтверждений того, что кнопки прокрутки не должны вводиться в порядке вкладок.

В качестве другого бонуса, учитывая, что вы сами используете кнопки прокрутки, вы также должны реагировать на колесико мыши.

Это отличная информация, спасибо, что нашли время! Я подумал, сработает ли просто сделать кнопки со стрелками не сфокусированными. Простое, элегантное решение. Еще раз спасибо!