Coulisse 4) Produire le .csv d'import du nouveau référentiel RGAA 3.2016

Sommaire | Précédent | Suivant :hourglass_flowing_sand:


L’idée de cette 4ème partie est de produire un fichier .csv du nouveau référentiel à partir du site officiel.
Ce fichier .csv sera utilisé pour générer le nouveau référentiel dans Asqatasun via le plugin maven dédié.

La source : le site officiel du RGAA

Il nous faut extraire des donnés (les mots suivants seront parfois utilisés comme synonymes : parser / scrapper) à partir de la liste des critères et des tests du RGAA 3 2016 disponible sur le site officiel du référentiel.

Données à extraire

  • Pour chaque critère :
    • ID du critère
    • niveau (A, AA ou AAA)
    • HTML du descriptif sans l’ID, le niveau, les tests et les infos complémentaires.
  • Pour chaque test :
    • ID du test
    • HTML du descriptif sans l’ID

Extraction des données

Plusieurs techniques sont possibles et plusieurs langages de programmation sont utilisables…

C’est un script PHP qui a été utilisé avec des objets DOMDocument pour récupérer facilement,
du fichier HTML, les portions du DOM qui nous intéressent via des requêtes Xpath.

Ce script sera publié prochainement. En attendant, nous vous invitons à parcourir le dépôt Github contenant toutes les données extraites de cette nouvelle version du RGAA.

Détail technique du .csv

  • encodage du fichier en UTF-16 (UTF-8, si séparateur de colonne moins exotique)
  • une première ligne d’entête obligatoire
  • utiliser un séparateur de colonne “exotique” [ ø ] pour éviter les soucis… :wink:
  • texte entre simple quote [ ]

Il faut donc échapper les simple quote [ ] contenu dans le texte. Dans le cas du RGAA 3 2016, ce n’est pas nécessaire car aucun caractère [ ] n’est utilisé. Si cela avait été le cas, il nous aurait suffit de doubler le caractère pour activer l’échappement.

Les textes pour les critères et les tests du référentiel
doivent être au format HTML pour conserver :

  • les listes à puces,
  • les liens vers le glossaire
  • les balises <code>
  • les abréviations

Chaque ligne du fichier CSV devant contenir le code HTML du test et du critère,
il faut minifier ce HTML pour qu’aucun saut de ligne ne soit présent.

Fichier CSV d’import pour le RGAA 3 2016

Le fichier CSV pour l’import du RGAA 3.2016
est disponible sur le dépôt GitHub.

Extrait du fichier .csv

themeøtheme_frøcritereøcritere-label_frøtestøtest-label_frølevelø
1ø'Images'ø1-1ø'Chaque image a-t-elle une <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#alternative-textuelle-image">alternative textuelle</a>&nbsp;?'ø1-1-1ø'Chaque image (balise <code lang="en">img</code>) a-t-elle un attribut <code lang="en">alt</code>&nbsp;?'øAø
1ø'Images'ø1-1ø'Chaque image a-t-elle une <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#alternative-textuelle-image">alternative textuelle</a>&nbsp;?'ø1-1-2ø'Chaque <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#zone-dune-image-ractive">zone</a> (balise <code lang="en">area</code>) d&#x2019;une <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#image-ractive">image r&#xE9;active</a> a-t-elle un attribut <code lang="en">alt</code>&nbsp;?'øAø
1ø'Images'ø1-1ø'Chaque image a-t-elle une <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#alternative-textuelle-image">alternative textuelle</a>&nbsp;?'ø1-1-3ø'Chaque <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#bouton-formulaire">bouton</a> de formulaire (balise <code lang="en">input</code> avec l&#x2019;attribut <code lang="en">type="image"</code>) a-t-il un attribut <code lang="en">alt</code>&nbsp;?'øAø
1ø'Images'ø1-1ø'Chaque image a-t-elle une <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#alternative-textuelle-image">alternative textuelle</a>&nbsp;?'ø1-1-4ø'Chaque <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#zone-cliquable">zone cliquable</a> d&#x2019;une <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#image-ractive">image r&#xE9;active</a> cot&#xE9; serveur est-t-elle doubl&#xE9;e d&#x2019;un lien dans la page&nbsp;?'øAø
1ø'Images'ø1-2ø'Pour chaque <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#image-de-dcoration">image de d&#xE9;coration</a> ayant une <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#alternative-textuelle-image">alternative textuelle</a>, cette alternative est-elle vide&nbsp;?'ø1-2-1ø'Chaque image (balise <code lang="en">img</code>) <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#image-de-dcoration">de d&#xE9;coration</a>, sans <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#lgende-dimage">l&#xE9;gende</a>, et ayant un attribut <code lang="en">alt</code>, v&#xE9;rifie-t-elle ces conditions&nbsp;? <ul><li>Le contenu de l&#x2019;attribut <code lang="en">alt</code> est vide (<code lang="en">alt=""</code>)&nbsp;;</li> <li>L&#x2019;image de d&#xE9;coration ne poss&#xE8;de pas d&#x2019;attribut <code lang="en">title</code>&nbsp;;</li> <li>La balise <code lang="en">img</code> est d&#xE9;pourvue de r&#xF4;le, propri&#xE9;t&#xE9; ou &#xE9;tat ARIA visant &#xE0; labelliser l&#x2019;image (<code lang="en">aria-label</code>, <code lang="en">aria-describedby</code>, <code lang="en">aria-labelledby</code> par exemple).</li> </ul>'øAø
1ø'Images'ø1-2ø'Pour chaque <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#image-de-dcoration">image de d&#xE9;coration</a> ayant une <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#alternative-textuelle-image">alternative textuelle</a>, cette alternative est-elle vide&nbsp;?'ø1-2-2ø'Chaque <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#zone-non-cliquable">zone non cliquable</a> (balise <code lang="en">area</code> sans attribut <code lang="en">href</code>) <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#image-de-dcoration">de d&#xE9;coration</a>, et ayant un attribut <code lang="en">alt</code>, v&#xE9;rifie-t-elle ces conditions&nbsp;? <ul><li>Le contenu de l&#x2019;attribut <code lang="en">alt</code> est vide (<code lang="en">alt=""</code>)&nbsp;;</li> <li>La zone non cliquable ne poss&#xE8;de pas d&#x2019;attribut <code lang="en">title</code>&nbsp;;</li> <li>La balise <code lang="en">area</code> est d&#xE9;pourvue de r&#xF4;le, propri&#xE9;t&#xE9; ou &#xE9;tat ARIA visant &#xE0; labelliser l&#x2019;image (<code lang="en">aria-label</code>, <code lang="en">aria-describedby</code>, <code lang="en">aria-labelledby</code> par exemple).</li> </ul>'øAø
1ø'Images'ø1-2ø'Pour chaque <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#image-de-dcoration">image de d&#xE9;coration</a> ayant une <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#alternative-textuelle-image">alternative textuelle</a>, cette alternative est-elle vide&nbsp;?'ø1-2-3ø'Chaque <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#image-objet">image objet</a> (balise <code lang="en">object</code> avec l&#x2019;attribut <code lang="en">type="image/…"</code>) <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#image-de-dcoration">de d&#xE9;coration</a>, sans <a href="http://references.modernisation.gouv.fr/rgaa-accessibilite/glossaire.html#lgende-dimage">l&#xE9;gende</a>, v&#xE9;rifie-t-elle ces conditions&nbsp;? <ul><li>La balise <code lang="en">object</code> poss&#xE8;de un attribut <code lang="en">aria-hidden="true"</code>&nbsp;;</li> <li>L&#x2019;alternative textuelle entre <code lang="en">&lt;object&gt;</code> et <code lang="en">&lt;/object&gt;</code> est vide&nbsp;;</li> <li>La balise <code lang="en">object</code> ou l&#x2019;un de ses enfants est d&#xE9;pourvue de r&#xF4;le, propri&#xE9;t&#xE9; ou &#xE9;tat ARIA visant &#xE0; labelliser l&#x2019;image (<code lang="en">aria-label</code>, <code lang="en">aria-describedby</code>, <code lang="en">aria-labelledby</code> par exemple).</li> </ul>'øAø

Détails des colonnes du fichier

L’ordre des colonnes n’est pas important
par contre l’intitulé des entêtes est imposé.

  • theme : ID du thème
  • critere : ID du critère
  • level : niveau du critère (A, AA ou AAA)
  • test : ID du test
  • theme_fr : intitulé en français du thème (“Images”)
  • critere-label_fr : intitulé en français du critère au format HTML
  • test-label_fr : intitulé en français du test au format HTML

La documentation sur la création d’un nouveau référentiel dans Asqatasun
détaille les intitulés de colonnes utilisables.

La cuisine vous est ouverte… :gift:

Cette série Coulisse est l’occasion de rendre public le processus d’ajout d’un référentiel « officiel » à Asqatasun à la fois pour le documenter et pour le rendre accessible à tous.

Vos retours, questions, remarques et contributions
sont les bienvenus et même fortement recommandés. :wink:

À venir… :alarm_clock:


Sommaire | Précédent | Suivant :hourglass_flowing_sand:

1 Like