WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Issue with aria-hidden=true

for

From: John Hicks
Date: Jul 20, 2020 2:53PM

Hello

There is nothing wrong with the Aria Hidden attribute, it is there to keep
the svg from being read (sometimes SVGs have author texts inside). The
problem is that the link text "Facebook" is visibility:hidden . So this is
an empty link as far as screen readers are concerned.

You could take off the aria hidden and put an aria label in the svg, or use
a different masking method for the link text.

?

... late night doodling, there are real experts on this list who may
correct me in the morning :)

John


Le lun. 20 juil. 2020 à 22:00, < <EMAIL REMOVED> > a écrit :

> Hi all. First time here.
>
>
>
> I am very new when it comes to making sites fully accessible. I am using
> the WAVE Accessibility Extension for Firefox and one of the issue I am
> having is the aria-hidden=true that was flagged 7 times. It seems some of
> the have to do with fonts from Font Awesome and I don't know how to fix
> them.
>
>
>
> Here's one example:
>
> <a target="_blank"
> href="https://www.facebook.com/falconcropprotection/"><svg
> aria-hidden="true" class="svg-inline--fa fa-facebook-square fa-w-14"
> data-prefix="fab" data-icon="facebook-square" role="img"
> xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"
> data-fa-i2svg=""><path fill="currentColor" d="M448 80v352c0 26.5-21.5 48-48
> 48h-85.3V302.8h60.6l8.7-67.6h-69.3V192c0-19.6 5.4-32.9
> 33.5-32.9H384V98.7c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87
> 89.4v49.9H184v67.6h60.9V480H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48
> 48-48h352c26.5 0 48 21.5 48 48z"></path></svg><!-- <i aria-hidden="true"
> class="fab fa-facebook-square"></i> --><span>Facebook</span></a>
>
>
>
> Here's the page I am testing:
>
> https://www.falconcropprotection.com/
>
>
>
> Please not that I am well aware of the contrast issue. I will be dealing
> with that later. Right now I just want to resolve the aria-hidden=true
> issue.
>
>
>
> Thank you
>
> Eddie
>
> > > > >