Можно ли использовать aria-label на элементе title - PullRequest
Новая
       31

Можно ли использовать aria-label на элементе title

1 голос
/ 15 апреля 2020

У меня есть страница, на которой тег <title> содержит некоторый текст (в частности: название отдела), который программы чтения с экрана произносят не очень хорошо (название отдела - «AskHR» - это служба поддержки отдела кадров).

Я хочу предоставить программам чтения с экрана более произносимую версию ('Ask H R'), сохраняя при этом более стилизованную версию для визуального отображения. Я думал об использовании aria-label для достижения этой цели, но я не уверен, что его можно применить к элементу <title> в <head>.

Кто-нибудь может подтвердить, действительно ли это действительно?

1 Ответ

1 голос
/ 16 апреля 2020

Я не думаю, что это действительно.

Сначала не все программы чтения с экрана сделаны равными!

То, что вы пытаетесь сделать, может работать в некоторых, но не в других. Например, VoiceOver считывает «AskHR», как и следовало ожидать. (И игнорирует атрибут aria-label.) 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title aria-label="xxx">AskHR</title>
  </head>
  <body>
    <button aria-label="close">X</button>
  </body>
</html>

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

.label {
  speak-as: spell-out
}

См. https://developer.mozilla.org/en-US/docs/Web/CSS/@counter-style / говорим как

Если мы рассмотрим пример выше в Chrome, вы увидите это для элемента <button>:

aria-label Атрибут принимает содержимое кнопки. VoiceOver считывает «закрыть» вместо «x».

enter image description here

Однако это то, что мы видим для <title>:

enter image description here

...