JAWS не читает арию-метки для диапазона внутри заголовка с арией меткой

Question

У меня есть промежуток, который служит в качестве кнопки, которая находится внутри заголовка:

<h3 aria-label="Header Aria Label"> 
 
    <span tabindex="0" aria-label="Span Aria Label">Button</span> 
 
</h3>

Однако, когда я на вкладке, он читает «Заголовок заголовка Арии». Как заставить JAWS читать арию-метку в промежутке?

Answer 1

A span не является ни ориентиром, ни интерактивным контентом. aria-label не будет читаться устройством чтения с экрана (и это правильно).

Вместо этого используйте элемент <button>. Это поможет решить вашу проблему и станет более доступным.

Answer 2

Прежде всего, пожалуйста, не обижайтесь, но то, что вы делаете, плохой дизайн, по крайней мере, с точки зрения доступности.
Кнопка внутри заголовка (не заголовок, BTW, в HTML 5 есть отдельный элемент <header>, который совсем не похож на <h3>, который вы используете здесь) - плохая идея. В самом деле.
Но в любом случае, если вы хотите JAWS для лечения вашего span как кнопки, либо:

1. Используйте родной <button> элемент или
2. Используйте role="button" на свой контекстуальный span, в противном случае JAWS не знаю, каким-либо образом что этот конкретный span следует рассматривать как кнопку. Но, пожалуйста, предпочитайте первый метод, если вам абсолютно не нужно использовать span. И, пожалуйста, вытяните его из своего h3, это будет гораздо более доступным.