Специальные возможности: почему меню Jquery явно устанавливает пункт меню tabindex равным -1?

0

Мне было интересно, может ли кто-нибудь объяснить мне, с точки зрения доступа, логика, явно указывающая пункт меню, привязывает индекс вкладки -1. Я хочу, чтобы мои пункты меню указали вкладку 0, потому что их естественный порядок - это тот порядок, который я хочу. Существуют ли какие-либо недостатки в этой стратегии?

Теги:
accessibility

5 ответов

2
Лучший ответ

tabindex="-1" выводит его из порядка, НО позволяет перемещать фокус клавиатуры там скриптом.

Меню jQuery является примером виджета меню WAI-ARIA, который имеет заданное взаимодействие с клавиатурой.

Вкратце, меню должно быть одним табу-стопом в порядке табуляции, а затем вы используете клавиши со стрелками для навигации по меню. Вот почему -1 является полезным значением, вы можете -1 движение фокуса клавиатуры с помощью клавиш со стрелками. Использование 0 приведет к нарушению модели взаимодействия, поэтому я бы не использовал меню jQuery, если вы хотите изменить его таким образом.

Я нашел в тестировании юзабилити, что мало кто знает об этом взаимодействии (т.е. Застревает), по крайней мере, для "стандартных" сайтов, которые в основном довольны одним виджем WAI-ARIA. Это отличается от таких вещей, как gmail, где люди (могут) ожидают больше опыта, подобного приложениям.

Если вы ищете меню в навигации по сайту, я бы рекомендовал мега-меню Adobe OS, в котором используется сочетание стандартных скриптов и нескольких атрибутов ARIA, чтобы обеспечить отличный опыт для обычных веб-сайтов.

  • 0
    Это именно то, что я искал. Мне нужно придерживаться стандарта WCAG 2.0, и этот ответ позволяет мне понять, какова цель модели взаимодействия. Спасибо!
1

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

Вот подробное описание доступного меню, касающееся как атрибутов WAI-ARIA, так и tabindex: Рекомендуемая реализация WAI-ARIA для панели навигации/меню

1

Команда jQueryUI в последнее время приложила много усилий для доступа, а виджет вкладки - клавиатура:

клавиатура

  • Когда фокус находится на вкладке:
    • UP/LEFT - перемещение фокуса на предыдущую вкладку. Если на первой вкладке перемещается фокус на последнюю вкладку. Активируйте сфокусированную вкладку после короткой задержки.
    • DOWN/RIGHT - переместить фокус на следующую вкладку. Если на последней вкладке перемещается фокус на первую вкладку. Активируйте сфокусированную вкладку после короткой задержки.
    • HOME - перемещение фокуса на первую вкладку. Активируйте сфокусированную вкладку после короткой задержки.
    • END - переместить фокус на последнюю вкладку. Активируйте сфокусированную вкладку после короткой задержки.
    • SPACE - активировать панель, связанную с целенаправленной вкладкой.
    • ENTER - активировать или переключить панель, связанную с целенаправленной вкладкой.
    • ALT + PAGE UP - перемещение фокуса на предыдущую вкладку и немедленное включение.
    • ALT + PAGE DOWN - переместить фокус на следующую вкладку и сразу активировать.
  • Когда фокус находится в панели:
    • CTRL + UP - перемещение фокуса в соответствующую вкладку.
    • ALT + PAGE UP - перемещение фокуса на предыдущую вкладку и немедленное включение.
    • ALT + PAGE DOWN - переместить фокус на следующую вкладку и сразу активировать.

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

0

Для исключения элемента из правила табуляции используется табуиндекс -1.

пример

<input type="text" tabindex="1" />
<input type="text" tabindex="2" />
<input type="text" tabindex="-1" />
<input type="text" tabindex="3" />

См. Эту скрипку для примера

Хорошо использовать это. См. Спецификацию W3C HTML5:

Если значение представляет собой отрицательное целое число

Пользовательский агент должен установить флаг фокусировки tabindex элемента, но не должен позволять достигать элемента с помощью последовательной навигации по фокусу.

Я бы сказал, что (с точки зрения доступности) этот подход имеет наибольший смысл, когда:

  • Вы не хотите, чтобы доступ к меню можно было использовать с клавиатуры

или

  • Вы не знаете, в какой среде будет использоваться ваш код (меню jQuery может оказаться ниже форм, поля которых уже покрывают определенные значения tabindex, поэтому они не могли просто установить tabindex на что-либо действительно)

Что касается вашего вопроса об использовании "0" в качестве tabindex:

В спецификации HTML говорится:

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

Это означает, что вы можете использовать любое значение, отличное от 0, до тех пор, пока все элементы, на которые вы хотите дать естественный порядок вкладок, имеют одинаковый tabindex.

0

Это не позволяет элементу быть частью последовательного фокуса навигации. Лучше предположить, что это не элемент, достойный вклада, а затем установить индекс, который был бы нежелательным при неправильном выполнении.

Даже для сценария поля readonly, которое показывает сумму вычислений. Если у пользователя есть вкладка для каждой записи, им не нужно дважды вставлять вкладку, чтобы обойти поле только для чтения

Ещё вопросы

Сообщество Overcoder
Наверх
Меню