Button versus link
Wanneer gebruik je een button (<button>
) of een anchor (<a>
) element? Kies het juiste element voor de juiste toepassing voor een toegankelijke website.
Button element
Het HTML button element (<button>
) gebruik je bij programmeerbare acties. Bijvoorbeeld voor het versturen van een formulier of bij een JavaScript functie zoals het openen van een pop-up of uitklap menu.
Meer over het button element op MDN
Input
Naast het button element bestaat er ook een input element met als type button (<input type="button">
). Dit is ook een valide methode om, binnen een formulier, een functionele knop te gebruiken. Dit heeft wel de beperking dat er geen geneste inhoud in gebruikt kan worden. Heb je een keuze, kies dan voor het button element.
Anchor element
Het HTML anchor element (<a>
) is een element wat wordt gebruikt om een hyperlink naar webpagina's, bestanden, e-mailadressen, locaties op dezelfde pagina of al het andere wat via een url te benaderen is te maken.
Een anchor element moet altijd worden gebruikt in combinatie met het href attribuut. Hierin geef je de url op.
Conclusie
Een button element gebruik je voor functionele doeleinden. Een anchor element gebruik je voor hyperlinks.
Gebruik nooit een <span>
of bijvoorbeeld een <div>
als knop of link. Deze bieden niet de functionaliteit zoals een button of anchor element doen voor toegankelijkheid.