Quel est le but de l'attribut "role&quot ; en HTML ?

Je continue à voir des attributs de rôle dans le travail de certaines personnes. Je l'utilise aussi, mais je ne suis pas sûr de son effet.

Par exemple :

<header id="header" role="banner">
    Header stuff in here
</header>

Ou :

<section id="facebook" role="contentinfo">
    Facebook stuff in here
</section>

Ou :

<section id="main" role="main">
     Main content stuff in here
</section>

Cet attribut de rôle est-il nécessaire ?

Cet attribut est-il meilleur pour la sémantique ?

Améliore-t-il le référencement ?

Une liste de rôles peut être trouvée [ici][1], mais je vois que certaines personnes inventent leurs propres rôles. Est-ce autorisé ou est-ce une utilisation correcte de l'attribut role ?

Avez-vous des idées à ce sujet ?

[1] : https://www.w3.org/TR/xhtml-role/

SuperDJ
Question modifiée 9 août 2018 в 5:04
Programmation
html
1er mai 2012 в 10:11
2 vues
Solution

La plupart des rôles que vous voyez ont été définis dans le cadre d'ARIA 1.0, puis incorporés ultérieurement dans HTML5. Certains des nouveaux éléments HTML5 (dialog, main, etc.) sont même basés sur les rôles ARIA originaux.

http://www.w3.org/TR/wai-aria/

Il y a deux raisons principales d'utiliser les rôles en plus de votre élément sémantique natif.

**Raison n°1 : remplacer le rôle lorsqu'aucun élément de la langue hôte n'est approprié ou lorsque, pour diverses raisons, un élément moins approprié sur le plan sémantique a été utilisé.

Dans cet exemple, un lien a été utilisé, même si la fonctionnalité résultante ressemble davantage à un bouton qu'à un lien de navigation.

<a href="#" role="button" aria-label="Delete item 1">Delete</a>

Les lecteurs d'écran l'entendront comme un bouton (par opposition à un lien), et vous pouvez utiliser un sélecteur d'attribut CSS pour éviter la class-itis et la div-itis.

*[role="button"] {
  /* style these a buttons w/o relying on a .button class */
}

Raison #2. Sauvegarde du rôle d'un élément natif, pour supporter les navigateurs qui ont implémenté le rôle ARIA mais n'ont pas encore implémenté le rôle de l'élément natif.

Par exemple, le rôle "principal" est supporté par les navigateurs depuis de nombreuses années, mais il s'agit d'un ajout relativement récent à HTML5, de sorte que de nombreux navigateurs ne supportent pas encore la sémantique pour ``.

…

C'est techniquement redondant, mais cela aide certains utilisateurs et ne nuit à aucun. Dans quelques années, cette technique deviendra probablement inutile.

Vous avez également écrit :

Je vois que certaines personnes inventent leur propre rôle. Est-ce autorisé ou est-ce une utilisation correcte de l'attribut role ?

C'est une utilisation correcte de l'attribut, sauf si un rôle réel n'est pas inclus. Les navigateurs appliqueront le premier rôle reconnu dans la liste des jetons.

<span role="foo link note bar">...</a>

Dans la liste, seuls link et note sont des rôles valides, et donc le rôle link sera appliqué parce qu'il vient en premier. Si vous utilisez des rôles personnalisés, assurez-vous qu'ils n'entrent pas en conflit avec un rôle défini dans ARIA ou dans le langage hôte que vous utilisez (HTML, SVG, MathML, etc.).

TylerH
Réponse modifiée 28 mars 2017 в 1:53
Commentaires (10)

D'après ce que j'ai compris, les rôles étaient initialement définis par XHTML mais ont été dépréciés. Cependant, ils sont maintenant définis par HTML 5, voir ici : https://www.w3.org/WAI/PF/aria/roles#abstract_roles_header.

Le but de l'attribut role est d'identifier pour le logiciel d'analyse syntaxique la fonction exacte d'un élément (et de ses enfants) dans le cadre d'une application Web. Il s'agit principalement d'une question d'accessibilité pour les lecteurs d'écran, mais je peux également imaginer qu'il soit utile pour les navigateurs intégrés et les racleurs d'écran. Afin d'être utile au client HTML inhabituel, l'attribut doit être défini sur l'un des rôles de la spécification que j'ai citée. Si vous inventez votre propre rôle, cette fonctionnalité "future" ne peut pas fonctionner - un commentaire serait préférable.

Les détails pratiques sont ici : http://www.accessibleculture.org/articles/2011/04/html5-aria-2011/

carrola7
Réponse modifiée 4 avril 2018 в 7:15
Commentaires (0)

Cet attribut de rôle est-il nécessaire ?

Réponse : Oui.

  • L'attribut role est nécessaire pour permettre aux applications Internet riches accessibles [(WAI-ARIA)][1] de définir des rôles dans les langages basés sur XML, lorsque ces derniers ne définissent pas leur propre attribut role.
  • Bien que ce soit la raison pour laquelle l'attribut role est publié par le Groupe de travail sur les protocoles et les formats, l'attribut a également des cas d'utilisation plus généraux.

Il vous permet :

  • L'accessibilité
  • Adaptation au dispositif
  • Traitement côté serveur
  • Description de données complexes,...etc.

[1] : https://en.wikipedia.org/wiki/WAI-ARIA

W.R.
Réponse modifiée 5 mai 2017 в 5:38
Commentaires (1)