ARIA : rôle comment
Le rôle comment
désigne sémantiquement un commentaire/réaction à un contenu sur la page, ou à un commentaire précédent.
Note :
Le rôle comment
est proposé dans WAI-ARIA 1.3 (Dernière version préliminaire de l'ARIA (angl.)), qui est encore en cours de rédaction.
Exemples
Dans l'exemple suivant, nous avons une section de document qui a été commentée. La section commentée est marquée à l'aide de <span role="mark">
.
Le commentaire associé est marqué à l'aide d'une structure HTML enveloppée dans un <div>
contenant role="comment"
.
<p>
La dernière moitié de la chanson est un crescendo lent qui atteint son apogée
à la
<span role="mark" aria-details="thread-1">fin du solo de guitare</span>, avant
de s'estomper brusquement.
</p>
<div role="comment" id="thread-1" data-author="chris">
<h3>Chris a dit</h3>
<p class="comment-text">
Je pense vraiment que ce moment pourrait bénéficier de plus de cowbell.
</p>
<p><time datetime="2019-03-30T19:29">30 mars 2019, 19:29</time></p>
</div>
Pour associer le commentaire avec le texte commenté, nous devons envelopper le texte commenté avec un élément contenant l'attribut aria-details
, dont la valeur doit être l'ID du commentaire.
Commentaires multiples
Puisque aria-details
peut maintenant accepter plusieurs ID, nous pouvons associer plusieurs commentaires à la même annotation, comme ceci :
<p>
La dernière moitié de la chanson est un crescendo lent qui atteint son apogée
à la
<mark aria-details="thread-1 thread-2">fin du solo de guitare</mark>, avant de
s'estomper brusquement.
</p>
<div role="comment" id="thread-1" data-author="chris">
<h3>Chris à dit</h3>
<p class="comment-text">
Je pense vraiment que ce moment pourrait bénéficier de plus de cowbell.
</p>
<p><time datetime="2019-03-30T19:29">30 mars 2019, 19:29</time></p>
</div>
<div role="comment" id="thread-2" data-author="chris">
<h3>Marcus à dit</h3>
<p class="comment-text">
Le solo de guitare pourrait bénéficier d'une touche de plus de chorus, et
d'un volume légèrement inférieur.
</p>
<p><time datetime="2019-03-29T15:35">29 mars 2019, 15:35</time></p>
</div>
Commentaires imbriqués
Il est possible d'imbriquer des commentaires les uns dans les autres, comme ceci :
<div role="comment" id="thread-1" data-author="chris">
<h3>Chris à dit</h3>
<p class="comment-text">
Je pense vraiment que ce moment pourrait bénéficier de plus de cowbell.
</p>
<p><time datetime="2021-03-30T19:29">30 mars 2021, 19:29</time></p>
<div role="comment" data-author="marcus">
<h3>Marcus à répondu</h3>
<p class="comment-text">
Je ne sais pas pour ça. Je pense que le cowbell pourrait distraire du
solo.
</p>
<p><time datetime="2021-03-30T21:02">30 mars 2021, 21:02</time></p>
</div>
</div>
Problèmes d'accessibilité
Aucun.
Spécifications
Fera partie de WAI-ARIA 1.3, qui est encore en cours de rédaction.