# Knoppen moeten herkenbare tekst hebben

<https://www.fixreports.com/nl/issues/button-name>

WCAG 4.1.2 Naam, rol, waarde · Niveau A

Sommige knoppen hebben geen toegankelijke naam, waardoor gebruikers van een schermlezer alleen ‘knop’ horen.

## Wat deze regel controleert
Zorg dat knoppen herkenbare tekst hebben.

## Waarom het belangrijk is
WCAG 4.1.2 vraagt dat elk bedieningselement een naam heeft. Knoppen zonder naam zijn vaak plus- en minknoppen voor het aantal, sluitknoppen en pijlen van sliders.

## Zo los je het op
### Op elke website
1. Zoek de knoppen die geen naam hebben, meestal knoppen die alleen een icoon tonen.
2. Voeg zichtbare tekst, visueel verborgen tekst of een aria-label toe dat zegt wat de knop doet (bijvoorbeeld aria-label="Close" of aria-label="Increase quantity").

### In Shopify
1. Zoek de knoppen die geen naam hebben, meestal knoppen die alleen een icoon tonen.
2. Voeg zichtbare tekst, visueel verborgen tekst of een aria-label toe dat zegt wat de knop doet (bijvoorbeeld aria-label="Close" of aria-label="Increase quantity").

### In WooCommerce en WordPress
1. Zoek de knoppen die geen naam hebben, meestal knoppen die alleen een icoon tonen.
2. Voeg zichtbare tekst, visueel verborgen tekst of een aria-label toe dat zegt wat de knop doet (bijvoorbeeld aria-label="Close" of aria-label="Increase quantity").

## Zo controleer je de oplossing
- Scan de betrokken pagina’s opnieuw.
- Controleer de knoppen met een schermlezer.

## Bronnen
- Documentatie van de axe-core-regel (Deque): https://dequeuniversity.com/rules/axe/4.13/button-name
- Uitleg bij WCAG 4.1.2 (W3C): https://www.w3.org/WAI/WCAG22/Understanding/name-role-value