5.3: Тест навігації клавішею Tab

Last updated
Save as PDF

Page ID: 103507

\( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \) \( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)\(\newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\) \( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\) \( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\) \( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\) \( \newcommand{\Span}{\mathrm{span}}\) \(\newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\) \( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\) \( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\) \( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\) \( \newcommand{\Span}{\mathrm{span}}\)

Тест навігації клавішею Tab часто використовується з тестом «Вибрати все» (розглянуто на наступній сторінці), щоб підтвердити, чи не були вибрані елементи клавіатури працездатними, але цей тест також може бути використаний самостійно. Помістіть курсор на самому початку HTML-вмісту (іноді складно), або в поле розташування браузера або адресному рядку, після чого натисніть клавішу Tab кілька разів і спостерігайте, як курсор рухається по вмісту сторінки. Зробіть наступні зауваження:

Чи можете ви бачити область фокусування курсора під час переміщення по елементам сторінки? Якщо ні, це порушить настанови 2.4.7 Видимий фокус (рівень AA). Повідомляючи про проблему, рекомендуємо додати індикатор фокусування, щоб можна було візуально стежити за курсором під час його переміщення по сторінці.
Коли ви переміщаєтеся за допомогою клавіші Tab по елементам на сторінці, чи всі функціональні елементи, такі як посилання, кнопки або форми, отримують фокус? Якщо ні, ті елементи, які не отримують фокусу, будуть недоступні деяким людям, порушуючи Керівний принцип 2.1.1 Клавіатура (рівень A).

Технічні: Ці елементи часто призначені для користувача функції, побудовані з нестандартним HTML і JavaScript. У таких випадках ви можете рекомендувати використання стандартного HTML, де це можливо, або запропонувати розробнику додати фокус клавіатури для елемента, додавши tabindex="0" до HTML, і додати події клавіатури, крім існуючих подій миші, до програмування, яке керує функціональністю функції. .

Під час навігації за допомогою клавіші Tab по елементам сторінки, чи є шлях до цих елементів стандартною послідовністю зліва направо, зверху вниз? Якщо фокус курсора перескакує навколо, переміщаючись до місць на сторінці поза межами, де ви можете логічно очікувати, що курсор перейде, переглядаючи макет елементів на сторінці, це може порушити Настанова 2.4.3 Порядок фокусування (Level A). За замовчуванням порядок фокусування буде стандартним, тому у випадках, коли замовлення нерегулярне, це тому, що розробник навмисно змінив порядок. Ви можете порекомендувати видалити неправильну послідовність вкладок або налаштувати її так, щоб слідувати більш значущим шляхом.
Під час навігації за допомогою клавіші Tab через меню та інші функції, якими можна керувати за допомогою миші, чи працюють ці функції також за допомогою клавіатури? Якщо вони цього не зроблять, вони будуть недоступні для тих, хто використовує лише клавіатуру для переміщення веб-вмісту. На малюнку нижче підменю, що випадає при натисканні одного з основних елементів навігації, неможливо відкрити натисканням клавіші. Ці типи меню можуть використовувати клавіші зі стрілками для відкриття та навігації по підменю, або вони можуть працювати за допомогою клавіші Tab. Переважними є клавіші зі стрілками, хоча навігація клавішею Tab задовольнить критеріям успіху, пов'язаним з працездатністю клавіатури.

Для випадаючих меню, подібних до описаних у #4 вище, також стежте за тим, щоб навігація клавішею Tab переміщалася по пунктам підменю, але підміню не відкриваються. Це буде заплутаним для користувачів клавіатури з низьким зором, які стежать за індикатором фокусування, щоб відстежувати, де вони знаходяться на сторінці.

вказуючи на меню, для роботи якого потрібно клацання мишею

Малюнок: Сценарій, в якому меню функціонують лише клацанням миші (див. Льодяники Лулу)