« Wikipédia:Atelier accessibilité/Bonnes pratiques » : différence entre les versions
Contenu supprimé Contenu ajouté
m →Choix de couleurs et contrastes : mise en page |
→Tableaux triables : Mise à jour de ce point, afin de tenir compte du passage de MediaWiki à HTML5 depuis quelques années déjà, et que le tri de tableaux à l'aide des classes "sortable" et des nouveaux attributs de données "data-sort-type" et "data-sort-value" n'a plus d'incidence sur le contenu HTML même, et est transparent pour les lecteurs d'écrans et autres outils d'aide |
||
Ligne 1 090 :
=== Tableaux triables ===
{{Début cadre coloré|bleu}}<b class="accessibilite">'''Bonne pratique''' :</b> éviter autant que possible l'utilisation
* priorité : élevée
* difficulté :
L'utilisation
Entre-temps, MediaWiki est passé au nouveau standard [[HTML5]], version introduisant notamment les attributs de données personnalisés data-*, ouvrant la voie à l'utilisation de l'attribut <code>data-sort-value</code>. Cet attribut n'affecte aucunement les utilisateurs dont le support des styles CSS est désactivé, et le système de tri des tableaux de MediaWiki a également fait d'importants progrès : les cinq premières lignes d'un tableau étant maintenant analysées pour essayer de déterminer le type de données.
Est également apparu l'attribut <code>[[Aide:Insérer un tableau (wikicode, expert)#attr-header-data-sort-type|data-sort-type]]</code>, à utiliser sur les en-têtes de colonnes, pour indiquer quel type de données la colonne contient, au cas-où malgré la prise en compte des cinq premières lignes du tableau, le type aurait été mal détecté.
Si des clés de tri sont néanmoins nécessaires, il faut privilégier dans la la mesure du possible l'utilisation du modèle {{m|tri}} ou l'usage de l'attribut <code>[[Aide:Insérer un tableau (wikicode, expert)#attr-cell-data-sort-value|data-sort-value]]</code>.
{| class="wikitable centre"
|+ Comparaison des modèles {{m|smn}} et {{m|tri}} avec les styles CSS activés et désactivés
|-
! scope="col" | Modèle
! scope="col" | Code
! scope="col" | Rendu affiché avec CSS
! scope="col" | Contenu réel de la cellule de tableau<br /> restitué si les styles CSS ne sont pas pris en compte▼
|-
! scope=
| <code><nowiki>{{smn|5|4|100}}</nowiki></code>
▲! scope=col | Contenu réel de la cellule de tableau<br /> restitué si les styles CSS ne sont pas pris en compte
| <s>+0</s>5<s>,</s>
|-
! scope="row" | {{m|tri}}
▲| {{smn|-47.15|5|100}} €
| <code><nowiki>{{tri|5}} 5</nowiki></code> '''''ou''''' <code><nowiki>{{tri|5|5}}</nowiki></code>
| {{tri|5}} 5
| 5
|}
| |||