plugins - RSS icons have the same Alt tag. Lighthouse is failing these elements. How do I display different alt tags for each ic

I am making my websites accessible by mostly using Lighthouse in Chrome Devtools. I have fixed everything but this one issue. Lighthouse is failing these elements because the alt tags need discernible names:

<a class="rsswidget" href=""><img class="rss-widget-icon" style="border:0" width="14" height="14" src=".png" alt="RSS"></a>

<a class="rsswidget" href="/"><img class="rss-widget-icon" style="border:0" width="14" height="14" src=".png" alt="RSS"></a>

<a class="rsswidget" href="/"><img class="rss-widget-icon" style="border:0" width="14" height="14" src=".png" alt="RSS"></a>

How do I change the alt text for the image to reflect which feed it is related to? I am not very familiar with wordpress, most of the sites I work on are drupal. Any thoughts?

I am making my websites accessible by mostly using Lighthouse in Chrome Devtools. I have fixed everything but this one issue. Lighthouse is failing these elements because the alt tags need discernible names:

<a class="rsswidget" href="https://blog.mysite/formative-assessment/feed"><img class="rss-widget-icon" style="border:0" width="14" height="14" src="https://blog.mysite/wp-includes/images/rss.png" alt="RSS"></a>

<a class="rsswidget" href="https://blog.mysite/technology/feed/"><img class="rss-widget-icon" style="border:0" width="14" height="14" src="https://blog.mysite/wp-includes/images/rss.png" alt="RSS"></a>

<a class="rsswidget" href="https://blog.mysite/licensure/feed/"><img class="rss-widget-icon" style="border:0" width="14" height="14" src="https://blog.mysite/wp-includes/images/rss.png" alt="RSS"></a>

How do I change the alt text for the image to reflect which feed it is related to? I am not very familiar with wordpress, most of the sites I work on are drupal. Any thoughts?

• plugins
• rss
• accessibility

Share Improve this question asked Nov 29, 2018 at 15:40 mhowe85mhowe85 1 1

• How is that output being generated? – Tom J Nowell ♦ Commented Nov 29, 2018 at 15:52

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

Well I am a complete fool. It wasn't the use of the alt tags at all, it was the fact that the icons were set to display:none, yet the code was still there which seems to confuse a screen reader. I just hid the element in a theme file and made it appear when it was focused or active and it seemed to clear the error....