12

На многих сайтах по бутстарпу вижу следующий код для вставки иконки:

<i class="glyphicon glyphicon-plus" aria-hidden="true"></i>

Зачем нужно вот это указание aria-hidden?

Это хорошая практика или вредная, неправильная?

Обычно я не люблю вставлять код, который не понимаю, поэтому вычищаю aria-hidden. Но возможно, я неправ и пришла пора разобраться с этим вопросом.

Я поискал информацию в сети, но найденное меня ещё больше сбило с толку.

Похоже, что этот тег как-то помогает слабовидящим пользователям ориентироваться на странице, но как именно - я не понимаю.

Прошу помочь прояснить вопрос.

5
  • w3.org/TR/wai-aria-1.1/#aria-hidden здесь все подробно расписано про aria
    – Arthur
    24 мар 2018 в 14:40
  • 1
    Вы знаете, я вполне сносно читаю по-английски, но тема для меня и на русском достаточно непонятная и ещё и новые термины вводит. Я сейчас начитаюсь и только больше себя запутаю. Если несложно - можно сначала по-русски ответ дать, а потом уже привести ссылки на английском для дополнительного чтения?
    – A K
    24 мар 2018 в 15:12
  • в общем эти атрибуты как бы для семантики т.е желаемое отображение и относится это больше к мобильной части ... вроде так но на самом деле не ясно и мне как это работает
    – user33274
    24 мар 2018 в 15:17
  • 1
    aria - это атрибуты связанные с доступностью. Данный атрибут прячет данный блок от экранах читалок. 24 мар 2018 в 19:47

2 ответа 2

8

Вообще аттрибуты aria нужны для людей с ограниченными возможностями а также для режима чтения. В вашем случае aria-hidden означает что элемент показывать необязательно. Практика бесспорно хорошая.

1

aria-hidden делает так, чтобы экраночиталка для незрячих не читала этот элемент. например, когда с клавиатуры незрячий доходит до изображения, говорилка говорит: (графика). если стоит aria-hidden, то говорилка сфокусирует на следующем элементе, пропуская изображение. зачем оно незрячему. К некоторым изображениям лучше прописать alt-text или aria-label, чтобы изображение читалось говорилкой. приведу пример, но не знаю, как сделать изображение.

<img src="..." aria-label="собака сидит на полу и смотрит на миску с едой"></img>

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

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.