SlideShare une entreprise Scribd logo
1  sur  19
Télécharger pour lire hors ligne
@hellosct1
@hellosct1@mamot.fr
Christophe Villeneuve
Tests d’accessibilité par la pratique
DevOps Tahiti – 3 juin 2020
Atos - @hellosct1 -
Aujourd’hui
●
Accessibilité : Rappel
●
Tests de validation manuelle
●
Tests de validation automatique
dans un environnement CI / CD
Accessibilité : Rappel
Atos - @hellosct1 -
Accessibilité numérique ?
L’accessibilité numérique signifie
que les sites web, technos et outils
sont conçus et développés
pour que les personnes handicapées
puissent les utiliser
Atos - @hellosct1 -
C’est à dire
Atos - @hellosct1 -
Les types d’handicap
Atos - @hellosct1 -
RGAA
●
Référentiel Général d’Accessibilité pour les Administrations
●
V 4.0 – publié 2019
https://www.numerique.gouv.fr/publications/rgaa-accessibilite/
Atos - @hellosct1 -
Thématiques
●
Images
●
Cadres
●
Couleurs
●
Multimédia
●
Tableaux
●
Liens
●
Scripts
●
Eléments obligatoires
●
Structure de
l’information
●
Présentation de
l’information
●
Formulaires
●
Navigation
●
Consultation
Atos - @hellosct1 -
Exemple thématique
Atos - @hellosct1 -
Tests de validation manuelle
Atos - @hellosct1 -
Hints
●
Vérifie les bonnes pratiques et les erreurs courantes :
– Accessibilité
– Performance
– Sécurité
– Compatibilité
●
Addon Firefox
https://addons.mozilla.org/fr/firefox/addon/webhint/
●
En ligne
https://webhint.io/
Atos - @hellosct1 -
Exemple
Atos - @hellosct1 -
Tests automatisés
environnement CI / CD
Atos - @hellosct1 -
Tanaguru
●
Outil open source (licence AGPL)
●
Objectif de tester l’accessibilité du site
●
Disponible
– CI / CD
– En ligne
– Github
Atos - @hellosct1 -
Résultat (1/2)
Atos - @hellosct1 -
Résultat (2/2)
Atos - @hellosct1 -
CI / CD
●
Plugin Jenkins
Atos - @hellosct1 -
Les liens
●
W3C
●
https://validator.w3.org/
●
RGAA
●
https://www.numerique.gouv.fr/publications/rgaa-accessibilite/
●
WebHint
●
https://webhint.io/
●
Tanaguru
●
https://www.tanaguru.com/
– CI / CD
●
https://tanaguru-jenkins-plugin.readthedocs.io
Atos - @hellosct1 -
Merci
Christophe Villeneuve
https://hello-design.fr
@hellosct1
@hellosct1@mamot.fr
Armony Altinier

Contenu connexe

Similaire à Tests d'accessibilite par la pratique

Reunion SIT46 du 21 11 2008
Reunion SIT46 du 21 11 2008Reunion SIT46 du 21 11 2008
Reunion SIT46 du 21 11 2008
Cyril Novello
 
Accessibilité web : guide de mise en conformité
Accessibilité web : guide de mise en conformitéAccessibilité web : guide de mise en conformité
Accessibilité web : guide de mise en conformité
Performance Agile
 
Témoignage sur la coordination des applications numériques et du portail dans...
Témoignage sur la coordination des applications numériques et du portail dans...Témoignage sur la coordination des applications numériques et du portail dans...
Témoignage sur la coordination des applications numériques et du portail dans...
bdvo
 

Similaire à Tests d'accessibilite par la pratique (20)

L’innovation pour la ville de demain, guidée par les usages
L’innovation pour la ville de demain, guidée par les usages L’innovation pour la ville de demain, guidée par les usages
L’innovation pour la ville de demain, guidée par les usages
 
meetup devops aix-marseille 27/10/2022
meetup devops aix-marseille 27/10/2022meetup devops aix-marseille 27/10/2022
meetup devops aix-marseille 27/10/2022
 
05/10/17 Matinale Qlik Sense
05/10/17 Matinale Qlik Sense05/10/17 Matinale Qlik Sense
05/10/17 Matinale Qlik Sense
 
Numérique et handicap 2017 journée détude montpellier intervention zenoni
Numérique et handicap 2017  journée détude montpellier intervention  zenoniNumérique et handicap 2017  journée détude montpellier intervention  zenoni
Numérique et handicap 2017 journée détude montpellier intervention zenoni
 
OpenSource & InnerSource pour accélérer les développements
OpenSource & InnerSource pour accélérer les développementsOpenSource & InnerSource pour accélérer les développements
OpenSource & InnerSource pour accélérer les développements
 
Reunion SIT46 du 21 11 2008
Reunion SIT46 du 21 11 2008Reunion SIT46 du 21 11 2008
Reunion SIT46 du 21 11 2008
 
Etat de l'art (et roadmap) de la BI mobile Microsoft
Etat de l'art (et roadmap) de la BI mobile MicrosoftEtat de l'art (et roadmap) de la BI mobile Microsoft
Etat de l'art (et roadmap) de la BI mobile Microsoft
 
References
ReferencesReferences
References
 
JCertif Tunisie 2015 - Le Web sur Mobile, Faisons le point !
JCertif Tunisie 2015 - Le Web sur Mobile, Faisons le point !JCertif Tunisie 2015 - Le Web sur Mobile, Faisons le point !
JCertif Tunisie 2015 - Le Web sur Mobile, Faisons le point !
 
Accessibilité web : guide de mise en conformité
Accessibilité web : guide de mise en conformitéAccessibilité web : guide de mise en conformité
Accessibilité web : guide de mise en conformité
 
Atelier Qualité web / OPQUAST - Cession entreprises - CCI Bordeaux 26 novembr...
Atelier Qualité web / OPQUAST - Cession entreprises - CCI Bordeaux 26 novembr...Atelier Qualité web / OPQUAST - Cession entreprises - CCI Bordeaux 26 novembr...
Atelier Qualité web / OPQUAST - Cession entreprises - CCI Bordeaux 26 novembr...
 
Témoignage sur la coordination des applications numériques et du portail dans...
Témoignage sur la coordination des applications numériques et du portail dans...Témoignage sur la coordination des applications numériques et du portail dans...
Témoignage sur la coordination des applications numériques et du portail dans...
 
Presentation inochi réalisations / développement - Accompagnateur Web
Presentation inochi réalisations / développement - Accompagnateur WebPresentation inochi réalisations / développement - Accompagnateur Web
Presentation inochi réalisations / développement - Accompagnateur Web
 
Jean-Philippe Simonnet (Centre Inffo) : le RGAA, un outil précieux pour prog...
Jean-Philippe Simonnet (Centre Inffo) :  le RGAA, un outil précieux pour prog...Jean-Philippe Simonnet (Centre Inffo) :  le RGAA, un outil précieux pour prog...
Jean-Philippe Simonnet (Centre Inffo) : le RGAA, un outil précieux pour prog...
 
23 vem6 ie23-sit
23 vem6 ie23-sit23 vem6 ie23-sit
23 vem6 ie23-sit
 
Rapport logiciels evenement_payombo_ly
Rapport  logiciels evenement_payombo_lyRapport  logiciels evenement_payombo_ly
Rapport logiciels evenement_payombo_ly
 
SQLI - Club des DSI - Mobilité
SQLI - Club des DSI - MobilitéSQLI - Club des DSI - Mobilité
SQLI - Club des DSI - Mobilité
 
Accessibilité numérique : où en est-on ?
Accessibilité numérique : où en est-on ? Accessibilité numérique : où en est-on ?
Accessibilité numérique : où en est-on ?
 
CV_MohamedHabibABIDI
CV_MohamedHabibABIDICV_MohamedHabibABIDI
CV_MohamedHabibABIDI
 
Présentation Voirin Club DSI EST 150217
Présentation Voirin Club DSI EST 150217Présentation Voirin Club DSI EST 150217
Présentation Voirin Club DSI EST 150217
 

Plus de Christophe Villeneuve

Plus de Christophe Villeneuve (20)

MariaDB une base de donnees NewSQL
MariaDB une base de donnees NewSQLMariaDB une base de donnees NewSQL
MariaDB une base de donnees NewSQL
 
La boîte à outils de développements dans Firefox
La boîte à outils de développements dans FirefoxLa boîte à outils de développements dans Firefox
La boîte à outils de développements dans Firefox
 
pister les pisteurs
pister les pisteurspister les pisteurs
pister les pisteurs
 
controler vos donnees éthiques dans le web
controler vos donnees éthiques dans le webcontroler vos donnees éthiques dans le web
controler vos donnees éthiques dans le web
 
Infrastructure as code drupal
Infrastructure as code drupalInfrastructure as code drupal
Infrastructure as code drupal
 
Mariadb une base de données NewSQL
Mariadb une base de données NewSQLMariadb une base de données NewSQL
Mariadb une base de données NewSQL
 
Open Source et contribution : Une association gagnante
Open Source et contribution : Une association gagnanteOpen Source et contribution : Une association gagnante
Open Source et contribution : Une association gagnante
 
Pentest bus pirate
Pentest bus piratePentest bus pirate
Pentest bus pirate
 
Peur de la migration vers l’open source ?
Peur de la migration vers l’open source ?Peur de la migration vers l’open source ?
Peur de la migration vers l’open source ?
 
La sécurité applicative par le design
La sécurité applicative par le designLa sécurité applicative par le design
La sécurité applicative par le design
 
Foxfooding semaine 3
Foxfooding semaine 3Foxfooding semaine 3
Foxfooding semaine 3
 
Foxfooding
FoxfoodingFoxfooding
Foxfooding
 
Accessibilite web wcag rgaa
Accessibilite web wcag rgaaAccessibilite web wcag rgaa
Accessibilite web wcag rgaa
 
Mozilla french speaking community activites
Mozilla french speaking community activitesMozilla french speaking community activites
Mozilla french speaking community activites
 
Monitoring dynamique : Grafana et Microsoft
Monitoring dynamique : Grafana et MicrosoftMonitoring dynamique : Grafana et Microsoft
Monitoring dynamique : Grafana et Microsoft
 
Etes vous-pret pour php8 ?
Etes vous-pret pour php8 ?Etes vous-pret pour php8 ?
Etes vous-pret pour php8 ?
 
Le futur de l'authentification webAuthn
Le futur de l'authentification webAuthnLe futur de l'authentification webAuthn
Le futur de l'authentification webAuthn
 
Send large files with addons
Send large files with addonsSend large files with addons
Send large files with addons
 
Donnez la voix aux machines
Donnez la voix aux machinesDonnez la voix aux machines
Donnez la voix aux machines
 
La réalité mélangée dans vos applications
La réalité mélangée dans vos applicationsLa réalité mélangée dans vos applications
La réalité mélangée dans vos applications
 

Tests d'accessibilite par la pratique

  • 2. Atos - @hellosct1 - Aujourd’hui ● Accessibilité : Rappel ● Tests de validation manuelle ● Tests de validation automatique dans un environnement CI / CD
  • 4. Atos - @hellosct1 - Accessibilité numérique ? L’accessibilité numérique signifie que les sites web, technos et outils sont conçus et développés pour que les personnes handicapées puissent les utiliser
  • 5. Atos - @hellosct1 - C’est à dire
  • 6. Atos - @hellosct1 - Les types d’handicap
  • 7. Atos - @hellosct1 - RGAA ● Référentiel Général d’Accessibilité pour les Administrations ● V 4.0 – publié 2019 https://www.numerique.gouv.fr/publications/rgaa-accessibilite/
  • 8. Atos - @hellosct1 - Thématiques ● Images ● Cadres ● Couleurs ● Multimédia ● Tableaux ● Liens ● Scripts ● Eléments obligatoires ● Structure de l’information ● Présentation de l’information ● Formulaires ● Navigation ● Consultation
  • 9. Atos - @hellosct1 - Exemple thématique
  • 10. Atos - @hellosct1 - Tests de validation manuelle
  • 11. Atos - @hellosct1 - Hints ● Vérifie les bonnes pratiques et les erreurs courantes : – Accessibilité – Performance – Sécurité – Compatibilité ● Addon Firefox https://addons.mozilla.org/fr/firefox/addon/webhint/ ● En ligne https://webhint.io/
  • 12. Atos - @hellosct1 - Exemple
  • 13. Atos - @hellosct1 - Tests automatisés environnement CI / CD
  • 14. Atos - @hellosct1 - Tanaguru ● Outil open source (licence AGPL) ● Objectif de tester l’accessibilité du site ● Disponible – CI / CD – En ligne – Github
  • 15. Atos - @hellosct1 - Résultat (1/2)
  • 16. Atos - @hellosct1 - Résultat (2/2)
  • 17. Atos - @hellosct1 - CI / CD ● Plugin Jenkins
  • 18. Atos - @hellosct1 - Les liens ● W3C ● https://validator.w3.org/ ● RGAA ● https://www.numerique.gouv.fr/publications/rgaa-accessibilite/ ● WebHint ● https://webhint.io/ ● Tanaguru ● https://www.tanaguru.com/ – CI / CD ● https://tanaguru-jenkins-plugin.readthedocs.io
  • 19. Atos - @hellosct1 - Merci Christophe Villeneuve https://hello-design.fr @hellosct1 @hellosct1@mamot.fr Armony Altinier