Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

Accessibility in Plone: The Good, the Bad, and the Ugly

99 vues

Publié le

Out of the box, Plone's accessibility compliance is outstanding, especially Plone 5. However when building a real site things can go wrong - in the theme, in add-ons, and in customizations. In this talk I'll describe the things that went wrong on a highly customized academic Plone site, which were discovered by an institutional audit. I'll describe the types of errors that were found, how common they were and how difficult to fix. I'll provide guidance on what to look out for when developing a new site. And I'll give my wishlist of Plone accessibility improvements.

Publié dans : Technologie
  • ➤➤ How Long Does She Want You to Last? Here's the link to the FREE report ♥♥♥ https://tinyurl.com/rockhardxx
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • //DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT ......................................................................................................................... ......................................................................................................................... //DOWNLOAD PDF EBOOK here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... //DOWNLOAD EPUB Ebook here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... //DOWNLOAD doc Ebook here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... //DOWNLOAD PDF EBOOK here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... //DOWNLOAD EPUB Ebook here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... //DOWNLOAD doc Ebook here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • Soyez le premier à aimer ceci

Accessibility in Plone: The Good, the Bad, and the Ugly

  1. 1. Plone Accessibility Sally Kleinfeldt, Jazkarta
  2. 2. Disclaimer
  3. 3. a11yWhat Is It?
  4. 4. Theme
  5. 5. Landmarks
  6. 6. Media <div class="ExhibitObjectImage"> <img src="http://isaw.nyu.edu/exhibitions/....." alt="Whatever the editor put in the 'alt text' field on the content item" width="768" height="603"> </div>
  7. 7. Text
  8. 8. W3C WAI WCAG ATAG HTML5 WAI-ARIA
  9. 9. ?Why Do It
  10. 10. Out of the Box
  11. 11. Plone 4.3: Mostly WCAG 2.0, ARIA Plone 5: WCAG 2.0,ARIA,ATAG 2.0
  12. 12. In Real Life
  13. 13. ISAW • Center for research and graduate studies at NYU • Plone site since 2011 • Redesigned and upgraded to 4.3 2016 • Institutional audit 2018 • Now fixing identified problems
  14. 14. Design: 9 Issues • 6: color, contrast, opacity • 2: design of slider • 1: lack of explicit submit option on filtering
  15. 15. HTML: 7 Issues • 3: code for mobile nav and search • 1: bad header markup • 1: "view more" link should have been a button • 1: inappropriate header levels (h1, h2 etc.) • 1: invisible advanced search not hidden from screen readers
  16. 16. Customizations: 9 Issues • 3: redundant/adjacent links on custom views • 3: bad markup on custom content types • 2: missing image alt text that should have been filled programmatically • 1: non-H1 page titles on news and events pages
  17. 17. Plone 4.3: 19 Issues • 12: missing landmarks • 3: missing search and other form labels • 1: ambiguous column headings in calendar portlet (M,T,W...) • 1: bad nav markup • 1: bad main template markup • 1: missing page language
  18. 18. Plone: 13 Issues • 5: including title attributes on links and images • 4: missing alt text fields on lead images • 3: missing empty alt text attributes required to suppress screen readers • 1: using metadata for an image added in rich text for its alt text, instead of providing for contextual alt text
  19. 19. Add-ons: 2 Issues • 1: ftw.calendar presentation/function disconnect • 1: ftw.calendar options need to be buttons
  20. 20. Third Party Widgets: 3 Issues • 1:AddThis • 1:Voyant Tools word cloud • 1: Bobcat (NYU library search)
  21. 21. Content: 5 Issues • 4: missing alt text • 1 redundant adjacent links
  22. 22. a11yRecommendations
  23. 23. a11y Image Alt Text • Should describe image in page context • Should be null for decorative image • Image title, description, filename probably not right • Provide a way to enter for images in rich text and lead images
  24. 24. a11y Image & Link Title Attributes • Screen readers ignore them • Annoying in tool tips, annoying when overloaded for SEO • Remove entirely, never have a blank one
  25. 25. a11y Use Buttons for Actions • Don't use links • Was common in HTML4, commonly used still • Needs to change
  26. 26. a11y Modal Dialogs • Mobile menus, toolbar • Progressive enhancement not fully accessible, uses links for actions • Need to handle focus, keyboard navigation and entry • Good model: www.w3.org/WAI/GL/wiki/ Using_ARIA_role%3Ddialog_to_implement_ a_modal_dialog_box
  27. 27. a11y For Editors • Page checking: Integrate accessibility checker into editing process • Site checking:Add accessibility control panel to review overall state of the site
  28. 28. a11y For Designers • Should run tools to check contrast and check for accessibility problems directly on their HTML mockups
  29. 29. a11y For Developers • Run checkers nightly on staging sites to catch problems
  30. 30. a11y Add-ons • Can bring accessibility problems • Raise awareness and provide feedback
  31. 31. a11y Testing • Make accessibility compliance checking part of Travis?
  32. 32. a11yQuestions, Discussion

×