atelier RGAA Parisweb 2007

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

0 comments

Post a comment

    Post a comment
    Embed Video
    Edit your comment Cancel

    1 Favorite

    atelier RGAA Parisweb 2007 - Presentation Transcript

    1. Aurélien Levy Expert accessibilité chez Tektonika , co-auteur du RGAA Contributeur openweb.eu.org Collectif de promotion des standards du Web Membre du Web Standards Project www.webstandards.org Blog www.fairytells.net
    2. Tektonika : activités et services http://www.tektonika.com Développement LAMP, SPIP, Intranet, Extranet sur mesure… Accessibilité Audit, A.M.O, formation, réalisation… Editorial Architecture de l’information, redaction, rewriting…
    3. Laurent Denis Expert accessibilité chez Temesis , co-auteur du RGAA Contributeur openweb.eu.org Collectif de promotion des standards du Web Responsable Opquast.org Liste publique de bonnes pratiques qualité pour les services en ligne Blog www.blog-and-blues.org
    4. Temesis : activités et services http://www.temesis.com Formation Professionnels, universités, … Expertise Audit, A.M.O., création de référentiels… Opquast Bonnes pratiques qualité
    5. Plan de l'intervention
      • Contenus graphiques
      • Contenus animés
      • Contenus textuels
      • Contenus tabulaires
      • Présentation et mise en forme
      • Structure de page et de site
      • Liens et navigation
      • Scripts et multimédias
      • Formulaires et interaction
    6. Plan de l'intervention
      • Contenus graphiques
      • Contenus animés
      • Contenus textuels
      • Contenus tabulaires
      • Présentation et mise en forme
      • Structure de page et de site
      • Liens et navigation
      • Scripts et multimédias
      • Formulaires et interaction
    7. Contenu graphique
      • Règles à suivre :
      • Fournir une alternative textuelle courte adaptée au contexte
      • Fournir une description longue si nécessaire
      • Vérification :
      • Présence attribut alt ou contenu alternatif adjacent
      • Pertinence du contenu de l’alternative
      • Présence description longue
      • Pertinence description longue
    8. Contenu graphique
      • Démo :
      • Musée du Louvre
      • Photoalto
      • TéléTVA
      • Unadev
    9. Plan de l'intervention
      • Contenus graphiques
      • Contenus animés
      • Contenus textuels
      • Contenus tabulaires
      • Présentation et mise en forme
      • Structure de page et de site
      • Liens et navigation
      • Scripts et multimédias
      • Formulaires et interaction
    10. Contenu animé
      • Règles à suivre :
      • Fournir une transcription textuelle
      • Fournir des sous-titres et une audio description synchronisée
      • Vérification :
      • Présence et pertinence de la transcription textuelle
      • Présence, pertinence et contrôle des sous-titres
      • Présence, pertinence et contrôle de l’audio description
    11. Contenu animé
      • Démo :
      • Spot accessibilité loi handicap
      • Spot langue des signes
    12. Plan de l'intervention
      • Contenus graphiques
      • Contenus animés
      • Contenus textuels
      • Contenus tabulaires
      • Présentation et mise en forme
      • Structure de page et de site
      • Liens et navigation
      • Scripts et multimédias
      • Formulaires et interaction
    13. Contenus textuels
      • Règles à suivre :
      • Utiliser un langage clair et simple, une rédaction logique et ordonnée
      • Privilégier les contenus textuels
      • Proposer des illustrations visuelles ou sonores
      • Expliciter les sigles
      • Identifier la langue, son sens de lecture, et leurs changements
    14. Contenu textuels
      • Vérification :
      • Liens pour la compréhension des contenus
      • Rédaction : phrases simples, forme active, vocabulaire simple, information importante au début
      • Remplacement des éléments non textuels par des styles CSS
      • Présence d'illustrations visuelles ou sonores
      • Présence du balisage explicitant la première occurrence d'une abréviation ou d'un acronyme.
      • Présence des informations de langue et sens de lecture
    15. Contenus textuels
      • Démo :
      • glossaire RGAA
    16. Plan de l'intervention
      • Contenus graphiques
      • Contenus animés
      • Contenus textuels
      • Contenus tabulaires
      • Présentation et mise en forme
      • Structure de page et de site
      • Liens et navigation
      • Scripts et multimédias
      • Formulaires et interaction
    17. Contenus tabulaires
      • Règles à suivre :
      • Utiliser les balises html d'en-têtes de lignes et de colonnes
      • Associer les cellules de données aux en-têtes de lignes et de colonnes
      • Donner un titre et un résumé aux tableaux de données
      • Proposer des valeurs de remplacement pour les en-têtes de tableaux de données
    18. Contenus tabulaires
      • Règles à suivre :
      • Ne pas utiliser de tableaux pour la mise en page sauf si leur linéarisation est correcte
      • Ne pas utiliser les éléments spécifiques aux tableaux de données pour des tableaux de mise en page
    19. Contenu tabulaires
      • Vérification:
      • Présence de l'élément th
      • utilisation de scope, ou id headers pour les tableaux simples
      • utilisation de id headers pour les tableaux complexes
      • Absence d'éléments ou attributs th, caption, thead, tbody, tfoot, scope, headers, axis dans les tableaux de présentation
      • Présence d'un titre
      • Présence d'un résumé différent du titre
      • Présence et pertinence d'abréviations des en-têtes
      • Absence de tableau de présentation injustifié
      • Absence d'éléments parasitant la lecture linéaire d'un tableau de présentation
    20. Contenu tabulaires
      • Démo :
      • paris.fr
    21. Plan de l'intervention
      • Contenus graphiques
      • Contenus animés
      • Contenus textuels
      • Contenus tabulaires
      • Présentation et mise en forme
      • Structure de page et de site
      • Liens et navigation
      • Scripts et multimédias
      • Formulaires et interaction
    22. Présentation et mise en forme
      • Règles à suivre :
      • Prévoir un moyen d’accès à l’information autre que la couleur
      • Prévoir un contraste suffisent
      • Séparer convenablement le contenu de la présentation
      • Eviter les changements de luminosité, les clignotements ou les mouvements
      • Utiliser une présentation cohérente et accessible
    23. Présentation et mise en forme
      • Vérification :
      • Absence d’informations véhiculées uniquement par la couleur
      • Contraste avec une valeur de 3:1 ou 4:1
      • Utilisation des CSS (image, tableau de mise en forme)
      • Absence d’élément ou d’attribut de présentation
      • Absence d’informations disponible uniquement avec les CSS et/ou les images
    24. Présentation et mise en forme
      • Vérification :
      • Respect du rôle sémantique des éléments
      • Possibilité d’agrandir les textes sans dégats
      • Respecter la linéarisation du contenu
      • Possibilité de contrôle des clignotements, mouvements et changements de luminosité
      • Cohérence du design sur l’ensemble du site
    25. Présentation et mise en forme
      • Démo :
      • Ville de Nantes
      • Semaine de l’emploi des personnes handicapées
      • Recrutement de la Marine
    26. Plan de l'intervention
      • Contenus graphiques
      • Contenus animés
      • Contenus textuels
      • Contenus tabulaires
      • Présentation et mise en forme
      • Structure de page et de site
      • Liens et navigation
      • Scripts et multimédias
      • Formulaires et interaction
    27. Structure page et site
      • Règles à suivre :
      • Créer des pages valides
      • Hiérarchiser et structurer convenablement le contenu
      • Utiliser de préférence les technologies W3C et une version récente de leur spécification
      • Proposer un ordre logique de parcours au clavier
      • Proposer des raccourcis clavier et un plan du site
      • Regrouper les informations de même nature
      • Enrichir le contenu de méta données
    28. Structure page et site
      • Vérification :
      • Conformité de l’arbre du document
      • Absence de balises dépréciées ou obsolètes
      • Présence et bonne arborescence des balises Hx
      • Utilisation correcte des listes ul, dl, ol et des balises de citations
      • Présence d’accesskey et d’un plan du site fonctionnel
      • Présence des balises fieldset/legend, optgroup/label
      • Présence d’un titre au page et de balises meta
    29. Structure page et site
      • Démo :
      • Fiche RGAA
      • Le Monde
      • Changement d’adresse
    30. Plan de l'intervention
      • Contenus graphiques
      • Contenus animés
      • Contenus textuels
      • Contenus tabulaires
      • Présentation et mise en forme
      • Structure de page et de site
      • Liens et navigation
      • Scripts et multimédias
      • Formulaires et interaction
    31. Liens et navigation
      • Règles à suivre :
      • Fournir des liens explicites quant à leur destination et à leur comportement
      • Fournir des informations sur l'architecture générale du site
      • Fournir des mécanismes de navigation cohérents, sous forme de menus
      • Fournir des liens d'accès rapide ou d'évitement
      • Fournir des images avec zones cliquables côté client
      • Faciliter l'usage du moteur de recherche
    32. Liens et navigation
      • Vérification :
      • Libellés ou title uniques, concis, non vides
      • Libellés ou title explicitant l'action, la cible, le mode de consultation, compréhensibles hors contexte
      • Absence d'ouvertures de nouvelles fenêtres sans avertissement, via target, javascript ou un objet externe, ou sans action de l'utilisateur
      • Accessibilité des images avec zones cliquables côté serveur
    33. Liens et navigation
      • Démo :
      • liberation.fr
      • competitivite.gouv.fr
    34. Liens et navigation
      • Vérification :
      • Présence et visibilité d'un menu de navigation, d'éléments de navigation dans un groupe de page
      • Cohérence de la position, de la présentation et du comportement des menus et barres de navigation
      • Regroupement, identification et accès fonctionnel aux regroupements de liens important
    35. Liens et navigation
      • Démo :
      • vendee-tourisme.fr/a-suivre/
    36. Liens et navigation
      • Vérification :
      • Absence de meta, de script ou d'objet provoquant un rafraîchissement automatique
      • Présence et pertinence des titres de cadres
      • Identification et description complémentaire des cadres
      • Présence d'un moyen de passer l'art Ascii multi-ligne
      • Présence de modes de recherche alternatifs
    37. Liens et navigation
      • Démo :
      • www.ooshop.com
    38. Plan de l'intervention
      • Contenus graphiques
      • Contenus animés
      • Contenus textuels
      • Contenus tabulaires
      • Présentation et mise en forme
      • Structure de page et de site
      • Liens et navigation
      • Scripts et multimédias
      • Formulaires et interaction
    39. Script et multimédia
      • Règles à suivre :
      • Prévoir une alternative
      • Prévoir l’utilisation par plusieurs périphérique d’accès
      • Rendre intrinsèquement accessible les éléments programmables
      • Avertir l’utilisateur et permettre l’accès aux éventuelles mises à jours du contenu
      • Utiliser convenablement les éléments en fonction de leur rôle en attendant ARIA
    40. Script et multimédia
      • Vérification :
      • Présence d’une alternative aux object, applet et embed
      • Présence d’une alternative au code javascript
      • Equivalence de l’information et accessibilité de l’alternative
      • Maintient de l’accessibilité du code général en javascript
      • Possibilité de désactiver une mise à jour automatique
      • Présence d’un avertissement /accès à la mise à jour
      • Maintient des fonctions d’historique de navigation
    41. Script et multimédia
      • Démo :
      • Menu déroulant
      • Validation formulaire accessible
      • Ajax accessible
      • Jkrowling , avatar neuf telecom , frise europe
    42. Plan de l'intervention
      • Contenus graphiques
      • Contenus animés
      • Contenus textuels
      • Contenus tabulaires
      • Présentation et mise en forme
      • Structure de page et de site
      • Liens et navigation
      • Scripts et multimédias
      • Formulaires et interaction
    43. Formulaires et interaction
      • Règles à suivre :
      • Associer les champs de formulaire à leurs intitulés
      • Utiliser des regroupements légendés
    44. Formulaires et interaction
      • Vérification :
      • Absence d'élément de formulaire sans étiquette et identifiant ou sans title
      • Association visuelle et structurelle des étiquettes aux champs
      • Présence d'un regroupement de contrôles de formulaire dans un élément fieldset
      • Absence d'éléments fieldset sans élément legend pertinent
      • Présence des éléments optgroup et des attributs label
      • Pertinence des éléments legend et des attributs label
    45. Plan de l'intervention
      • Questions / réponses
      • Contacts :
      • Laurent Denis [email_address]
      • Aurélien Levy [email_address]

    + levy aurélienlevy aurélien, 3 years ago

    custom

    2531 views, 1 favs, 0 embeds more stats

    Présentation faite lors des ateliers du samedi de more

    More info about this document

    CC Attribution-NonCommercial-NoDerivs LicenseCC Attribution-NonCommercial-NoDerivs LicenseCC Attribution-NonCommercial-NoDerivs License

    Go to text version

    • Total Views 2531
      • 2531 on SlideShare
      • 0 from embeds
    • Comments 0
    • Favorites 1
    • Downloads 55
    Most viewed embeds

    more

    All embeds

    less

    Flagged as inappropriate Flag as inappropriate
    Flag as inappropriate

    Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

    Cancel
    File a copyright complaint
    Having problems? Go to our helpdesk?

    Categories