Introduction
Quand on parle d'accessibilité web, la plupart des développeurs pensent immédiatement aux personnes aveugles et aux lecteurs d'écran. C'est un bon début, mais c'est insuffisant. Les troubles visuels ne représentent qu'une partie des situations de handicap face au numérique.
Selon l'OMS, plus d'un milliard de personnes dans le monde vivent avec une forme de handicap. En France, 12 millions de personnes sont concernées selon les chiffres du gouvernement. Et au-delà du handicap permanent, nous sommes tous potentiellement en situation de handicap temporaire ou situationnel.
Les types de handicap souvent négligés
Handicaps cognitifs et neurologiques
Ils représentent la catégorie la plus large et la plus diversifiée :
Troubles DYS (dyslexie, dyscalculie, dyspraxie) :
- 6 à 8 % de la population française selon l'INSERM
- Difficulté à lire des textes longs ou mal structurés
- Confusion entre certaines lettres ou chiffres
Troubles de l'attention (TDAH) :
- 5 % des adultes selon la HAS (Haute Autorité de Santé)
- Difficulté à se concentrer sur un contenu long
- Sensibilité aux distractions visuelles (animations, pop-ups)
Troubles du spectre autistique :
- Environ 1 % de la population (OMS)
- Sensibilité sensorielle (couleurs vives, sons automatiques)
- Besoin de prévisibilité et de cohérence dans l'interface
Épilepsie :
- 600 000 personnes en France (FFRE)
- Les animations rapides et les flashs peuvent déclencher des crises
- La norme WCAG impose un maximum de 3 flashs par seconde
Handicaps moteurs
Paralysie et mobilité réduite des membres supérieurs :
- Utilisation du clavier seul, de commutateurs (switches), de systèmes de pointage alternatifs
- Les zones cliquables trop petites sont inaccessibles
Tremblements (Parkinson, tremblement essentiel) :
- 200 000 personnes atteintes de Parkinson en France
- Difficulté à cliquer sur des éléments précis
- Les menus déroulants au survol sont particulièrement problématiques
Blessures temporaires :
- Bras dans le plâtre, tendinite, syndrome du canal carpien
- Navigation à une seule main, impossibilité d'utiliser la souris
Handicaps situationnels
Ce concept est essentiel : tout le monde est en situation de handicap à un moment donné.
| Handicap permanent | Handicap temporaire | Handicap situationnel |
|---|---|---|
| Surdité | Otite | Environnement bruyant |
| Cécité | Dilatation pupillaire | Soleil sur l'écran |
| Paralysie du bras | Bras dans le plâtre | Bébé dans les bras |
| Trouble cognitif | Commotion cérébrale | Stress, fatigue, multitâche |
Solutions concrètes pour chaque type de handicap
Pour les handicaps cognitifs
Structure et lisibilité :
- Utiliser des titres hiérarchiques clairs (H1 → H2 → H3)
- Paragraphes courts (3-4 lignes maximum)
- Listes à puces plutôt que des blocs de texte
- Langage simple et direct (niveau B1-B2 selon le CECRL)
Typographie :
- Taille de police minimum de 16 px pour le corps de texte
- Interligne de 1.5 minimum
- Éviter le texte justifié (les espaces irréguliers gênent la lecture)
- Préférer les polices sans empattement (sans-serif)
Navigation :
- Fil d'Ariane visible
- Barre de progression pour les contenus longs
- Résumé ou table des matières en début d'article
- Possibilité de revenir facilement en arrière
Distractions :
- Pas d'animation automatique ou possibilité de la stopper
- Pas de contenu audio ou vidéo en lecture automatique
- Respecter la media query
prefers-reduced-motion
@media (prefers-reduced-motion: reduce) {
* {
animation-duration: 0.01ms !important;
transition-duration: 0.01ms !important;
}
}Pour les handicaps moteurs
Zones cliquables :
- Taille minimum de 44×44 pixels (recommandation WCAG 2.1)
- Espacement suffisant entre les éléments interactifs
- Éviter les liens trop proches les uns des autres
Navigation au clavier :
- Tous les éléments interactifs doivent être atteignables au clavier
- L'ordre de tabulation doit être logique
- L'indicateur de focus doit être clairement visible
:focus-visible {
outline: 3px solid #005fcc;
outline-offset: 2px;
}Éviter les interactions complexes :
- Les glisser-déposer doivent avoir une alternative (boutons)
- Les menus au survol doivent aussi fonctionner au clic
- Les délais d'inactivité doivent être configurables
- Les gestes complexes (pinch, swipe) doivent avoir des alternatives
Pour les handicaps auditifs
Contenu multimédia :
- Sous-titres pour toutes les vidéos (pas les sous-titres auto non relus)
- Transcription textuelle pour les podcasts
- Pas d'information transmise uniquement par le son
Alertes et notifications :
- Toujours accompagner les alertes sonores d'un signal visuel
- Les messages d'erreur doivent être textuels, pas seulement un bip
Les outils de test
Tests automatiques
- axe DevTools (extension navigateur) : détecte environ 30 % des problèmes d'accessibilité
- Lighthouse (intégré à Chrome) : audit rapide avec score d'accessibilité
- WAVE (WebAIM) : visualisation des erreurs directement sur la page
Tests manuels indispensables
Les outils automatiques ne détectent qu'une fraction des problèmes. Les tests suivants sont essentiels :
- Navigation clavier uniquement : parcourir tout le site sans souris
- Zoom à 200 % : vérifier que rien ne casse
- Lecteur d'écran : VoiceOver (macOS), NVDA (Windows), TalkBack (Android)
- Mode contraste élevé : vérifier la lisibilité
- Préférences de mouvement réduit : activer
prefers-reduced-motiondans les DevTools
Le cadre légal en France
La loi de 2005
La loi du 11 février 2005 pour l'égalité des droits et des chances impose l'accessibilité des services publics en ligne. Elle a été renforcée en 2019.
Le RGAA
Le Référentiel Général d'Amélioration de l'Accessibilité (RGAA, version 4.1) est la déclinaison française des WCAG. Il impose :
- Obligation de conformité pour les services publics et les entreprises dont le CA dépasse 250 millions d'euros
- Déclaration d'accessibilité obligatoire
- Schéma pluriannuel de mise en accessibilité
- Sanctions jusqu'à 50 000 euros par service non conforme (depuis 2024)
Conclusion
L'accessibilité web ne se résume pas à ajouter des alt sur les images. Elle englobe une diversité de situations — cognitives, motrices, auditives, situationnelles — qui touchent chacun d'entre nous. Concevoir pour l'accessibilité, c'est concevoir pour tous. Et au-delà de l'obligation légale, c'est tout simplement concevoir de meilleurs produits.