WCAG Compliance

Hi Experts,

I'm not sure if this is the right site for this question...

I took a few courses in Web Content Accessibility Guideline, WCAG, and I'm trying to start by making my own website www.aces-project.com by resolving the errors shown at https://wave.webaim.org/report#/www.aces-project.com

I created this site in 2018 using the Appointment Pro paid theme. Now I see that it is not very accessible, so I'm trying to patch it up with JS, jQuery, CSS.

First, I'm trying to tackle the 6 service icons shown below that are using font-awesome.


As each icon is represented by the adjacent text, like </> is Software Development, I tried to use aria-hidden=true on the <a> tag to be ignored by Screen Readers, thinking that the nested <i> tag will be ignored as well.

However, the WAVE Report is still giving me a "Empty link" error

As well, it added the bottom aria-hidden purple icon of the previous screenshot.

At the same time time, with this aria-hidden I was also trying to resolve the adjacent Redundant Link warning


Should aria-hidden not have  resolved both, the Empty Link error and Redundant Link alert?

Finally, in order to make my site to be fully compliant, do I need all of the below to be 0s (zeros), or just Errors, Contrast Errors and Alerts.

Thank you.