Используйте aria-label на промежутке

Question

Я показываю оценки продуктов, используя символы звездочки Unicode. iOS VoiceOver не читает это вслух правильно, поэтому я решил использовать aria-label на своем промежутке, чтобы сообщить читателям экрана, что это значит.

<span aria-label="4.0 stars out of 5, 123 ratings">★★★★☆ 4.0 (123)</span>

Это не работает. iOS VoiceOver полностью игнорирует мой aria-label.

Что я делаю не так? Как я могу это исправить?

Answer 1

Некоторые вспомогательные технологии иногда игнорируют aria-label, если элемент, на который вы его надеваете, не имеет никакого семантического значения. A не имеет смыслового значения. Если вы добавите role, который подходит для ваших звезд, то он должен читаться правильно.

Answer 2

Один из методов - добавить role=img

<span aria-label="4.0 stars out of 5, 123 ratings" role="img">★★★★☆ 4.0 (123)</span>