Bouton ou Lien ? Le Décideur

L'erreur sémantique la plus courante du web. Répondez à 2 questions simples pour savoir quelle balise HTML utiliser.

Commençons le diagnostic

Pourquoi la sémantique est cruciale ?

Pour un utilisateur voyant, un bouton stylisé en lien (ou l'inverse) ne pose pas de problème majeur. Mais pour un utilisateur de lecteur d'écran, la distinction est vitale :

Lien : "Lien, Aller à la page d'accueil". Suggère une navigation.
Bouton : "Bouton, Ouvrir le menu". Suggère une action immédiate.

Mélanger les deux crée de la confusion et peut rendre certaines fonctionnalités inaccessibles au clavier.

Les comportements clavier

Les navigateurs gèrent nativement les interactions si vous utilisez les bonnes balises :

<a> : S'active avec la touche Entrée.
<button> : S'active avec Entrée ET Espace.

Si vous utilisez un <div onClick="...">, vous perdez ces comportements natifs et devez les recoder en JavaScript (ce qui est source d'erreurs et lourd à maintenir).