WST#8 : Connaître lesfondamentaux de l’accessibilité
Sébastien Huillet   Agence Webwww.tribu-and-co.fr
Connaître les fondamentaux de l’accessibilité    1. Achetez mon beau poisson - Présentation de laccessibilité    2. La thé...
Définition de laccessibilité   Physique   Éducatif   Civique   Culturel / Social   Numérique
Définition de laccessibilité numérique   Public handicapé    file:///mnt/temp/oo/20120420090029/true.png                  ...
Définition de laccessibilité numérique   Tout public      Les séniors      Les novices      Le matériel
Définition de laccessibilité numérique    Tim Berners-Lee, directeur du W3C"Mettre le Web et ses services à la disposition...
Définition des normes internationales       W3C       WAI       WCAG, ARIA, ATAG, UAAG       WCAG 2.0 : 3 niveaux A, AA, AAA
La loi, cest le RGAA    article 47 de la loi 2005-102« Les services de communication publique en ligne desservices de l’Ét...
Accessiweb, le label made in France  BrailleNet, lassociation  Accessiweb, le centre de ressource :      Un référentiel : ...
Le référentiel Accessiweb 2.1   13 thématiques   131 critères   3 niveaux :       Bronze (A) : 81 critères       Argent (A...
ImagesDonner à chaque image porteuse d’informationune alternative textuelle pertinente et unedescription détaillée si néce...
Images<img src="fichier_image.jpg"alt="contenu de limage" />
Cadres Donner à chaque cadre et chaque cadre en ligne un titre pertinent.
Couleurs Ne pas donner l’information uniquement par la couleur et utiliser des contrastes de couleurs suffisamment élevés.
Couleurs
LiensDonner des intitulés de lien explicites, grâce àdes informations de contexte notamment, etutiliser le titre de lien l...
Liens
Éléments ObligatoiresVérifier que chaque page Web a un code sourcevalide selon le type de document, un titrepertinent et u...
Structuration de l’informationUtiliser des titres, des listes, des abréviations etdes citations pour structurer l’informat...
Structuration de l’information
Présentation de l’informationUtiliser des feuilles de styles pour contrôler laprésentation de l’information. Vérifier l’ef...
FormulairesStructurer les formulaires de manière pertinente,vérifier la présence d’aide à la saisie et decontrôle de saisi...
TableauxDonner à chaque tableau de données, unrésumé et un titre pertinent, identifier clairementles cellules d’en-tête.
NavigationFaciliter la navigation par au moins deuxsystèmes de navigation différents : menu denavigation, plan du site, mo...
MultimédiaDonner si nécessaire à chaque média temporelune transcription textuelle, des sous-titressynchronisés et une audi...
Multimédia
ScriptsDonner si nécessaire à chaque script unealternative pertinente.
ConsultationProposer des versions accessibles ou rendreaccessibles les documents en téléchargement.Sont concernés tous les...
Outils et ressources   Firefox : Firebug et Web developer   Internet Explorer : WAT-C   Niveaux de contraste : Contrast an...
Outils et ressources   Accessiweb   Open Web   Alsacréations   Transcender CSS par Andy Clarke
ConclusionLe site        Ouverture du site               Structuration de linformation - ergonomie               Optimisat...
Télécharger les outils                                                       http://www.facebook.com/TribuAndCo           ...
Prochain SlideShare
Chargement dans…5
×

Présentation de l'accessibilité numérique par Sébastien Huillet (Tribu And Co)

1 066 vues

Publié le

Suite à la Webschool du 19 avril à Tours, voici mon support de présentation. L'atelier traité de l'accessibilité numérique.

Un sujet qui nous tient à coeur chez Tribu and Co !

Publié dans : Technologie
0 commentaire
1 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

Aucun téléchargement
Vues
Nombre de vues
1 066
Sur SlideShare
0
Issues des intégrations
0
Intégrations
242
Actions
Partages
0
Téléchargements
11
Commentaires
0
J’aime
1
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Présentation de l'accessibilité numérique par Sébastien Huillet (Tribu And Co)

  1. 1. WST#8 : Connaître lesfondamentaux de l’accessibilité
  2. 2. Sébastien Huillet Agence Webwww.tribu-and-co.fr
  3. 3. Connaître les fondamentaux de l’accessibilité 1. Achetez mon beau poisson - Présentation de laccessibilité 2. La théorie du complot - Définition des normes 3. Un label Made in France – Accessiweb 4. Attachez votre ceinture – Présentation des 13 thématiques 5. Les bonnes recettes de laccessibilité - Outils et ressources 6. Alors, il est pas frais mon poisson ? - Perspectives et conclusions
  4. 4. Définition de laccessibilité Physique Éducatif Civique Culturel / Social Numérique
  5. 5. Définition de laccessibilité numérique Public handicapé file:///mnt/temp/oo/20120420090029/true.png Ouverture sur le monde file:///mnt/temp/oo/20120420090029/true.png Un matériel adapté file:///mnt/temp/oo/20120420090029/false.png Compatibilité et confort de consultation
  6. 6. Définition de laccessibilité numérique Tout public Les séniors Les novices Le matériel
  7. 7. Définition de laccessibilité numérique Tim Berners-Lee, directeur du W3C"Mettre le Web et ses services à la disposition de tous lesindividus, quel que soit leur matériel ou logiciel, leurinfrastructure réseau, leur langue maternelle, leur culture, leurlocalisation géographique, ou leurs aptitudes physiques oumentales."
  8. 8. Définition des normes internationales W3C WAI WCAG, ARIA, ATAG, UAAG WCAG 2.0 : 3 niveaux A, AA, AAA
  9. 9. La loi, cest le RGAA article 47 de la loi 2005-102« Les services de communication publique en ligne desservices de l’État, des collectivités territoriales et desétablissements publics qui en dépendent doivent êtreaccessibles aux personnes handicapées. » Création du référentiel RGAA en 2009 Mise en application en 2009 Niveau requis AA Délai de mise en œuvre 2 à 3 ans
  10. 10. Accessiweb, le label made in France BrailleNet, lassociation Accessiweb, le centre de ressource : Un référentiel : Accessiweb 2.1 Un Label Bronze, Argent et Or Le GTA, Groupe de Travail Accessiweb
  11. 11. Le référentiel Accessiweb 2.1 13 thématiques 131 critères 3 niveaux : Bronze (A) : 81 critères Argent (AA) : 20 critères Or (AAA) : 30 critères
  12. 12. ImagesDonner à chaque image porteuse d’informationune alternative textuelle pertinente et unedescription détaillée si nécessaire.Remplacer les images textes par du texte stylélorsque c’est possible.
  13. 13. Images<img src="fichier_image.jpg"alt="contenu de limage" />
  14. 14. Cadres Donner à chaque cadre et chaque cadre en ligne un titre pertinent.
  15. 15. Couleurs Ne pas donner l’information uniquement par la couleur et utiliser des contrastes de couleurs suffisamment élevés.
  16. 16. Couleurs
  17. 17. LiensDonner des intitulés de lien explicites, grâce àdes informations de contexte notamment, etutiliser le titre de lien le moins possible.
  18. 18. Liens
  19. 19. Éléments ObligatoiresVérifier que chaque page Web a un code sourcevalide selon le type de document, un titrepertinent et une indication de langue par défaut.
  20. 20. Structuration de l’informationUtiliser des titres, des listes, des abréviations etdes citations pour structurer l’information.
  21. 21. Structuration de l’information
  22. 22. Présentation de l’informationUtiliser des feuilles de styles pour contrôler laprésentation de l’information. Vérifier l’effet del’agrandissement des tailles de caractère sur lalisibilité.
  23. 23. FormulairesStructurer les formulaires de manière pertinente,vérifier la présence d’aide à la saisie et decontrôle de saisie accessible.
  24. 24. TableauxDonner à chaque tableau de données, unrésumé et un titre pertinent, identifier clairementles cellules d’en-tête.
  25. 25. NavigationFaciliter la navigation par au moins deuxsystèmes de navigation différents : menu denavigation, plan du site, moteur de recherchefil d’ariane
  26. 26. MultimédiaDonner si nécessaire à chaque média temporelune transcription textuelle, des sous-titressynchronisés et une audio-descriptionpertinente.
  27. 27. Multimédia
  28. 28. ScriptsDonner si nécessaire à chaque script unealternative pertinente.
  29. 29. ConsultationProposer des versions accessibles ou rendreaccessibles les documents en téléchargement.Sont concernés tous les fichiers PDF, Word,ExcelChaque contenu en mouvement ou clignotantest-il contrôlable par lutilisateur ?
  30. 30. Outils et ressources Firefox : Firebug et Web developer Internet Explorer : WAT-C Niveaux de contraste : Contrast analyser Accessibilité flash : aDesigner
  31. 31. Outils et ressources Accessiweb Open Web Alsacréations Transcender CSS par Andy Clarke
  32. 32. ConclusionLe site Ouverture du site Structuration de linformation - ergonomie Optimisation du référencementLagence Web 80 % des critères « simples ». Pas de nécessité de concession graphique Structure le projetLe client Meilleure renommée Preuve de qualité - Pérennité Maintenance moins couteuse
  33. 33. Télécharger les outils http://www.facebook.com/TribuAndCo Audit du sitefile:///mnt/temp/oo/20120420090029/logo_webshool.png http://www.webschool-tours.fr/

×