问题
what's the effect of aria-hidden in fontAwesome? Is it necessary to use it? why? or why not?
for example I want to know the effect of aria-hidden="true" in the code below
<i class="fa fa-star" aria-hidden="true"></i>
please help me.
回答1:
In short, it makes the icon not visible to screen readers, to enhance accessibility.
From the documentation:
If you're using an icon to add some extra decoration or branding, it does not need to be announced to users as they are navigating your site or app aurally. Additionally, if you're using an icon to visually re-emphasize or add styling to content already present in your HTML, it does not need to be repeated to an assistive technology-using user. You can make sure this is not read by adding the aria-hidden="true" to your Font Awesome markup.
回答2:
If you're using an icon to add some extra decoration or branding, it does not need to be announced to users as they are navigating your site or app aurally. Additionally, if you're using an icon to visually re-emphasize or add styling to content already present in your HTML, it does not need to be repeated to an assistive technology-using user. You can make sure this is not read by adding the aria-hidden="true" to your Font Awesome markup.
<i class="fa fa-fighter-jet" aria-hidden="true"></i>
an icon being used as pure decoration
<h1 class="logo">
<i class="fa fa-pied-piper" aria-hidden="true"></i>
Pied Piper, A Middle-Out Compression Solution Making Data Storage Problems Smaller
</h1>
an icon being used as a logo
Source: http://fontawesome.io/accessibility/
来源：https://stackoverflow.com/questions/44692917/effect-of-aria-hidden-in-fontawesome