Introduction à l'accessibilité du Web
Collège Édouard-Montpetit
30 novembre 2010
Avant de débuter....
Qu'est-ce que l'expérience utilisateur?

Facettes de l’expérience utilisateur (Peter Morville)
- Qualité d’une expérience globale, perçue par une personne qui interagit avec un système.
- Ensemble des événements, situations et sensations que vit l’utilisateur face à un produit et qui marque de manière durable, positive ou négative son souvenir.
Qu'est-ce que l'accessibilité du Web ?

Permet à chaque individu de se réaliser à sa pleine capacité ou à la hauteur de ses ambitions.
- Signifie que les personnes handicapées peuvent percevoir, comprendre, naviguer, interagir avec le Web, et y contribuer.
- Bénéficie également aux personnes âgées ayant des capacités diminuées dues au vieillissement.
Démographie québécoise

- 800 000 personnes handicapées (10,4 % de la population)
- Limitations visuelles
- Limitations auditives
- Limitations motrices
- Limitations cognitives
- Besoins d'adaptation variés selon personnes et situations
- Situations de handicaps permanents ou temporaires
Limitations visuelles

- Aveugles ou malvoyants, basse vision, daltoniens, etc.
- Affecte 17% des américains :
- Lecteurs d'écrans
- Afficheurs braille
- Logiciels de grossissement
- Lunettes
- Etc.
Limitations auditives

- Sourdes ou malentendants, environnements bruyants ou silencieux, sans accès à des cartes de son ou hauts-parleurs
- Affecte 20% des américains :
- Prothèses auditives
- Transcriptions textuelles
- Sous-titrage
- Langue des signes
- Etc.
Limitations motrices

- Vieillissement, para ou quadraplégies, arthrite, parkinson, paralysie cérébrale, etc.
- Affecte 24% des américains :
- Reconnaissance vocale
- Logiciels de prédiction de mots
- Souris ou claviers adaptés
- Commutateurs
- Etc.
Limitations cognitives

- Difficultés de compréhension, de concentration, de mémorisation ou de raisonnement, troubles d'apprentissage, etc.
- Affecte 16% des américains :
- Lecteur multimodal
- Synthèse vocale
- Surlignement du texte
- Adaptation des contenus
- Etc.
Les autres clientèles de l'accessibilité
Bien plus de gens que l'on pourrait penser...
- Personnes vieillissantes
- Personnes analphabètes
- Personnes allophones
- Utilisateurs de technologies désuètes
- Utilisateurs de technologies émergentes
- Utilisateurs de connexions à bas débit
- Utilisateurs peu ou pas expérimentés
Vieillissement de la population
- Augmentation de 50 % sur les 50 prochaines années
- 14% de la population québécoise en 2006
- 28% de la population québécoise en 2056
- Diminution progressive des capacités visuelles, auditives, motrices et cognitives (avec l'âge)
- Nous sommes tous concernés!
Les standards d'accessibilité
- Au niveau international
- Consortium du World Wide Web (W3C)
- Standard WCAG 2.0
- Au niveau local
- Gouvernement du Québec
- Standards SGQRI 008
Web Content Accessibility Guidelines 2.0
- 4 principes
- 12 règles
- 61 critères
- perceptible
- utilisable
- compréhensible
- robuste

Contenus perceptibles
- Principe 1: Perceptible
- 1.1 Équivalents textuels
- 1.2 Médias temporels
- 1.3 Adaptable
- 1.4 Distingable
Perceptible : L'information et les composants de l'interface utilisateur doivent être présentés à l'utilisateur de façon à ce qu'il puisse les percevoir.

Contenus utilisables
- Principe 2: Utilisable
- 2.1 Accessibilité au clavier
- 2.2 Délai suffisant
- 2.3 Crises
- 2.4 Navigable
Utilisable : Les composants de l'interface utilisateur et de navigation doivent être utilisables.

Contenus compréhensibles
- Principe 3: Compréhensible
- 3.1 Lisible
- 3.2 Prévisible
- 3.3 Aide à la saisie
Compréhensible : Les informations et l'utilisation de l'interface utilisateur doivent être compréhensibles.

Contenus robustes
Robuste : Optimiser la compatibilité avec les agents utilisateurs actuels et futurs, y compris les technologies d'assistance.

Du point de vue technique
A mené à la catégorisation suivante (selon WCAG 2.0)
- Contenu non-textuel (1.1)
- Média temporel (1.2)
- Perception de la structure (1.3)
- Formulaires (1.3)
- Tableaux de données (1.3)
- Ordre de lecture (1.3)
- Caractéristiques sensorielles (1.3)
- Utilisation de la couleur (1.4)
- Contrastes visuels et sonores (1.4)
- Présentation visuelle du texte (1.4)
- Accessibilité au clavier (2.1)
- Délai de consultation ou d'interaction (2.2)
- Prévention des crises (2.3)
- Accès au contenu principal (2.4)
- Soutien à la navigation (2.4)
- Ordre de tabulation correct (2.4)
- Clarification de la fonction des liens (2.4)
- Définition de la langue (3.1)
- Sens des mots rares et abréviations (3.1)
- Simplification de la langue (3.1)
- Changements de contexte (3.2)
- Proposition de navigation cohérente (3.2)
- Prévention des erreurs (3.3)
- Compatibilité avec les outils (4.1)
Les standards d'accessibilité SGQRI 008
- Démarche gouvernementale
- Influence du W3C
- Trois documents normatifs
- SGQRI 008-01
- SGQRI 008-02
- SGQRI 008-03

SGQRI 008-01 : sites Web
- Près de 70 exigences
- Spécifications techniques (générales et particulières)
- Dispositions transitoires/finales
Champ d'application : Le HTML des sites Web (publics, intranets et extranets) des ministères et organismes du gouvernement du Québec.

SGQRI 008-02 : docs téléchargeables
- Environ 40 exigences
- Spécifications techniques (générales et particulières)
- Dispositions transitoires/finales
Champ d'application : Documents PDF, Word, Excel, Powerpoint et autres formats applicables proposés sur les sites Web des ministères et organismes du gouvernement du Québec.

SGQRI 008-03 : objets multimédia
- Environ 50 exigences
- Spécifications techniques (générales et particulières)
- Dispositions transitoires/finales
Champ d'application : Animations vectorielles, fichiers audio ou vidéo et autres objets multimédia proposés sur les sites Web des ministères et organismes du gouvernement du Québec.

Les problèmes les plus fréquents
Toujours selon la catégorisation inspirée de WCAG 2.0
- Contenu non-textuel (1.1)
- Média temporel (1.2)
- Perception de la structure (1.3)
- Formulaires (1.3)
- Tableaux de données (1.3)
- Ordre de lecture (1.3)
- Caractéristiques sensorielles (1.3)
- Utilisation de la couleur (1.4)
- Contrastes visuels et sonores (1.4)
- Présentation visuelle du texte (1.4)
- Accessibilité au clavier (2.1)
- Délai de consultation ou d'interaction (2.2)
- Prévention des crises (2.3)
- Accès au contenu principal (2.4)
- Soutien à la navigation (2.4)
- Ordre de tabulation correct (2.4)
- Clarification de la fonction des liens (2.4)
- Définition de la langue (3.1)
- Sens des mots rares et abréviations (3.1)
- Simplification de la langue (3.1)
- Changements de contexte (3.2)
- Proposition de navigation cohérente (3.2)
- Prévention des erreurs (3.3)
- Compatibilité avec les outils (4.1)
Équivalents textuels
Affecte les personnes avec des limitations visuelles ou des limitations auditives.
- Balise
<img> et attributs associés
- Rendre en texte les contenus non-textuels?
- Un équivalent textuel?
- Un texte de remplacement?
- Une description?
Navigation au clavier
Affecte les personnes avec des limitations visuelles, motrices, et cognitives.
- Parcours au clavier :
- vérifier l'ordre des contenus
- valider l'ordre de tabulation
- assurer le repérage du focus
- Gestionnaires d'événements
- Indépendance face aux périphériques?
- Compatible avec l'accessibilité?
Structure des contenus
Affecte les personnes avec des limitations visuelles, motrices, et cognitives.
- Rôle unique des balises HTML
- En-têtes de section
<h1> à <h6>
- Listes
<ul> et <ol>
- Respect de la sémantique HTML?
Recours aux couleurs
Affecte les personnes avec des limitations visuelles.
- Info transmise que par la couleur
- Contrastes visuels inadéquats
- Perception sensorielle unique?
Utilisation des formulaires
Affecte les personnes avec des limitations visuelles, motrices et cognitives.
- Organisation du formulaire
- Ordre de tabulation correct
<label for="">, <input id="">...
- Regroupements avec
<fieldset>, <legend>
- Subdivisions des blocs avec
<hn>
- Proximité des étiquettes et des champs
- Prise en charge des erreurs?
Accessibilité fonctionnelle
- Assurer une compatibilité :
- avec les outils d'adaptation informatiques
- au-delà des standards et des grilles
- Éclairer les zones grises du développement Web
- Détecter l'indétectable
- « Voir » avec ses oreilles
- Tester, tester, tester...
"What's in it for me?"
Perspectives et opportunités
- Se démarquer dans un nouveau marché
- Possibilités de stages chez AccessibilitéWeb
- Vie associative : W3Québec, PHP-Québec, etc.
- Circuit de conférences : a11yMTL, ConFoo, etc.
- Programme de certification (PCCAW)
Références
- AccessibilitéWeb
- Microsoft and Accessible Technology
- Statistiques Canada