aria-label inutiles sur des éléments non intéractifs #13

New issue

Closed

opened 2023-10-17 08:09:48 +00:00 by quentin · 1 comment

quentin commented

2023-10-17 08:09:48 +00:00

Owner

un aria-label est un attribut qui doit décrire un élément interactif, du coup il n’a aucune utilité sur un élément div ou span (cf la page MDN par exemple), et sera en pratique ignorée par la majorité des lecteurs d’écrans

via @tixie

Le bloc en question :

<div id="mois_actuel" role="img" aria-label="calendrier de nos jours de permanence prévus pour ce mois-ci">
          <pre aria-hidden="true">.——————————————————————————————————————.
|      CALENDRIER SEPTEMBRE 2023       |
|——————————————————————————————————————|
|                      ———— ———— ————  |
|                     | 01 | 02 | 03 | |
|  ———— ———— ———— ———— ———— ———— ————  |
| | 04 |<span class="highlight"> 05 </span>| 06 | 07 | 08 | 09 | 10 | |
|  ———— ———— ———— ———— ———— ———— ————  |
| | 11 | 12 | 13 | 14 | 15 | 16 | 17 | |
|  ———— ———— ———— ———— ———— ———— ————  |
| | 18 | 19 | 20 | 21 | 22 | 23 | 24 | |
|  ———— ———— ———— ———— ———— ———— ————  |
| |<span class="highlight"> 25 </span>|<span class="highlight"> 26 </span>| 27 | 28 |<span class="highlight"> 29 </span>|<span class="highlight"> 30 </span>|      |
|  ———— ———— ———— ———— ———— ————       |
|______________________________________|</pre>
	</div>

La ligne en question :

<div 
     id="mois_actuel" 
     role="img" 
     aria-label="calendrier de nos jours de permanence prévus pour ce mois-ci"
     c="au dessus " 
     >

La page de Mozilla : https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label

> un aria-label est un attribut qui doit décrire un élément interactif, du coup il n’a aucune utilité sur un élément div ou span (cf la page MDN par exemple), et sera en pratique ignorée par la majorité des lecteurs d’écrans via @tixie Le bloc en question : ```xml <div id="mois_actuel" role="img" aria-label="calendrier de nos jours de permanence prévus pour ce mois-ci"> <pre aria-hidden="true">.——————————————————————————————————————. | CALENDRIER SEPTEMBRE 2023 | |——————————————————————————————————————| | ———— ———— ———— | | | 01 | 02 | 03 | | | ———— ———— ———— ———— ———— ———— ———— | | | 04 |<span class="highlight"> 05 </span>| 06 | 07 | 08 | 09 | 10 | | | ———— ———— ———— ———— ———— ———— ———— | | | 11 | 12 | 13 | 14 | 15 | 16 | 17 | | | ———— ———— ———— ———— ———— ———— ———— | | | 18 | 19 | 20 | 21 | 22 | 23 | 24 | | | ———— ———— ———— ———— ———— ———— ———— | | |<span class="highlight"> 25 </span>|<span class="highlight"> 26 </span>| 27 | 28 |<span class="highlight"> 29 </span>|<span class="highlight"> 30 </span>| | | ———— ———— ———— ———— ———— ———— | |______________________________________|</pre> </div> ``` La ligne en question : ```xml <div id="mois_actuel" role="img" aria-label="calendrier de nos jours de permanence prévus pour ce mois-ci" c="au dessus " > ``` La page de Mozilla : https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label