1 / 38

TYPO3 Et L’accessibilité

TYPO3 Et L’accessibilité. 30.06.2011. Aude JOLY <ajoly@e-magineurs.com>. Aude JOLY Ingénieur en développement, chef d’équipe et chef de projets E- magineurs Profil : Développeur, intégrateur TYPO3 Certifiée TYPO3 Integrator. T3UNI 2011. 30.06.2011. TYPO3 et l’accessibilité.

vicky
Download Presentation

TYPO3 Et L’accessibilité

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. TYPO3 Et L’accessibilité 30.06.2011 Aude JOLY <ajoly@e-magineurs.com>

  2. Aude JOLY Ingénieur en développement, chef d’équipe et chef de projets E-magineurs Profil : Développeur, intégrateur TYPO3 Certifiée TYPO3 Integrator T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  3. Plan de la conférence Introduction La charte graphique L’intégration du code HTML et des feuilles de style CSS Les contenus du site Le javascript, les contenus de type médias et cartes interactives Extensions utiles T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  4. Introduction

  5. L’accessibilité : une problématique du web actuel à prendre en compte à chaque étape d’un projet

  6. Un site accessible, pourquoi déjà ? • « Le pouvoir du web, c’est son universalité » • Tim Berners Lee, directeur du W3C • Pour les collectivités locales : • Article 47 de la loi n° 2005-102 du 11 février 2005 • Décret n°2009-546 du 14 mai 2009 T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  7. Pour les entreprises privées : • Projet fédérateur • Visibilité • Interopérabilité • Contenus • Ergonomie • Réduction des coûts • Image T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  8. Les référentiels • WCAG : Référence de base • http://www.w3.org/TR/WCAG20/ • RGAA : Référence pour les sites de collectivités locales • http://references.modernisation.gouv.fr/rgaa-accessibilite • ACCESSIWEB : Méthodologie pratique et applicable • http://www.braillenet.org/accessibilite/referentiel-aw21/ T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  9. Les outils indispensables Evaluer l’accessibilité d’un site, c’est beaucoup de bon sens, aidé par des outils adaptés ! Firebug WcagContrastChecker Web developper T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  10. La charte graphique

  11. Dès la conception de la charte graphique, la problématique de l’accessibilité est posée

  12. Les couleurs Contrastes texte et fond L’information et la couleur T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  13. Réfléchir à l’intégration La structure de votre site dépend directement de la charte graphique ; pour pouvoir avoir une structure correcte, votre charte doit le permettre ! Les titres Les formulaires Les menus Les blocs de contenu T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  14. L’intégration du code HTML et des feuilles de style CSS

  15. La base d’un site accessible : un code HTML et CSS adaptés !

  16. Créer un code robuste et valide selon les normes du W3C • Html : http://validator.w3.org/ • Css : http://jigsaw.w3.org/css-validator/#validate_by_uri+with_options T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  17. Adapter son code Typoscript • Définir le doktype, le codage utilisé et la langue du site web : • config { • xmlprologue = none • xhtml_cleaning = all • doctype = xhtml_trans • language = fr • locale_all = fr_FR • htmlTag_langKey = fr • } T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  18. Configurer le RTE Un RTE bien configuré permet à vos contributeurs d’écrire des contenus adaptés. T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  19. Les contenus du site

  20. Vous avez créé un site accessible, C’est maintenant aux contributeurs d’agir !

  21. Ecrire des contenus accessibles Titrage adapté Listes Alternatives et images Fichiers téléchargeables T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  22. Sensibilisez vos contributeurs Organisez une formation Responsabilisez les Fournissez des documents d’aide Charte éditoriale T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  23. Le javascript, les contenus de type médias et cartes interactives

  24. Comment faire avec des problématiques comme la cartographie, le javascript / AJAX ou les contraintes difficilement implémentables ?

  25. Les contenus de type Flash L’alternative est la réponse ! Adaptez la à votre contenu Une animation d’illustration Une animation apportant de l’information T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  26. Les cartographies type Googlemap Quelle alternative à une carte type Google ? Coordonnées GPS téléchargeables Listes Information complémentaire T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  27. La vidéo Des informations complémentaires entraînant un surcoût… Que faire ? Transcription textuelle Audio-description, sous-titres synchronisés, langue des signes La déclaration partielle de conformité T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  28. Le javascript et l’AJAX Toujours le même réflexe, l’alternative implémentée de façon pertinente Traitement côté serveur ARIA T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  29. Extensions utiles

  30. Le TER fournit un certain nombre d’extensions, n’hésitez pas à les adapter !

  31. Le glossaire Il vous permet de donner la possibilité à vos contributeurs de renseigner les abréviations, et aide à la compréhension du contenu • Avec Templavoila : • Sg_glossary • mr_glossary • Sans Templavoila : • AccessibilityGlossary • A21glossary Advanced Output T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  32. Le moteur de recherche Indexed_search, une solution standard dans TYPO3 et accessible Penser à indiquer les règles Revoir le template HTML pour adapter le formulaire T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  33. Les formulaires Powermail, une solution puissante et accessible Vérification javascript & PHP HTML généré adapté Page intermédiaire pour la validation des résultats T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  34. Actualités et calendrier Tt_news, newscalendar et extension E-magineurs Optimisez votre TS et vos templates HTML Adaptez l’utilisation des extensions pour les rendre accessible T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  35. Ajout de vidéo Extension E-magineurs ou intégration Youtube / Dailymotion Une extension développée pour respecter les normes L’alternative Youtube / Dailymotion T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  36. Ajouter des raccourcis clavier avec cron_accessiblemenu Une solution peu utilisée mais souvent demandée Ajoute automatiquement un raccourci clavier sur vos menus générés T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  37. Questions / Réponses T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

  38. Merci Aude JOLY <ajoly@e-magineurs.com> T3UNI 2011 30.06.2011 TYPO3 et l’accessibilité

More Related