Проблема доступности при наведении мышки с помощью инструмента NVDA

Question

Я использовал инструмент NVDA для выявления проблем с доступностью на HTML-странице. Я получаю проблему, когда подсказка не читается.

<span class="icon-interface-question-mark" title="Click for Info" (click)="showAdditionalInfo()">

Я добавил атрибут заголовка, чтобы исправить проблему. Но это не работает. Пожалуйста, предложите.

Answer 1

Если это единственный код для всплывающей подсказки, фокус клавиатуры не будет перемещен на нее. Вам нужно tabindex="0" чтобы позволить пользователю клавиатуры перейти на него.

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

Взгляните на (еще не завершенный) шаблон дизайна всплывающей подсказки в "WAI-ARIA Authoring Practices 1.1".

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