SlideShare ist ein Scribd-Unternehmen logo
1 von 12
Downloaden Sie, um offline zu lesen
ARIA - Live region attributes
   Séminaire AccessiWeb du 03 décembre 2010




      Sébastien Delorme – sdelorme@atalan.fr
              Atalan – www.atalan.fr
Commençons par une démonstration
Disponible sur : http://ideance.net/publications/live-regions/demonstration_1.html
Commençons par une démonstration
Disponible sur : http://ideance.net/publications/live-regions/demonstration_1.html




L’utilisateur doit faire des va-et-vient avec le lecteur d’écran entre la zone
         de discussion et le formulaire pour suivre la conversation
Seconde démonstration
Disponible sur : http://ideance.net/publications/live-regions/demonstration_2.html
Seconde démonstration
Disponible sur : http://ideance.net/publications/live-regions/demonstration_2.html




     Le lecteur d'écran lit automatiquement la zone de conversation
            au fur-et-à-mesure que quelque chose y apparait.
            Tout en conservant le focus dans la zone de saisie.
Live regions attributes
      (attributs de régions actives)




           Indiquer les
           changements de
           contenus dans une
           page

                                                   Fournir aux technologies
                                                   d'assistance des informations sur
                                                   la façon de traiter et signaler ces
                                                   mises à jour de contenus.


Explications sur : http://ideance.net/publications/live-regions/explications.html
Live regions attributes
      (attributs de régions actives)




                  aria-live

                 "off"
               "polite"
              "assertive"




Explications sur : http://ideance.net/publications/live-regions/explications.html
Live regions attributes
      (attributs de régions actives)




              aria-atomic

                     "false"
                      "true"




Explications sur : http://ideance.net/publications/live-regions/explications.html
Live regions attributes
      (attributs de régions actives)




                 aria-busy

                    "false"
                     "true"




Explications sur : http://ideance.net/publications/live-regions/explications.html
Live regions attributes
      (attributs de régions actives)




                 aria-relevant

                    "additions"
                     "removals"
                       "text"
                       "all"


Explications sur : http://ideance.net/publications/live-regions/explications.html
Autres exemples




                             AccessibleTwitter : http://www.accessibletwitter.com/




                                   Yahoo! Search : http://fr.search.yahoo.com/



Explications sur : http://ideance.net/publications/live-regions/exemples.html
ARIA - Live region attributes
   Séminaire AccessiWeb du 03 décembre 2010




                    Crédits photos :
          Licences Creative Commons – Flickr
        Merci à john curley, St Stev, flod et chuckp

      Sébastien Delorme – sdelorme@atalan.fr
              Atalan – www.atalan.fr

Weitere ähnliche Inhalte

Andere mochten auch

PROJET GEANT
PROJET GEANTPROJET GEANT
PROJET GEANTnazzou
 
LittéRature
LittéRatureLittéRature
LittéRatureAngesha
 
Système soleil terre lune
Système soleil terre luneSystème soleil terre lune
Système soleil terre luneyondaime12
 
Qui gardera les gardiens? (Présentation FUQAC 2012)
Qui gardera les gardiens? (Présentation FUQAC 2012)Qui gardera les gardiens? (Présentation FUQAC 2012)
Qui gardera les gardiens? (Présentation FUQAC 2012)Sylvain Hallé
 
Analyse des Etats Financier & Ratios
Analyse des Etats Financier & RatiosAnalyse des Etats Financier & Ratios
Analyse des Etats Financier & RatiosTaouilJ
 
Concevoir et développer pour l'humain
Concevoir et développer pour l'humainConcevoir et développer pour l'humain
Concevoir et développer pour l'humainCharlotte Sferruzza
 
CIF16: Rethinking Foundations for Zero-devops Clouds (Maxim Kharchenko, Cloud...
CIF16: Rethinking Foundations for Zero-devops Clouds (Maxim Kharchenko, Cloud...CIF16: Rethinking Foundations for Zero-devops Clouds (Maxim Kharchenko, Cloud...
CIF16: Rethinking Foundations for Zero-devops Clouds (Maxim Kharchenko, Cloud...The Linux Foundation
 
Say NO To (More) Selenium Tests
Say NO To (More) Selenium TestsSay NO To (More) Selenium Tests
Say NO To (More) Selenium TestsAnand Bagmar
 
Git 101 - Crash Course in Version Control using Git
Git 101 - Crash Course in Version Control using GitGit 101 - Crash Course in Version Control using Git
Git 101 - Crash Course in Version Control using GitGeoff Hoffman
 
Théorie Des Organisations
Théorie Des OrganisationsThéorie Des Organisations
Théorie Des Organisationsgandon
 
Citations sur la conduite du changement
Citations sur la conduite du changementCitations sur la conduite du changement
Citations sur la conduite du changementStanislas de La Foye
 
Next Generation Cloud: Rise of the Unikernel V3 (UPDATED)
Next Generation Cloud: Rise of the Unikernel V3 (UPDATED)Next Generation Cloud: Rise of the Unikernel V3 (UPDATED)
Next Generation Cloud: Rise of the Unikernel V3 (UPDATED)The Linux Foundation
 
Courbe du deuil-Les étapes de l'acceptation du changement
Courbe du deuil-Les étapes de l'acceptation du changementCourbe du deuil-Les étapes de l'acceptation du changement
Courbe du deuil-Les étapes de l'acceptation du changementEric Rolland
 
To Deploy or Not-To-Deploy - decide using TTA's Trend & Failure Analysis
To Deploy or Not-To-Deploy - decide using TTA's Trend & Failure AnalysisTo Deploy or Not-To-Deploy - decide using TTA's Trend & Failure Analysis
To Deploy or Not-To-Deploy - decide using TTA's Trend & Failure AnalysisAnand Bagmar
 
XPDS14: Unikernels: Who, What, Where, When, Why - Adam Wick, Galois
XPDS14: Unikernels: Who, What, Where, When, Why - Adam Wick, GaloisXPDS14: Unikernels: Who, What, Where, When, Why - Adam Wick, Galois
XPDS14: Unikernels: Who, What, Where, When, Why - Adam Wick, GaloisThe Linux Foundation
 

Andere mochten auch (19)

Dbs ftp
Dbs ftpDbs ftp
Dbs ftp
 
PROJET GEANT
PROJET GEANTPROJET GEANT
PROJET GEANT
 
LittéRature
LittéRatureLittéRature
LittéRature
 
Système soleil terre lune
Système soleil terre luneSystème soleil terre lune
Système soleil terre lune
 
Qui gardera les gardiens? (Présentation FUQAC 2012)
Qui gardera les gardiens? (Présentation FUQAC 2012)Qui gardera les gardiens? (Présentation FUQAC 2012)
Qui gardera les gardiens? (Présentation FUQAC 2012)
 
Analyse des Etats Financier & Ratios
Analyse des Etats Financier & RatiosAnalyse des Etats Financier & Ratios
Analyse des Etats Financier & Ratios
 
Concevoir et développer pour l'humain
Concevoir et développer pour l'humainConcevoir et développer pour l'humain
Concevoir et développer pour l'humain
 
Git Rebase vs Merge
Git Rebase vs MergeGit Rebase vs Merge
Git Rebase vs Merge
 
CIF16: Rethinking Foundations for Zero-devops Clouds (Maxim Kharchenko, Cloud...
CIF16: Rethinking Foundations for Zero-devops Clouds (Maxim Kharchenko, Cloud...CIF16: Rethinking Foundations for Zero-devops Clouds (Maxim Kharchenko, Cloud...
CIF16: Rethinking Foundations for Zero-devops Clouds (Maxim Kharchenko, Cloud...
 
Say NO To (More) Selenium Tests
Say NO To (More) Selenium TestsSay NO To (More) Selenium Tests
Say NO To (More) Selenium Tests
 
Rapport de stage du fin d'étude
Rapport de stage du fin d'étudeRapport de stage du fin d'étude
Rapport de stage du fin d'étude
 
Git 101 - Crash Course in Version Control using Git
Git 101 - Crash Course in Version Control using GitGit 101 - Crash Course in Version Control using Git
Git 101 - Crash Course in Version Control using Git
 
Théorie Des Organisations
Théorie Des OrganisationsThéorie Des Organisations
Théorie Des Organisations
 
Citations sur la conduite du changement
Citations sur la conduite du changementCitations sur la conduite du changement
Citations sur la conduite du changement
 
Git Branching Model
Git Branching ModelGit Branching Model
Git Branching Model
 
Next Generation Cloud: Rise of the Unikernel V3 (UPDATED)
Next Generation Cloud: Rise of the Unikernel V3 (UPDATED)Next Generation Cloud: Rise of the Unikernel V3 (UPDATED)
Next Generation Cloud: Rise of the Unikernel V3 (UPDATED)
 
Courbe du deuil-Les étapes de l'acceptation du changement
Courbe du deuil-Les étapes de l'acceptation du changementCourbe du deuil-Les étapes de l'acceptation du changement
Courbe du deuil-Les étapes de l'acceptation du changement
 
To Deploy or Not-To-Deploy - decide using TTA's Trend & Failure Analysis
To Deploy or Not-To-Deploy - decide using TTA's Trend & Failure AnalysisTo Deploy or Not-To-Deploy - decide using TTA's Trend & Failure Analysis
To Deploy or Not-To-Deploy - decide using TTA's Trend & Failure Analysis
 
XPDS14: Unikernels: Who, What, Where, When, Why - Adam Wick, Galois
XPDS14: Unikernels: Who, What, Where, When, Why - Adam Wick, GaloisXPDS14: Unikernels: Who, What, Where, When, Why - Adam Wick, Galois
XPDS14: Unikernels: Who, What, Where, When, Why - Adam Wick, Galois
 

Ähnlich wie ARIA - Live region attributes (attributs de régions dynamiques)

Aria au pays du Web
Aria au pays du WebAria au pays du Web
Aria au pays du WebJPVillain
 
Latence et streaming api Devoxx France 2015
Latence et streaming api  Devoxx France 2015Latence et streaming api  Devoxx France 2015
Latence et streaming api Devoxx France 2015streamdata.io
 
Rich Desktop Applications
Rich Desktop ApplicationsRich Desktop Applications
Rich Desktop Applicationsgoldoraf
 
L avenir du web au prisme de la resource
L avenir du web au prisme de la resourceL avenir du web au prisme de la resource
L avenir du web au prisme de la resourceFabien Gandon
 
Solipsis Jury Anr 9 12 V18
Solipsis Jury Anr 9 12 V18Solipsis Jury Anr 9 12 V18
Solipsis Jury Anr 9 12 V18piegaro
 
A la découverte des bibliothèques numériques
A la découverte des bibliothèques numériquesA la découverte des bibliothèques numériques
A la découverte des bibliothèques numériquesFleury Christine
 
La mobilité dans Drupal
La mobilité dans DrupalLa mobilité dans Drupal
La mobilité dans DrupalAdyax
 
Détecter et nettoyer le contenu générique
Détecter et nettoyer le contenu génériqueDétecter et nettoyer le contenu générique
Détecter et nettoyer le contenu génériquebenoit chevillot
 
L'Open Source change le Monde - BlendWebMix 2019
L'Open Source change le Monde - BlendWebMix 2019L'Open Source change le Monde - BlendWebMix 2019
L'Open Source change le Monde - BlendWebMix 2019Bertrand Delacretaz
 
Des Outils 2.0 En Bdp 19 FéVrier Bdp 13
Des Outils 2.0 En Bdp 19 FéVrier Bdp 13Des Outils 2.0 En Bdp 19 FéVrier Bdp 13
Des Outils 2.0 En Bdp 19 FéVrier Bdp 13Franck Queyraud
 
Claroline - Semaine du libre
Claroline - Semaine du libreClaroline - Semaine du libre
Claroline - Semaine du libreClaroline
 
REX PagesJaunes.fr - architecture micro-services asynchrone
REX PagesJaunes.fr - architecture micro-services asynchroneREX PagesJaunes.fr - architecture micro-services asynchrone
REX PagesJaunes.fr - architecture micro-services asynchroneDavid DE CARVALHO
 
Connected Developper Ep6 (25-05-2013)
Connected Developper Ep6 (25-05-2013)Connected Developper Ep6 (25-05-2013)
Connected Developper Ep6 (25-05-2013)Badr Hakkari
 
Web 2.0 - CGA Guadeloupe
Web 2.0 - CGA GuadeloupeWeb 2.0 - CGA Guadeloupe
Web 2.0 - CGA GuadeloupeXavier LAIR
 
#AAFSaintÉ19 : Une transformation numérique au service de l’usage : évolution...
#AAFSaintÉ19 : Une transformation numérique au service de l’usage : évolution...#AAFSaintÉ19 : Une transformation numérique au service de l’usage : évolution...
#AAFSaintÉ19 : Une transformation numérique au service de l’usage : évolution...AssociationAF
 

Ähnlich wie ARIA - Live region attributes (attributs de régions dynamiques) (20)

Aria au pays du Web
Aria au pays du WebAria au pays du Web
Aria au pays du Web
 
Latence et streaming api Devoxx France 2015
Latence et streaming api  Devoxx France 2015Latence et streaming api  Devoxx France 2015
Latence et streaming api Devoxx France 2015
 
Rich Desktop Applications
Rich Desktop ApplicationsRich Desktop Applications
Rich Desktop Applications
 
Web 2.0 : Blogs, RSS & Wikis
Web 2.0 : Blogs, RSS & WikisWeb 2.0 : Blogs, RSS & Wikis
Web 2.0 : Blogs, RSS & Wikis
 
L avenir du web au prisme de la resource
L avenir du web au prisme de la resourceL avenir du web au prisme de la resource
L avenir du web au prisme de la resource
 
Introduction aux APIs IIIF
Introduction aux APIs IIIFIntroduction aux APIs IIIF
Introduction aux APIs IIIF
 
Solipsis Jury Anr 9 12 V18
Solipsis Jury Anr 9 12 V18Solipsis Jury Anr 9 12 V18
Solipsis Jury Anr 9 12 V18
 
Démo abelos
Démo abelosDémo abelos
Démo abelos
 
A la découverte des bibliothèques numériques
A la découverte des bibliothèques numériquesA la découverte des bibliothèques numériques
A la découverte des bibliothèques numériques
 
La mobilité dans Drupal
La mobilité dans DrupalLa mobilité dans Drupal
La mobilité dans Drupal
 
Détecter et nettoyer le contenu générique
Détecter et nettoyer le contenu génériqueDétecter et nettoyer le contenu générique
Détecter et nettoyer le contenu générique
 
L'Open Source change le Monde - BlendWebMix 2019
L'Open Source change le Monde - BlendWebMix 2019L'Open Source change le Monde - BlendWebMix 2019
L'Open Source change le Monde - BlendWebMix 2019
 
Des Outils 2.0 En Bdp 19 FéVrier Bdp 13
Des Outils 2.0 En Bdp 19 FéVrier Bdp 13Des Outils 2.0 En Bdp 19 FéVrier Bdp 13
Des Outils 2.0 En Bdp 19 FéVrier Bdp 13
 
Claroline - Semaine du libre
Claroline - Semaine du libreClaroline - Semaine du libre
Claroline - Semaine du libre
 
REX PagesJaunes.fr - architecture micro-services asynchrone
REX PagesJaunes.fr - architecture micro-services asynchroneREX PagesJaunes.fr - architecture micro-services asynchrone
REX PagesJaunes.fr - architecture micro-services asynchrone
 
Connected Developper Ep6 (25-05-2013)
Connected Developper Ep6 (25-05-2013)Connected Developper Ep6 (25-05-2013)
Connected Developper Ep6 (25-05-2013)
 
Web 2.0 - CGA Guadeloupe
Web 2.0 - CGA GuadeloupeWeb 2.0 - CGA Guadeloupe
Web 2.0 - CGA Guadeloupe
 
2.0 TEchnologies
2.0 TEchnologies2.0 TEchnologies
2.0 TEchnologies
 
T
TT
T
 
#AAFSaintÉ19 : Une transformation numérique au service de l’usage : évolution...
#AAFSaintÉ19 : Une transformation numérique au service de l’usage : évolution...#AAFSaintÉ19 : Une transformation numérique au service de l’usage : évolution...
#AAFSaintÉ19 : Une transformation numérique au service de l’usage : évolution...
 

Mehr von Sébastien Delorme

L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...
L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...
L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...Sébastien Delorme
 
Intégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéIntégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéSébastien Delorme
 
Intégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéIntégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéSébastien Delorme
 
Accessibilité & e-recrutement
Accessibilité & e-recrutementAccessibilité & e-recrutement
Accessibilité & e-recrutementSébastien Delorme
 
Concilier accessibilité et SEO
Concilier accessibilité et SEOConcilier accessibilité et SEO
Concilier accessibilité et SEOSébastien Delorme
 
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...Sébastien Delorme
 
L'innovation portée par les utilisateurs
L'innovation portée par les utilisateursL'innovation portée par les utilisateurs
L'innovation portée par les utilisateursSébastien Delorme
 
Et si je me mettais à sa place ?
Et si je me mettais à sa place ?Et si je me mettais à sa place ?
Et si je me mettais à sa place ?Sébastien Delorme
 

Mehr von Sébastien Delorme (8)

L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...
L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...
L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...
 
Intégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéIntégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualité
 
Intégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéIntégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualité
 
Accessibilité & e-recrutement
Accessibilité & e-recrutementAccessibilité & e-recrutement
Accessibilité & e-recrutement
 
Concilier accessibilité et SEO
Concilier accessibilité et SEOConcilier accessibilité et SEO
Concilier accessibilité et SEO
 
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...
 
L'innovation portée par les utilisateurs
L'innovation portée par les utilisateursL'innovation portée par les utilisateurs
L'innovation portée par les utilisateurs
 
Et si je me mettais à sa place ?
Et si je me mettais à sa place ?Et si je me mettais à sa place ?
Et si je me mettais à sa place ?
 

ARIA - Live region attributes (attributs de régions dynamiques)

  • 1. ARIA - Live region attributes Séminaire AccessiWeb du 03 décembre 2010 Sébastien Delorme – sdelorme@atalan.fr Atalan – www.atalan.fr
  • 2. Commençons par une démonstration Disponible sur : http://ideance.net/publications/live-regions/demonstration_1.html
  • 3. Commençons par une démonstration Disponible sur : http://ideance.net/publications/live-regions/demonstration_1.html L’utilisateur doit faire des va-et-vient avec le lecteur d’écran entre la zone de discussion et le formulaire pour suivre la conversation
  • 4. Seconde démonstration Disponible sur : http://ideance.net/publications/live-regions/demonstration_2.html
  • 5. Seconde démonstration Disponible sur : http://ideance.net/publications/live-regions/demonstration_2.html Le lecteur d'écran lit automatiquement la zone de conversation au fur-et-à-mesure que quelque chose y apparait. Tout en conservant le focus dans la zone de saisie.
  • 6. Live regions attributes (attributs de régions actives) Indiquer les changements de contenus dans une page Fournir aux technologies d'assistance des informations sur la façon de traiter et signaler ces mises à jour de contenus. Explications sur : http://ideance.net/publications/live-regions/explications.html
  • 7. Live regions attributes (attributs de régions actives) aria-live "off" "polite" "assertive" Explications sur : http://ideance.net/publications/live-regions/explications.html
  • 8. Live regions attributes (attributs de régions actives) aria-atomic "false" "true" Explications sur : http://ideance.net/publications/live-regions/explications.html
  • 9. Live regions attributes (attributs de régions actives) aria-busy "false" "true" Explications sur : http://ideance.net/publications/live-regions/explications.html
  • 10. Live regions attributes (attributs de régions actives) aria-relevant "additions" "removals" "text" "all" Explications sur : http://ideance.net/publications/live-regions/explications.html
  • 11. Autres exemples AccessibleTwitter : http://www.accessibletwitter.com/ Yahoo! Search : http://fr.search.yahoo.com/ Explications sur : http://ideance.net/publications/live-regions/exemples.html
  • 12. ARIA - Live region attributes Séminaire AccessiWeb du 03 décembre 2010 Crédits photos : Licences Creative Commons – Flickr Merci à john curley, St Stev, flod et chuckp Sébastien Delorme – sdelorme@atalan.fr Atalan – www.atalan.fr