Quels éléments en HTML5 peuvent utiliser des attributs ARIA?

Pratiquement tous les éléments standard HTML5 peuvent utiliser des attributs ARIA pour améliorer l'accessibilité pour les utilisateurs de technologies d'assistance.

Quelques exemples :

• Éléments de structure sémantique : header, footer, nav, main, aside, article, section. Peuvent être utilisés pour définir des rôles de zones de la page.
• Éléments interactifs : button, a, input, select, textarea. Peuvent recevoir des attributs comme aria-label, aria-describedby, aria-expanded et d'autres.
• Éléments de listes : ul, ol, li. Peuvent utiliser aria-setsize, aria-posinset.
• Éléments de tableaux : table, tr, th, td. Bien que HTML5 ait ses propres attributs pour l'accessibilité des tableaux (scope, headers), ARIA peut les compléter.
• Éléments de formulaires : form, fieldset, legend.
• Éléments multimédia : img, audio, video. Peuvent recevoir des attributs descriptifs (aria-label).

Il y a des exceptions, par exemple :

• Éléments initialement cachés ou décoratifs (script, style, meta, link).
• Éléments qui ne sont pas affichés dans le DOM ou ne sont pas accessibles à l'interaction.

Il est important d'utiliser ARIA uniquement lorsque les attributs HTML natifs sont insuffisants, et de suivre le principe "Utilisez les éléments natifs autant que possible". Une utilisation excessive ou incorrecte d'ARIA peut nuire à l'accessibilité.