Première règle : aucune ARIA ne vaut mieux qu’une mauvaise ARIA
Pourquoi le HTML natif constitue presque toujours le meilleur choix.
Première règle : aucune ARIA ne vaut mieux qu’une mauvaise ARIA est une leçon Web Accessibility Academy gratuite sur CoddyKit. Ceci est la leçon 1 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage Web Accessibility Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours Web Accessibility Academy comprend 4 leçons au total.
Ce qu’est réellement ARIA
ARIA est un ensemble d’attributs HTML qui indique aux technologies d’assistance ce qu’est un élément et ce qu’il fait, lorsque le balisage seul ne suffit pas à le préciser.
ARIA ne modifie aucun comportement
Voici le point important : ARIA ne modifie que ce qui est annoncé. Elle n’ajoute jamais à elle seule de clics, de focus ou de prise en charge du clavier.
<div role="button">Save</div>
<!-- looks like a button, does nothing -->La première règle d’ARIA
La première règle officielle est la suivante : si un élément HTML natif peut faire le travail, utilisez-le au lieu de le recréer avec ARIA.
Le natif est complet dès le départ
Un vrai bouton peut recevoir le focus, se déclenche avec Entrée et Espace, et annonce gratuitement son rôle. Vous n’avez rien de tout cela à écrire vous-même.
<button>Save</button>
<!-- focus, keyboard, role: all built in -->Pourquoi une mauvaise ARIA est pire
Un rôle incorrect ment activement aux utilisateurs. Une mauvaise ARIA vaut mieux qu’aucune ARIA uniquement par l’ampleur des dommages : elle peut masquer du contenu ou le décrire incorrectement.
Le piège de la substitution
ARIA remplace les sémantiques natives. Si vous ajoutez role=presentation à un titre, les lecteurs d’écran cessent complètement de le traiter comme un titre.
<h2 role="presentation">Pricing</h2>
<!-- no longer a heading to AT -->Trois choses fournies par ARIA
ARIA vous fournit exactement trois types d’informations : un rôle (ce que c’est), des états et des propriétés. C’est toute sa boîte à outils.
ARIA ne modifie pas les CSS
Définir aria-hidden sur un élément le masque aux lecteurs d’écran, mais il reste entièrement visible à l’écran. Ces deux couches sont distinctes.
<span aria-hidden="true">decorative star</span>
<!-- seen, not heard -->Quand utiliser ARIA
Utilisez ARIA lorsqu’aucun élément natif ne convient, par exemple pour une tablist ou un curseur personnalisé. Utilisez-la alors avec précision et testez-la.
Associer ARIA à JavaScript
Si vous devez créer un composant personnalisé, ARIA et JavaScript vont ensemble. ARIA le nomme, et JS fournit la logique de gestion du focus et du clavier.
Moins, c’est mieux
La meilleure page accessible utilise souvent très peu ARIA. HTML sémantique d’abord, puis ARIA uniquement pour combler les lacunes restantes.
Vérification rapide
Vous avez besoin d’un contrôle Enregistrer cliquable. Quel est le choix le plus accessible ?
Récapitulatif : utiliser ARIA judicieusement
Vous avez appris qu’ARIA décrit, mais ne fournit jamais le comportement. Préférez HTML natif, ajoutez ARIA uniquement pour combler de vraies lacunes et testez-la à chaque fois. 🎯
Apprends HTML avec un tuteur IA — gratuit
Écris et exécute du vrai code dans ton navigateur, obtiens de l'aide instantanée d'un tuteur IA disponible 24h/24, et reprends là où tu t'es arrêté sur le web ou dans l'app.
- Cours
- 30
- Leçons
- 120
Questions Fréquemment Posées
La leçon « Première règle : aucune ARIA ne vaut mieux qu’une mauvaise ARIA » est-elle gratuite ?
Oui — le texte complet de « Première règle : aucune ARIA ne vaut mieux qu’une mauvaise ARIA » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours Web Accessibility Academy, passe à CoddyKit PRO. Le cours Web Accessibility Academy comprend 4 leçons au total.
Qu'est-ce que j'apprendrai dans « Première règle : aucune ARIA ne vaut mieux qu’une mauvaise ARIA » ?
Pourquoi le HTML natif constitue presque toujours le meilleur choix. Tu pratiques Web Accessibility Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.
Dois-je avoir de l'expérience pour commencer Web Accessibility Academy ?
Aucune expérience préalable n'est requise. Web Accessibility Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 1 sur 4.
Combien de temps prend la leçon « Première règle : aucune ARIA ne vaut mieux qu’une mauvaise ARIA » ?
La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.
Peux-tu écrire et exécuter du code dans cette leçon Web Accessibility Academy ?
Oui. Chaque leçon Web Accessibility Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.
Toutes les leçons de ce cours
- Première règle : aucune ARIA ne vaut mieux qu’une mauvaise ARIA
- Les rôles définissent ce qu'est une chose
- États et propriétés : développé, coché, désactivé
- Lire l'arbre d'accessibilité pour déboguer ARIA