atelier paris web 2016 testeur en...atelier paris web 2016 alex bernier - braillenet...
TRANSCRIPT
![Page 1: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/1.jpg)
Atelier Paris Web 2016
Alex Bernier - Braillenet (@AssoBraillenet)Olivier Nourry (@OlivierNourry) – Access First
![Page 2: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/2.jpg)
�Test de 3 applis:• Le Monde, l'info en continu• Télé-loisirs, le programme TV• Météo-France
�3 tests• Orientation• Taille des caractères• Restitution avec lecteur d'écran
![Page 3: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/3.jpg)
Parce que
![Page 4: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/4.jpg)
Et aussi
![Page 5: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/5.jpg)
Ou encore
![Page 6: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/6.jpg)
![Page 7: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/7.jpg)
What the F…??
![Page 8: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/8.jpg)
![Page 9: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/9.jpg)
![Page 10: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/10.jpg)
![Page 11: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/11.jpg)
�Pourquoi?• Dans certains usages, le device est fixé (à un
fauteuil, à un lit…)�Comment?
• Autorise la rotation automatique• Ouvre l'appli• Fais pivoter ton device• Vérifie ce qu'il se passe
![Page 12: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/12.jpg)
�Pourquoi?• Compenser les difficultés de lecture sur petit
écran�Comment?
• iOS: Réglages > Général > Accessibilité > Police plus grande
• Android: Paramètres > Affichage > Taille de police• Ouvre l'appli• Vérifie ce qu'il se passe
![Page 13: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/13.jpg)
�Pourquoi?• Le seul moyen de vérifier la perception de
l'appli en lecture non visuelle�Comment?
• Ça dépend…
![Page 14: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/14.jpg)
ANDROID: TALKBACK IOS: VOICEOVER
� Paramètres > Accessibilité > TalkBack > Réglages• Active "Explorer au
toucher"• Active "Faire défiler les
listes automatiquement"• Retourne à l'écran
précédent• Active TalkBack
� Réglages > Général > Accessibilité > VoiceOverou
� Triple-clic sur le boutonou
� "Dis Siri, active VoiceOver"
![Page 15: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/15.jpg)
� D'abord positionne le focus sur l'élément ciblé• Déplace le doigt sur l'écran
ou• Passe d'un élément à l'autre avec un "swipe"
� Puis active-le: double-tape (1 doigt) n'importe où sur l'écran
![Page 16: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/16.jpg)
ANDROID: TALKBACK IOS: VOICEOVER
� Fais glisser avec 2 doigts � Fais glisser avec 3 doigts
![Page 17: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/17.jpg)
�Rappel: Test de 3 applis:• Le Monde, l'info en continu• Télé-loisirs, le programme TV• Météo-France
�Pour chacune• Ferme les yeux• Trouve l'icône de lancement• Lance l'application• Explore…• Ouvre les yeux et reprend ton exploration
![Page 18: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/18.jpg)
Ces tests ont été réalisés par des non-professionnels. Pour l'accessibilité de vos applis et de celles des autres, n'hésitez pas à reproduire ces gestes chez vous!
![Page 19: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/19.jpg)
Référentiel mobile/tactile (extension RGAA):
https://github.com/DISIC/referentiel-mobile-tactile
Guide de tests des applis mobiles:https://github.com/DISIC/guide-
mobile_app_audit
Livre blanc Braillenet:http://tinyurl.com/jxgq3bx
![Page 20: Atelier Paris Web 2016 testeur en...Atelier Paris Web 2016 Alex Bernier - Braillenet (@AssoBraillenet) Olivier Nourry (@OlivierNourry) – Access First Test de 3 applis: • Le Monde,](https://reader036.vdocuments.pub/reader036/viewer/2022070810/5f08b0dc7e708231d423407f/html5/thumbnails/20.jpg)
Alex Bernier - Braillenet (@AssoBraillenet)Olivier Nourry (@OlivierNourry) – Access First
Remerciements: Jérôme Botineau (@TobinoJ)