• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
atelier RGAA Parisweb 2007
 

atelier RGAA Parisweb 2007

on

  • 5,264 views

Présentation faite lors des ateliers du samedi de Parisweb 2007

Présentation faite lors des ateliers du samedi de Parisweb 2007

Statistics

Views

Total Views
5,264
Views on SlideShare
5,263
Embed Views
1

Actions

Likes
1
Downloads
57
Comments
0

1 Embed 1

http://www.slideshare.net 1

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

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

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    atelier RGAA Parisweb 2007 atelier RGAA Parisweb 2007 Presentation Transcript

    • 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
    • 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

    • 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
    • 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Ă©
    • 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
    • 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
    • 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
    • Contenu graphique
      • DĂ©mo :
      • MusĂ©e du Louvre
      • Photoalto
      • TĂ©lĂ©TVA
      • Unadev
    • 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
    • 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
    • Contenu animĂ©
      • DĂ©mo :
      • Spot accessibilitĂ© loi handicap
      • Spot langue des signes
    • 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
    • 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
    • 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
    • Contenus textuels
      • DĂ©mo :
      • glossaire RGAA
    • 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
    • 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
    • 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
    • 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
    • Contenu tabulaires
      • DĂ©mo :
      • paris.fr
    • 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
    • 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
    • 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
    • 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
    • PrĂ©sentation et mise en forme
      • DĂ©mo :
      • Ville de Nantes
      • Semaine de l’emploi des personnes handicapĂ©es
      • Recrutement de la Marine
    • 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
    • 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
    • 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
    • Structure page et site
      • DĂ©mo :
      • Fiche RGAA
      • Le Monde
      • Changement d’adresse
    • 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
    • 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
    • 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
    • Liens et navigation
      • DĂ©mo :
      • liberation.fr
      • competitivite.gouv.fr
    • 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
    • Liens et navigation
      • DĂ©mo :
      • vendee-tourisme.fr/a-suivre/
    • 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
    • Liens et navigation
      • DĂ©mo :
      • www.ooshop.com
    • 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
    • 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
    • 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
    • Script et multimĂ©dia
      • DĂ©mo :
      • Menu dĂ©roulant
      • Validation formulaire accessible
      • Ajax accessible
      • Jkrowling , avatar neuf telecom , frise europe
    • 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
    • Formulaires et interaction
      • RĂšgles Ă  suivre :
      • Associer les champs de formulaire Ă  leurs intitulĂ©s
      • Utiliser des regroupements lĂ©gendĂ©s
    • 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
    • Plan de l'intervention
      • Questions / rĂ©ponses
      • Contacts :
      • Laurent Denis [email_address]
      • AurĂ©lien Levy [email_address]