Accessibility issue

Hello, I just went into page speed insights to check my website and this issue came up:
“Buttons do not have an accessible name” that needs to be fix; Does someone knows what needs to be done?
Thank You!
Please look at screen shot

Lighthouse is complaining that the Bootstrap Carousel indicators don’t announce that they are clickable buttons to people using screen readers because they don’t have titles. It’s kind of silly because I suspect few people click the indicators to change slides. Nevertheless, since bootstrap made them buttons, if you want a perfect score on Lighthouse, you have to give them each a title. You can’t select the indicators from the workspace. You have go to the HTML panel, select them one at a time, and add the title attribute.

You can call them whatever you want. As long as they have a title, it will satisfy Lighthouse. If you’re really concerned that people who visit the site with a screen reader will need to understand that the indicators have button functionality, you could give them titles like “slide one indicator button”, “slide two indicator button”, “slide three indicator button”, and so on.

So select the indicator in the HTML, add the word “title” in the Key field, and then type a name in the Value field. Do this for each indicator.

1 Like

use chatgpt for help

Thank you! that did worked!

1 Like