WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Issue with aria-hidden=true

for

From: general@thekaspergroup.com
Date: Jul 20, 2020 3:37PM

Thank you John. I will try your suggestions.

Eddie

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of John Hicks
Sent: Monday, July 20, 2020 3:53 PM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Issue with aria-hidden=true

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
>
> > > archives at http://webaim.org/discussion/archives
> >