Buttons without a name on Lovable
What this is
3 buttons have no accessible name. Screen reader users hear "button" with no hint of what it does.
Who it affects
- Screen reader users
- Keyboard users
- People with motor disabilities
Standards
How to fix it
- Add visible text to the button, or `aria-label="…"` for icon-only buttons.
- Describe the action ("Close menu", "Add to cart"), not the icon ("X", "cart icon").
Example
Before
<button><svg aria-hidden="true"></svg></button>After
<button aria-label="TODO: describe what this button does"><svg aria-hidden="true"></svg></button>Replace the TODO with the action, e.g. "Close menu".
On Lovable
Ask the builder to add `aria-label` to every icon-only button, and make the shared button component require a label.
Other platforms
Prompt for an AI coding tool
Scan your site with AccessibilityBrief and you get a ready-to-use prompt for this problem, with the exact elements on your pages filled in.
Check your own website
Paste a web address. The free scan checks one page and shows what it finds.
More fixes
Automated testing detects only a portion of WCAG issues. Manual testing is required to assess full conformance.