Accessibilité du Web et RGAA

Accessibilité du Web et RGAAAccessibilité du Web et RGAA13 avril 13 avril 20102010

Agenda

Pourquoi rendre un site Internet accessible ?

Les contraintes d’accessibilité

Les aides matériels et logiciels aux handicaps et déficiences

Le standard international: les WCAG

Les principaux référentiels français

Zoom sur le référentiel général d’accessibilité pour les administrations (RGAA)

Accessibilité et démarche projet

Qualité Web

MettreMettre lele WebWeb etet sesses servicesservices àà laladispositiondisposition dede toustous lesles individus,individus, quelquel quequesoitsoit leurleur matérielmatériel ouou logiciel,logiciel, leurleurinfrastructureinfrastructure réseau,réseau, leurleur languelanguematernelle,maternelle, leurleur culture,culture, leurleur localisationlocalisationgéographique,géographique, ouou leursleurs aptitudesaptitudesphysiquesphysiques ouou mentalesmentales..

««

Tim Berners-LeeFondateur du W3C

Accessibilité et WebAccessibilité et Web

Agenda








Qualité Web


Une démarche citoyenne. Environ 10 millions de personnes concernées en France (650 millions dans le monde). Favorisation de l’intégration et de l’accès aux contenus Web pour tous. Conformité avec les attentes des outils d’aides aux handicaps (logiciels et matériels). Respect des lois (en France la conformité au RGAA est obligatoire pour les autorités administratives)

Une démarche économique. Diminution des coûts d’exploitation. Diminution des coûts d’évolution et de mise à niveau du site. Diminution des coûts de compensation d’un déficit d’accessibilité

Une démarche qualité. Respect des standards et normes internationales (W3C/WAI). Optimisation des développements (séparation fond/forme), amélioration du référencement. Portabilité et compatibilité logicielle et matérielle des sites Web. Amélioration de l’image de l’entreprise

Agenda








Qualité Web

Les contraintes d’accessibilité (1/3)Accessibilité des contenus

L’ensemble des contenus web doivent être accessibles, sous leur forme originale ou sous une forme alternative, n’altérant pas le niveau d’information fourni à l’internaute.

• Internaute malvoyant ou aveugle•

•

• ne sachant pas lire

• Internaute malvoyant ou aveugle• Texte écrit petit• Contraste entre texte et fond inadapté• Internaute sourd ou malentendant ne sachant pas lire

| texte

• Internaute aveugle ou malvoyant• Internaute utilisant un navigateur en mode texte• Internaute aveugle ou malvoyant• Internaute utilisant un navigateur en mode texte

| image

•

•

• Internaute sourd ou malentendants• Internaute ne disposant pas du matériel adéquate

| son

• Internaute aveugle ou malvoyant• Internaute sourd ou malentendants• Internaute ne disposant pas du matériel adéquate

• Internaute aveugle ou malvoyant• Internaute sourd ou malentendants• Internaute ne disposant pas du matériel adéquate

| vidéoanimation

Défauts d’accessibilitéDéfauts d’accessibilitéDéfauts d’accessibilitéDéfauts d’accessibilité Exemples d’alternative ou de mise en accessibilitéExemples d’alternative ou de mise en accessibilitéExemples d’alternative ou de mise en accessibilitéExemples d’alternative ou de mise en accessibilité

Les contraintes d’accessibilité (2/3)Accessibilité de l’ergonomie

| Lisibilité

| Navigabilité

| Compatibilité et portabilité

• Internaute malvoyant, aveugle ou atteint d’une affection visuelle (daltonisme par exemple)•

• Internaute malvoyant, aveugle ou atteint d’une affection visuelle (daltonisme par exemple)• Utilisation d’un navigateur en mode texte

• Internaute aveugle ou malvoyant• Internaute atteint d’une déficience ou d’un handicap moteur• Utilisation d’un navigateur en mode texte• Utilisation d’une aide matériel à la navigation

• Internaute aveugle ou malvoyant• Internaute atteint d’une déficience ou d’un handicap moteur• Utilisation d’un navigateur en mode texte• Utilisation d’une aide matériel à la navigation

•

texte par exemple)•

• Utilisation d’un navigateur spécifique (mode texte par exemple)• Utilisation d’un support spécifique

Défauts d’accessibilitéDéfauts d’accessibilitéDéfauts d’accessibilitéDéfauts d’accessibilité Exemples de mise en accessibilitéExemples de mise en accessibilitéExemples de mise en accessibilitéExemples de mise en accessibilité

L’ergonomie du site web doit permettre d’assurer un confort de navigation et d’accès aux contenus pour l’ensemble des internautes. Les sites doivent donc répondre à des contraintes de :

Les contraintes d’accessibilité (3/3)Accessibilité des développements et des interactions

| Qualité des développements

| Interactions avec l’internaute

• Mauvaise interprétation des contenus par les outils d'aide•

•

•

d’affichage (format, couleurs, …)

• Mauvaise interprétation des contenus par les outils d'aide• Incompatibilité avec les navigateurs web• Incompatibilité avec les supports matériel• Incompatibilité avec les paramètres d’affichage (format, couleurs, …)

•

scripts par le navigateur Web•

saisie de formulaires

• Désactivation ou non-interprétation des scripts par le navigateur Web• Mauvaise signification d’erreur lors de la saisie de formulaires

Défauts d’accessibilitéDéfauts d’accessibilitéDéfauts d’accessibilitéDéfauts d’accessibilité Exemples de mise en accessibilitéExemples de mise en accessibilitéExemples de mise en accessibilitéExemples de mise en accessibilité

Les développements réalisés doivent faciliter l’accessibilité des contenus et les interactions attendues doivent être accessibles à l’ensemble des internautes.

Agenda








Qualité Web

Les aides matériels et logiciels

Les aides logicielsLecteur audio / loupe / contrôle « assisté » de l’ordinateur / clavier virtuel / module de personnalisation des navigateurs web / traducteur automatiques / …

Les aides matérielsTerminal braille / claviers spécifiques / contacteurs Gauffre / joystick /Contacteurs au souffle / …

Des aides nécessaires mais pas suffisantesL’aide apportée pas l’ensemble des logiciels et matériels reste dépendante du site Internet visité et de la façon dont il a été réalisé.

C’est pour cette raison que la C’est pour cette raison que la est un est un aux personnes souffrant d’un handicap ou d’une déficience.aux personnes souffrant d’un handicap ou d’une déficience.

C’est pour cette raison que la C’est pour cette raison que la mise en œuvre de bonnes pratiques mise en œuvre de bonnes pratiques communes communes est un est un prépré--requis à la bonne utilisation des outils et logiciels requis à la bonne utilisation des outils et logiciels venant en aide venant en aide aux personnes souffrant d’un handicap ou d’une déficience.aux personnes souffrant d’un handicap ou d’une déficience.

Agenda








Qualité Web

Le standard international: les WCAGPrésentation

Présentation. Les WCAG (Web Content Accessibility Guidelines) sont un recueil de bonnes pratiques pour rendre les contenus Web plus accessibles, considérées comme la référence internationale.. Les WCAG sont le résultat du travail de la WAI (Web Accessibility Initiative, W3C). . La version en vigueur est la 2.0, publiée en décembre 2008.

Objectifs. Rendre les contenus Web plus faciles d'utilisation aux utilisateurs en général :

- indépendamment de la déficience ou du handicap,- indépendamment de la technologie ou du matériel (ordinateur, mobile, PDA, Web TV, …)

Classification: les niveaux WCAG. Les critères favorisant l’accessibilité des sites Web sont classifiés selon 3 niveaux croissants :

A

AA

AAA

Critères de succès essentiels pouvant raisonnablement s’appliquer à toutes les ressources Web.

Critères de succès pouvant raisonnablement s’appliquer à toutes les ressources Web.

Critères de succès ne s’appliquant pas à toutes les ressources Web.

Le standard international: les WCAGL’organisation en 4 principes

Principe 1: PerceptibleL’information et les composants de l’interface utilisateur doivent être présentés à l’utilisateur de façon à ce qu’il puisse les percevoir.

Principe 2: UtilisableLes composants de l’interface utilisateur et de navigation doivent être utilisables.

Principe 3: CompréhensibleLes informations et l’utilisation de l’interface utilisateur doivent être compréhensibles.

Principe 4: RobusteLe contenu doit être suffisamment robuste pour être interprété de manière fiable par une large variété d’agents utilisateurs, y compris les technologies d’assistance.





•• Proposer des Proposer des équivalents textuels équivalents textuels à tout contenu à tout contenu non textuel qui pourra alors être présenté sous non textuel qui pourra alors être présenté sous d'autres formes selon les besoins de l'utilisateur : d'autres formes selon les besoins de l'utilisateur : grands caractères, braille, synthèse vocale, grands caractères, braille, synthèse vocale, symboles ou langage simplifié.symboles ou langage simplifié.

•• Proposer des Proposer des versions de remplacement versions de remplacement aux aux médias temporels.médias temporels.

•• Créer un Créer un contenucontenu qui puisse être qui puisse être présenté de présenté de différentes manières sans perte d'information différentes manières sans perte d'information ni ni de structure (par exemple avec une mise en page de structure (par exemple avec une mise en page simplifiée).simplifiée).

•• Faciliter la Faciliter la perception visuelle et auditive perception visuelle et auditive du du contenu par l'utilisateur, notamment en contenu par l'utilisateur, notamment en séparant séparant le premier plan de l'arrièrele premier plan de l'arrière--plan.plan.









•• Rendre toutes les fonctionnalités accessibles au Rendre toutes les fonctionnalités accessibles au clavier,clavier,

•• Laisser à l'utilisateur suffisamment de temps pour lire Laisser à l'utilisateur suffisamment de temps pour lire et utiliser le contenu,et utiliser le contenu,

•• Ne pas concevoir de contenu susceptible de Ne pas concevoir de contenu susceptible de provoquer des crises,provoquer des crises,

•• Fournir à l'utilisateur des éléments d'orientation Fournir à l'utilisateur des éléments d'orientation pour naviguer, trouver le contenu et se situer dans le pour naviguer, trouver le contenu et se situer dans le site.site.









• Rendre toutes les fonctionnalités accessibles au clavier,

• Laisser à l'utilisateur suffisamment de temps pour lire et utiliser le contenu,

• Ne pas concevoir de contenu susceptible de provoquer des crises,

• Fournir à l'utilisateur des éléments d'orientation pour naviguer, trouver le contenu et se situer dans le site.

compréhensible

et fonctionnent

erreurs de saisie

• Rendre le contenu textuel lisible et compréhensible.

• Faire en sorte que les pages apparaissent et fonctionnent de manière prévisible.

• Aider l’utilisateur à éviter et à corriger les erreurs de saisie.





• Proposer des équivalents textuels à tout contenu non textuel qui pourra alors être présenté sous d'autres formes selon les besoins de l'utilisateur : grands caractères, braille, synthèse vocale, symboles ou langage simplifié.

• Proposer des versions de remplacement aux médias temporels.

• Créer un contenu qui puisse être présenté de différentes manières sans perte d'information ni de structure.

• Faciliter la perception visuelle et auditive du contenu par l'utilisateur, notamment en séparant le premier plan de l'arrière-plan.






































compréhensible

et fonctionnent

erreurs de saisie












•• Rendre toutes les Rendre toutes les fonctionnalités fonctionnalités accessibles au clavieraccessibles au clavier,,

•• Laisser à l'utilisateur suffisamment de Laisser à l'utilisateur suffisamment de temps pour lire et utiliser le contenutemps pour lire et utiliser le contenu,,

•• Ne pas concevoir de contenu susceptible Ne pas concevoir de contenu susceptible de de provoquer des crisesprovoquer des crises,,

•• Fournir à l'utilisateur des Fournir à l'utilisateur des éléments éléments d'orientation d'orientation pour naviguer, trouver le pour naviguer, trouver le contenu et se situer dans le site.contenu et se situer dans le site.






































compréhensible

et fonctionnent

erreurs de saisie













































compréhensible

et fonctionnent

erreurs de saisie












•• Rendre toutes les Rendre toutes les fonctionnalités fonctionnalités accessibles au clavieraccessibles au clavier,,

•• Laisser à l'utilisateur suffisamment de Laisser à l'utilisateur suffisamment de temps pour lire et utiliser le contenutemps pour lire et utiliser le contenu,,

•• Ne pas concevoir de contenu susceptible Ne pas concevoir de contenu susceptible de de provoquer des crisesprovoquer des crises,,

•• Fournir à l'utilisateur des Fournir à l'utilisateur des éléments éléments d'orientation d'orientation pour naviguer, trouver le pour naviguer, trouver le contenu et se situer dans le site.contenu et se situer dans le site.

avec les agents utilisateurs actuels et futurs, y compris les technologies d’assistance.

• Optimiser la compatibilité des contenus avec les agents utilisateurs actuels et futurs, y compris les technologies d’assistance.

Agenda








Qualité Web


Les principaux référentiels français en vigueur sont basés sur les WCAG.

Le référentiel Accessiweb. Mis en œuvre par l’association BrailleNet. La version 2.0 est parue en décembre 2009.. Le « label Accessiweb » qualifie l’accessibilité d’un site Web dans son concept général. La « barre Accessiweb » permet de tester l’accessibilité des contenus.

Le référentiel Ocawa. Mis en œuvre par Urbilog et Orange. . L’outil associé est proposé sous différentes formes (toolbar, webservice, en ligne, …) et permet de mesure la conformité d’un site Web à différents référentiels : Ocawa, RGAA, WCAG

Le référentiel Opquast. Ensemble de bonnes pratiques pour la qualité des services en ligne mis en œuvre par Temesis.. Opquast intègre des critères d’accessibilité mais va au-delà (contenu, cookies, sécurité, navigation, …).. L’outil « Mon-Opquast » permet de mesurer la conformité d’un site Web à différents référentiels: Opquast, RGAA v1/v2.2, Accessiweb v1.1/v2.0

Le référentiel général d’accessibilité pour les administrations (RGAA). Mis en œuvre par la DGME. La version 2.2 est parue en octobre 2009 (publication d’un arrêté).. Référentiel à destination des administrations publiques.. L’outil de mesure de conformité au RGAA est destiné aux administrations publiques.

http://www.ocawa.com/fr/

Agenda








Qualité Web

Zoom sur le RGAA (1/4)Historique des mesures pour favoriser l’accessibilité

EVOLUTION DE L’ADMINISTRATIONEVOLUTION DE L’ADMINISTRATION

•• EVOLUTION INTERNATIONALEEVOLUTION INTERNATIONALE (WCAG)(WCAG)

1999199919991999 20092009200920092000200020002000 -- -- -- ---- -- -- -- 2004200420042004 2005200520052005 2006200620062006 2007200720072007 200820082008200819991999 2009200920002000 -- -- -- -- 20042004 20052005 20062006 20072007 20082008

1999Création du WAI (Web Accessibility Initiative)

10/1999Circulaire du PM pour favoriser l’accessibilité

des sites Internet publics

02/2004L’ADAE publie le Référentiel d’Accessibilité des services

Internet de l’Administration

02/2005Loi 2005-102 pour l’égalité des droits et des chances, la participation et la

citoyenneté des personnes handicapés

09/2007Publication du RGAA v1

05/2009Publication du décret

d’application de l’article 47 de la loi de 2005

06/2009Publication de la version agréée en

français des WCAG 2.0

10/2009Publication de l’arrêté

relatif au RGAA

12/2008Publication des WCAG 2.0

05/1999Publication des WCAG 1.0

Zoom sur le RGAA (2/4)Objectifs et périmètre d’application

Contexte légal. Le RGAA résulte de la loi n° 2005-102 du 11 février 2005 pour l’égalité des droits et des chances, la participation et la citoyenneté des personnes handicapées. Il a été mis en œuvre par la DGME.. L'arrêté relatif au RGAA a été publié le 29 octobre 2009 (JORF n° 0251 page 18329 texte n° 31).. Son application est obligatoire justifiée par la publication d’une attestation de conformité au RGAA.

Objectifs. Favoriser l’accessibilité des contenus diffusés sous forme numérique à travers les canaux Web, Téléphonie et Télévisuel. . Guider les autorités administratives dans l’adoption et la mise en œuvre de bonnes pratiques.. Offrir aux autorités administratives la possibilité de mesurer la conformité de leurs contenus Web au RGAA.

Services concernés. Il s’agit des services de l’Etat, des collectivités territoriales, des agences, des établissements publics, des entreprises publiques, et des personnes privées investies d’une mission de service public.

Périmètre d’application. Les sites Internet et intranet.. Les applications web (toute application « métier » à laquelle on accède au moyen d’un navigateur web et qui vise tout ou partie des agents d’un ministère ou le grand public. Exemple : inscription aux concours, logiciel de gestion de congés…).

Zoom sur le RGAA (3/4)Organisation du RGAA

RGAA. Le RGAA résulte de la loi n°2005-102 du 11 février 2005pour l’égalité des droits et deschances, la participation et lacitoyenneté des personneshandicapées.

Guided’accompagnement. Il vient compléter le RGAA enprécisant le contexte et ladémarche et en proposant uneméthode d’application duréférentiel dans le cadre de lamise en œuvre de projets demise en accessibilité

Annexe 1: Critères desuccès. Ils sont la traduction enrichiedes WCAG 2.0. Ils dictent lesbonnes pratiques à respecterpour assurer l’accessibilité descontenus web. Ils sont organisésselon les 4 principes des WCAG2.0.

Annexe 2: tests deconformité au RGAA. Ils ont pour objectif de mesurerla conformité des contenus webau RGAA. Ils sont au nombre de187 et organisés en 12thématiques : cadres / couleurs/ formulaires / image /multimédia / navigation /présentation / scripts /standards / structure / tableaux/ texte

Annexe 3: table decorrespondance. Le RGAA résulte de la loi n°2005-102 du 11 février 2005pour l’égalité des droits et deschances, la participation et lacitoyenneté des personneshandicapées.

RRéférentieléférentielGGénéralénérald’d’AAccessibilité pour lesccessibilité pour lesAAdministrationsdministrations



Zoom sur le RGAA (4/4)Modalités d’application et impacts

Délais de mise en application. Le décret d’application de l’article 47 de la loi de 2005 prévoit une mise en application et une conformité au RGAA dans les délais suivants (à compter de la publication du décret):

3 ans pour les services de communication publique en ligne des collectivités territoriales et des établissements publics qui en dépendent 2 ans pour les services de communication publique en ligne de l'Etat et des établissements publics qui en dépendent

Niveau WCAG et attestation de conformité au RGAA. Le niveau d’accessibilité imposé par le RGAA est le AA. C’est également le niveau préconisé par la communauté européenne.. L’attestation de conformité est le reflet de l’effort d’accessibilité engagé sur le site Internet et du niveau de conformité avec le RGAA atteint. Elle doit être accessible en ligne.

Impacts. Pour les administrations: l’ensemble des sites concernés doivent être mis en conformité avec le RGAA / Le RGAA doit être intégré dans les appels d’offres portant sur des sites Web. Pour les prestataires de services: il est indispensable d’intégrer cette nouvelle contrainte, de la rédaction de la proposition commerciale à la recette de l’application ou du site web.

Agenda








Qualité Web


ANALYSE DES ANALYSE DES BESOINSBESOINS

REDACTION DU REDACTION DU CDCCDC

ERGONOMIE ET ERGONOMIE ET DESIGNDESIGN

INTEGRATION INTEGRATION DES GABARITSDES GABARITS

DEVELOPPEMENTDEVELOPPEMENT

RECETTERECETTEAUDIT DE AUDIT DE

L’EXISTANTL’EXISTANT

Chaque phase projet est impliquée dans la mise en accessibilité finale du site Web.

AUDIT DE AUDIT DE L’EXISTANTL’EXISTANT

Audit de l’existant

. Il vient compléter le RGAA en précisantle contexte et la démarche et enproposant une méthode d’application duréférentiel dans le cadre de la mise enœuvre de projets de mise enaccessibilité

Détermination du niveau de conformité avec le RGAA Détermination du niveau de conformité avec le RGAA

Identification des points critiquesIdentification des points critiques

Détermination du GAP en terme d’accessibilité Détermination du GAP en terme d’accessibilité


















Analyse des besoins

. Recueil des besoins utilisateurs

. Définition des types de contenus

. Définition de la cible du site Web

Impact sur le niveau d’accessibilité cibleImpact sur le niveau d’accessibilité cible

Vigilance sur les contraintes d’accessibilité des contenusVigilance sur les contraintes d’accessibilité des contenus

Identification des thématiques de testsIdentification des thématiques de tests


















Analyse des besoins









Rédaction du cahier des charges

. Formalisation des exigences techniqueset fonctionnelles

Mention de l’obligation de respecter le RGAA Mention de l’obligation de respecter le RGAA

Fourniture du RGAA en AnnexeFourniture du RGAA en Annexe


















Analyse des besoins















Ergonomie et Design

. Définition des rubriques, des principesde navigation, de l’organisation descontenus, etc... Réalisation des story-boards. Définition de la charte graphique. Réalisation des maquettes graphiques

Validation de l’accessibilité des prototypes/maquettes Validation de l’accessibilité des prototypes/maquettes graphiques, des gabarits, …graphiques, des gabarits, …

Analyse de faisabilité en terme d’accessibilité Analyse de faisabilité en terme d’accessibilité

Contrôle des grands principes d’ergonomieContrôle des grands principes d’ergonomie


















Analyse des besoins















Ergonomie et Design







Intégration des gabarits

. Intégration des principaux modèles depages. Création des feuilles de styles

Fourniture aux «Fourniture aux « intégrateursintégrateurs » des bonnes pratiques à » des bonnes pratiques à respecterrespecter

Vérification de l’accessibilité des gabarits produitsVérification de l’accessibilité des gabarits produits


















Analyse des besoins















Ergonomie et Design













Développement

. Développement des fonctionnalités dusite. Tests unitaires

Fourniture aux «Fourniture aux « développeursdéveloppeurs » des bonnes pratiques à » des bonnes pratiques à respecterrespecter

Intégration de tests de conformité au RGAA dans les tests Intégration de tests de conformité au RGAA dans les tests unitairesunitaires


















Analyse des besoins















Ergonomie et Design













Développement

. Développement des fonctionnalités dusite. Tests unitaires

Fourniture aux «Fourniture aux « développeursdéveloppeurs » des bonnes pratiques à » des bonnes pratiques à respecterrespecter

Intégration de tests de conformité au RGAA dans les tests Intégration de tests de conformité au RGAA dans les tests unitairesunitaires

RECETTERECETTE


Recette

. Recette fonctionnelle

. Recette techniqueIntégration des tests de conformité au RGAA dans les Intégration des tests de conformité au RGAA dans les

scénarios de Recettescénarios de Recette

Production de l’attestation de conformitéProduction de l’attestation de conformité

Les acteurs impliqués dans l’accessibilitéL’ensemble des acteurs projets sont impliqués dans la démarche de mise en accessibilité d’un site Web. Par exemple :


Pilotage Projet. Directeur de projet : il définit la cible en terme d’audience du futur site Web et le niveau cible d’accessibilité.. Chef de projet : il intègre dans ses plannings les actions liées à la mise en accessibilité et choisi le référentiel

Equipes de conception. Graphiste / Ergonome / Analystes fonctionnelles et techniques. Ils prennent en compte les contraintes liées à l’accessibilité dans la conception du site Web

Equipes de réalisation. Développeurs: ils intègrent dans les normes de développements les standards du W3C et les critères de succès du niveau d’accessibilité cible. Ils enrichissent leurs tests unitaires de tests d’accessibilité.

Equipes de Recette. Rédacteurs des scénarii/tests de Recette: ils intègrent dans les scénarii des tests d’accessibilité, liés au niveau cible et au référentiel choisi.

Agenda





Les référentiels français



Qualité Web

Qualité Web

pas de frames

contraste adapté

séparation du fond et de la forme

attribut ALT renseigné

pas d’ouverturede fenêtres sans prévenir

plan du site et moteur de recherche

Alternative aux scripts

balise TITLE pertinente

conformité aux normes W3C

contenus textes téléchargeables

L’accessibilité s’inscrit dans une démarche qualité du Web

. La notion de Qualité Web correspond à la volonté d’améliorer le service rendu à l’internaute à travers différents domaines:

- accessibilité,- code source,- gestion des contenus,- navigation,- formulaires, - sécurité,- interaction, - etc…

. Le respect de 10 principes de base dans la mise en œuvre de sites Web induit automatiquement un niveau d’accessibilité convenable.

Contact

Fabrice CroizéManager, Business System Integration

e-mail : [email protected]: +33 621728370phone : +33 158863000

Technology

Accessibilité du Web et RGAA