Partie 13 — Mobile, responsive & mouvement
⏱️ TL;DR — Le mobile n’est pas « le même site en plus petit » : il ajoute ses propres exigences d’accessibilité. Les cibles doivent être assez grandes et espacées pour un doigt qui tremble, les gestes doivent toujours avoir une alternative simple, le zoom ne doit jamais être bloqué, et les lecteurs d’écran tactiles (VoiceOver, TalkBack) se pilotent au balayage. À cela s’ajoute le mouvement : une animation mal maîtrisée peut littéralement donner la nausée à quelqu’un ou déclencher une crise d’épilepsie. Cette partie couvre l’a11y mobile, responsive et le respect du mouvement réduit.
Le problème qu’on résout
La plupart des équipes testent l’accessibilité au clavier, sur desktop, avec NVDA. Puis elles livrent une app utilisée à 70 % sur mobile, au doigt, dans le métro, en marchant. Les problèmes changent : plus de clavier, plus de survol, des cibles minuscules collées les unes aux autres, des gestes « swipe » sans alternative, un viewport qui interdit de zoomer, et des animations qui bougent partout. Cette partie te donne les réflexes propres au tactile et au mouvement — ceux qu’on oublie quand on ne teste que sur ordinateur.
Ce que tu sauras faire à la fin de cette partie
- Dimensionner et espacer des cibles tactiles utilisables par tout le monde (2.5.8).
- Fournir une alternative simple à chaque geste complexe ou multipoint (2.5.1, 2.5.2, 2.5.7).
- Laisser le contenu s’afficher en portrait et paysage (1.3.4) et ne jamais désactiver le zoom.
- Tester avec les lecteurs d’écran mobiles (VoiceOver, TalkBack) et connaître leurs gestes.
- Respecter
prefers-reduced-motion, éviter les flashs (2.3.1) et rendre le mouvement automatique contrôlable (2.2.2).
Les chapitres
| # | Chapitre | En un mot |
|---|---|---|
| 13.1 | Cibles tactiles | Taille min 24×24, viser 44, espacer. |
| 13.2 | Gestes & pointeur | Toujours une alternative au swipe/pincement. |
| 13.3 | Orientation & zoom | Portrait + paysage, ne jamais bloquer le zoom. |
| 13.4 | Lecteurs d’écran mobiles | VoiceOver, TalkBack, navigation au balayage. |
| 13.5 | Mouvement & animation | Mouvement réduit, flashs, pause/stop. |
On commence : Cibles tactiles.