Successfully reported this slideshow.

Accessibilité du Web: méthodes d'évaluation rapide

1

Share

1 of 15
1 of 15

Accessibilité du Web: méthodes d'évaluation rapide

1

Share

Download to read offline

Les techniques d'évaluation rapide de l'accessibilité numérique sont utiles à toutes les phases du projet: diagnostic, production, recette, vérification en continu...
Cette présentation de Jean-Pierre Villain, réalisée à la CRAW 2013, en tandem avec sa fille Shanni (15 ans) pour démontrer la simplicité des techniques, révèle quelques-unes des méthodes permettant d'optimiser le rendement d'un auditeur accessibilité.

Les techniques d'évaluation rapide de l'accessibilité numérique sont utiles à toutes les phases du projet: diagnostic, production, recette, vérification en continu...
Cette présentation de Jean-Pierre Villain, réalisée à la CRAW 2013, en tandem avec sa fille Shanni (15 ans) pour démontrer la simplicité des techniques, révèle quelques-unes des méthodes permettant d'optimiser le rendement d'un auditeur accessibilité.

More Related Content

Related Books

Free with a 14 day trial from Scribd

See all

Accessibilité du Web: méthodes d'évaluation rapide

  1. 1. Accessibilité du Web Méthodes d'évaluation rapide Conférence Romande sur l’Accessibilité du Web – Lausanne – Avril 2013
  2. 2. A v a n t – p r o p o s Rappel ! Les outils de test automatiques sont utiles mais limités : - Uniquement la présence - 20 % des tests - Beaucoup de faux-positifs Les outils de tests automatiques ne peuvent rien nous dire sur l'accessibilité d'un contenu. Disposer de méthodes permettant d'évaluer rapidement l'accessibilité d'un site est important dans plusieurs situations :  En phase initiale, par exemple pour déterminer la meilleure stratégie pour aborder l'accessibilité  En phase d'accompagnement pour pouvoir interagir rapidement avec les développements en cours.  En phase de production pour évaluer ou valider rapidement les contenus produits en interne ou proposés par des tiers  En phase de qualification de contenus ou d'outils de production produits par des prestataires extérieurs. Les méthodes proposées ici s'appuient uniquement sur une évaluation humaine en utilisant : - La web developer toolbar pour firefox - Le mode CSS désactivé Ces méthodes sont reproductibles en utilisant d'autres barres d'outils
  3. 3. Démonstration de manipulations avec la Web developper toolbar
  4. 4. Exemples De méthodes d'évaluation rapides
  5. 5. A v a n t – p r o p o s Rappel ! Le mode CSS désactivé n'est pas un mode de consultation. En revanche c'est un excellent mode pour tester l'accessibilité des contenus. Le mode CSS désactivé offrent beaucoup d'avantages :  Accès direct au contenu et la structure  Affichage des contenus dynamiques masqués pas CSS  Ordre réel du contenu  Facilité d'évaluation
  6. 6. Méthodes d'évaluations rapides Images Cadres Tableau Liens Structure Formulaire Paramètres 1. CSS -> désactiver CSS 2. Entourer -> personnalisé -> IMG 3. Entourer -> personnalisé -> A 4. Images -> afficher les attributs ALT Rechercher - Les images sans attribut ALT - Les liens-images avec des attributs ALT nul (alt="") - Les liens adjacents de description longue ou la présence d'une description longue adjacente Evaluer - Les alternatives d'images porteuses d'information - Les images de décoration Navigation
  7. 7. Images Cadres Tableau Liens Structure Formulaire Paramètres 1. CSS -> désactiver CSS 2. Entourer -> personnalisé -> IFRAME 3. Info-> afficher les attributs TITLE Rechercher - Les IFRAMES sans attribut TITLE Evaluer - Les titres données aux IFRAMES Méthodes d'évaluations rapides Navigation
  8. 8. Images Cadres Tableau Liens Structure Formulaire Paramètres 1. CSS -> désactiver CSS 2. Entourer -> tableaux -> TABLEAUX 3. Entourer -> tableaux -> CAPTION 4. Entourer -> tableaux -> CELLULES 5. Entourer -> personnalisé-> TH Rechercher - Les tableaux de données sans titre - Les tableaux de données sans cellule d'en-tête - L'absence de cellule d'en-tête ou d'élément CAPTION pour les tableaux de mise en forme Evaluer - La pertinence des titres de tableaux - La linéarisation des tableaux de mise en forme Méthodes d'évaluations rapides Navigation
  9. 9. Images Cadres Tableau Liens Structure Formulaire Paramètres 1. CSS -> désactiver CSS 2. Entourer -> personnalisé -> A 3. Entourer -> personnalisé-> IMG 4. Images -> Afficher les attributs ALT Rechercher - Les liens vides - Les liens-images vides Méthodes d'évaluations rapides Navigation
  10. 10. Images Cadres Tableau Liens Structure Formulaire Paramètres 1. CSS -> désactiver CSS 2. Entourer -> personnalisé -> A 3. Info -> Afficher les attributs TITLE Rechercher - Les TITLE inutiles Evaluer - La pertinences des TITLES Méthodes d'évaluations rapides Navigation
  11. 11. Images Cadres Tableau Liens Structure Formulaire Paramètres 1. CSS -> désactiver CSS 2. Entourer-> indiquer les balises 3. Entourer -> personnalisé -> A 4. Entourer -> personnalisé-> IMG 5. Images -> Afficher les attributs ALT 6. Entourer -> personnalisé -> P Evaluer - Le contexte des liens si les intitulés seuls ne sont pas suffisamment explicites. Si aucun contexte de lien n'est jugé suffisant : - 1. Entourer -> entourer les titres H1-H6 - 2. évaluer la présence d'un TITLE pertinent en survolant avec la souris. - La présence de liens identiques Méthodes d'évaluations rapides Navigation
  12. 12. Images Cadres Tableau Liens Structure Formulaire Paramètres 1. Info -> afficher le plan du document Vérifier - La présence d'un titre H1 au moins - L'absence de titre manquant dans la hiérarchie des titres Paramètres 1. CSS -> désactiver CSS 2. Entourer -> entourer les titres H1-H6 Evaluer - La présence des titres nécessaire à la structuration de l'information. - Note : ce test peut également être effectué CSS activé pour une meilleure évaluation Méthodes d'évaluations rapides Navigation
  13. 13. Images Cadres Tableau Liens Structure Formulaire Paramètres 1. CSS -> désactiver CSS 2. Entourer -> personnalisé -> FORM 3. Entourer-> personnalisé -> LABEL 4. Images -> afficher les attributs ALT Vérifier - La présence des labels pour les champs de formulaires En cas d'absence de label vérifier la présence d'un title pertinent en survolant le champ avec la souris. - La présence d'un FIELDSET (cadre autour de champs regroupés) si nécessaire - La présence d'une légende (LEGEND), texte à cheval sur un fieldset Evaluer - La pertinence des labels ou des titles - La pertinence des noms des boutons de soumission (ou du title associé) ou des alternatives des boutons de type image. - La cohérence des labels de champs de même nature répétés plusieurs fois dans la page. Méthodes d'évaluations rapides Navigation
  14. 14. Images Cadres Tableau Liens Structure Formulaire Navigation Paramètres 1. CSS -> désactiver CSS Vérifier - La présence de liens d'accès rapides - Le fonctionnement des liens d'accès rapides Méthodes d'évaluations rapides
  15. 15. Merci de votre attention Qelios – Accessibilité Numérique 04 68 85 25 42 http://qelios.net

×