Le site du Conseil départemental du Pas-de-Calais est exemplaire en terme d'accessibilité numérique. Quelles méthodes ont été utilisées pour y parvenir ? Et quels écueils ?
2. L’accessibilité numérique, c’est :
« Mettre le web et ses services à la disposition de tous les
individus, quels que soient leur matériel ou logiciel, leur
infrastructure réseau, leur langue maternelle, leur culture,
leur localisation géographique ou leurs aptitudes physiques
ou mentales. »
Tim Berners-Lee (Directeur du W3C et inventeur du World Wide Web)
3. Massacrons gaiement
quelques poncifs :
• Ça n’est pas QUE pour les non-voyants
• Ça ne concerne pas QUE « trois sourds et deux malvoyants »
• Ça n’est pas forcément MOCHE
• Ça n’est pas une bête SURCOUCHE de code qu’on étale par-
dessus
• Ça ne nuit pas à la lisibilité des contenus
• Ça ne coûte pas cinq fois plus cher.
5. Pourquoi faire de l’accessible ?
• Pour une certaine idée du Design Universel
• Parce qu’un Département, c’est du service public
• Parce que c’est la loi
• Chouette, enfin une norme, une vraie !
• Et …
7. État des lieux avant de
commencer
• Un vieux site 1.0
• Un chef de projet / webdesigner-ergonome / publicateur
• Une publicatrice rédactrice
• Un budget serré
• Et…
• …C’est tout
• Ah si, une question :
9. D’abord :
1. Une p’tite formation en 2008 pour découvrir le RGAA
2. On essaie d’éduquer en interne (on y reviendra)
3. On décide de se faire accompagner d’une AMO, Temesis
4. Avec leur aide, on écrit un beau cahier des charges pour
trouver le prestataire qui va nous faire ça bien.
10. Cahier des charges, notre recette :
• Définir les objectifs dès le départ et les critères de succès
• Ne pas imposer de technologies et exprimer des besoins utilisateurs
uniquement
• Mentionner l’accessibilité (presque) à chaque page du document
• Demander aux candidats :
– une note pour présenter leur vision de l’accessibilité numérique
– de choisir deux ou trois fonctionnalités et détailler leur mise en
œuvre dans le respect du RGAA
• Fournir une maquette graphique déjà aux normes, bien
qu’adaptable
12. • Janvier 2010 : première version du site orienté RGAA. Niveau AA
atteint (conformité globale 83%). Toute première déclaration de
conformité.
• Octobre 2010 : seconde version (91%)
• Mars 2012 : labellisation Accessiweb Argent Trois étoiles d’Or
• Décembre 2013 : labellisation OPQUAST Website
• Janvier 2014 : troisième version, responsive (95% conformité RGAA
2.2)
• Juin 2014 : Le Pas-de-Calais est associé à la refonte du RGAA
• Novembre 2014 : Présentation une fois du site à l’European Disability
Forum au Parlement Européen de Bruxelles
• Décembre 2014 : pasdecalais.fr devient pilote pour éprouver le RGAA 3
• Juin 2015 : pasdecalais.fr est le premier site français labellisé E-
Accessible et obtient le niveau AA+
13. Pilote pour le RGAA 3 ?
• Une prise de connaissance du nouveau référentiel dès sa
sortie en bêta
• Un audit et des chantiers d’améliorations immédiatement mis
en œuvre…
• … malgré des questions sur le canal d’échange
• Un audit pilote du site début décembre 2014
14. Constats sur cette démarche pilote
• Un premier retour d’audit difficile
• Des interrogations sur notre démarche et les moyens de la
mettre en œuvre et de la continuer
• Des échanges et des solutions !
16. Notre philosophie aujourd’hui :
• Une charte éditoriale précise et sans cesse affinée, pour
communiquer et former en interne
• Des process de création sans cesse améliorés (et améliorables, sans
déconner)
• Des audits réguliers et un accompagnement réactif
• Une volonté de liberté par rapport au référentiel, en le métissant
d’autres (qualité, mobile…) ou de nos propres « règles »
• Une non prise en compte de la séparation des niveaux des critères
A, AA et AAA
• Montrer qu’un site accessible n’est pas forcément laid
• Inciter les autres à nous copier/suivre/devancer
18. 1. Ça se pense dès le départ
Tout est dans le titre.
19. 2. Le suivi au quotidien
Il ne suffit pas qu’un site soit bien conçu
et bien développé pour être accessible.
Ça se joue chaque jour,
à travers la gestion éditoriale.
20. Exemples :
• Un outil de publication débarrassé de toutes fioritures
• Une charte éditoriale précise et à jour
• Un acharnement interne
• Des process de publication pour les vidéos, afin de
gagner du temps sur les sous-titrages / transcriptions /
audio-descriptions
23. 1. Les prestataires
• Comment les choisir ?
• Comment juger de leur fiabilité ?
• Comment valider leur production en regard des normes ?
• Comment s’assurer du maintien de la qualité dans le suivi ?
• Comment les inciter à s’y mettre ?
24. • Un cahier des charges orienté
• Demander une note sur la compréhension du sujet et de
développer quelques points de fonctionnalités dans la
réponse au marché public
• Faire peser les CV et expériences
• Un petit couplet contractualisé sur le niveau attendu
• Faire planer l’ombre inquiétante d’un audit surprise à tout
moment
• Compter sur la communication de l’État
Quelques pistes :
25. 2. La méthode
Vous voulez un site accessible ?
Mais… comment le produire ?
Des experts savent l’évaluer.
26. • Des templates disponibles
• Des bibliothèques d’outils certifiés conformes
• Des bonnes pratiques de création
• Des guides de travail et d’accompagnement pour
l’élaboration…
• … et pour le suivi éditorial
• Motiver les web agencies et les prestataires à intégrer
l’accessibilité dans leurs outils ou process (on y revient)
Quelles pistes pour de petites
structures ?
27. 3. L’éducation
• En interne :
– Agents
– Décideurs
• Des prestataires, again and again.
• Du(des) grand(s) public(s) (exemples : PMRt, Dyslexia…)
28. PMRt (Personne à Mobilité Réduite temporaire)
Ma souris casse à quinze minutes de l’échéance
pour déclarer mes impôts en ligne.
Qui m’a appris à utiliser la navigation clavier ?
Mon collègue est au téléphone.
Comment puis-je regarder le discours du Président en vidéo sur l’intranet sans le
déranger ?
Dyslexie
Histoire vraie : notre collègue développeur a découvert le confort de lire avec une
police adaptée à son besoin en testant pasdecalais.fr…
29. • Prendre en compte le mobile, le responsive, les nouveaux
usages et technologies
• Intégrer de nouveaux outils simples à mettre en place
4. Rafraîchir WCAG
30. Il y a encore du chemin, mais nos
semelles ne sont pas usées.
Merci à tous !