Почему мы используем скрытые арии с иконками - PullRequest
2 голосов
/ 05 апреля 2020

В последнее время я широко использую иконки в своем коде, и после большого исследования fa-fa-awesome это действительно потрясающе. Но я не могу понять, почему мы используем скрытую арию. Пример только для тех, кто не любит читать слова и абзацы:

<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css"/>
<i class="fa fa-eye" aria-hidden="true"></i>

1 Ответ

2 голосов
/ 05 апреля 2020

По данным ВОЗ, около 285 миллионов человек по всему миру страдают от какой-либо слепоты. Они должны использовать программу чтения с экрана для доступа к inte rnet. Программы чтения с экрана преобразуют содержимое вашей веб-страницы в речь и позволяют людям с ограниченными возможностями использовать inte rnet. Вот почему мы добавляем alt атрибуты к изображениям, чтобы программы чтения с экрана могли генерировать речь на основе тега alt.

Доступные Rich Inte rnet Приложения (ARIA) (https://www.w3.org/TR/using-aria/) черновик - это способ добавить дополнительную информацию к вашему HTML и помочь различным вспомогательным технологиям (например, программам чтения с экрана) лучше интерпретировать содержание вашей веб-страницы, чтобы они могли предоставлять более качественные услуги. для людей с ограниченными возможностями.

Обычно вспомогательные технологии создают Accessibility Tree для структурирования вашего пользовательского интерфейса вместо обычного DOM Tree. С помощью атрибутов aria- вы можете контролировать, как строится Accessibility Tree.

Поскольку значки почти всегда являются чисто декоративными элементами, целесообразно полностью исключить их из Accessibility Tree. aria-hidden="true" достигает именно этого. По этой причине он включен в каждый пример <i> - чтобы сделать inte rnet более доступным местом.


A, полагают, что возникает путаница, потому что у веб-разработчиков часто остается впечатление их сайт будет доступен только через современный графический браузер. Из-за этого цель HTML функций, которые не показывают никакого эффекта в браузере, не поняты. Однако веб-ресурс доступен разными способами, и мы должны убедиться, что наша веб-страница работает хорошо во всех из них.

...