Как сказать программе чтения с экрана использовать атрибут вместо текста ссылки?

Question

У меня есть ссылка в неупорядоченном списке следующим образом:

<li class="savelink">
  <a href="/save"><span>Save</span></a>
</li>

Обычно программы чтения с экрана читают "Сохранить". Возможно ли и с каким атрибутом изменить это, не изменяя фактический текст ссылки?

Бизнес должен иметь ссылку, стилизованную под значок. Значок будет дополнять текст ссылки. Например:

• Значок со знаком "+" и текстом меню "ссылка", который соответствует действию "Добавить пункт меню".

Я попробовал aria-label, но безуспешно.

Answer 1

Пытаться

Сохранить

Answer 2

Я не понимаю, почему вы не хотите изменять фактический текст ссылки, если пункт назначения выполняет другие действия. Или используйте фактическое изображение в качестве значка (поскольку оно передает значение, а не является чисто декоративным) и используйте для этого альтернативный текст.

Answer 3

Поскольку значки несут значение, вы должны включить их, используя img, Затем используйте alt приписывать соответственно. Возможно, вам придется переформулировать некоторые фразы, например, когда вам нужно выразить "Добавить пункт меню" значком, представляющим "добавить", вам нужно будет использовать "пункт меню" (вместо "меню") для ссылки.

<a href="/add"><img src="add-icon.png" alt="Add"> menu item</a>

---

Альтернатива использованию img было бы использовать CSS для отображения значков и визуально скрывать полный текст ссылки, так что он будет читаться только для пользователей программы чтения с экрана (или тех пользователей, которые отключают CSS). Здесь вы можете использовать clip метод.

<a href="/add"><span class="visually-hide">Add</span> menu item</a>