Archive index

A11y Slackers Gitter Channel Archive 14th of July 2017

What fresh hell is THIS now? - Patrick Lauke
  1. zakim-robot
    @zakim-robot
    Jul 14 00:42
    [seankeegan] @jiatyan I have been reviewing accordion UI for internal project. My understanding is that if accordion is open, then next tab goes to focusable item in the accordion panel. If accordion is closed, the next tab goes to subsequent accordion header.
  2. [seankeegan] Made decision based off of pattern at https://www.w3.org/TR/wai-aria-practices-1.1/#accordion
  3. [donnabungard] http://a11y-style-guide.com/style-guide/section-navigation.html#kssref-navigation-navigation-dropdown ?
  4. zakim-robot
    @zakim-robot
    Jul 14 11:31
    [michiel] jiatyan: could you mention/ask that in this issue please? w3c/aria-practices#401
  5. [michiel] I think that’s something that should be in the APG, but it’s not.
  6. [michiel] As a thought experiment I’d say it depends on whether you’re implementing a one-tab-stop version of the accordion. For example, for the breadcrumb design pattern both are allowed (either tab to all link in the breadcrumb or only the first one and use arrow keys to navigate).
  7. [michiel] Pattern wise i think it makes more sense to have accordions as a single tab stop, seeing as that’d be inline with what the tabs widget does.
  8. [michiel] As for what users want, a user test at CSUN in 2016 revealed it was pretty much 50/50 (when it came to tab stop with tab widgets).
  9. zakim-robot
    @zakim-robot
    Jul 14 11:58
    [michiel] Tack
  10. zakim-robot
    @zakim-robot
    Jul 14 14:49
    [virtualalex] I have a question about building accessibility into our company process
  11. [donnabungard] ?
  12. [virtualalex] Is it enough to simply use https://www.w3.org/TR/WCAG20/
  13. [virtualalex] as a guide?
  14. [virtualalex] or does it make sense to write out own accessibility guide?
  15. [michiel] company process ≄ web content
  16. zakim-robot
    @zakim-robot
    Jul 14 14:54
    [donnabungard] A few of us have been working on a Rights & Responsibilities guide that we are trying to gain momentum with that hopefully be translated into companies.
    I know MediaCurrent released an e-book on Accessibility for Content Authors
    Also - your company should have a Content Style Guide (words to use, stuff like that - not a branding guide) and you can bake Accessibility right into that
  17. [donnabungard] I guess do you need a checklist of who does what or do you need something for managers / authors?
  18. [donnabungard] @virtualalex - if you tell us a little more how you want to apply it, it may be easier
  19. zakim-robot
    @zakim-robot
    Jul 14 14:59
    [garcialo] Yeah, you should make accessibility a part of everyones’ jobs.
  20. [garcialo] review your brand guidelines, your design systems, your component libraries, etc.
  21. [donnabungard] https://donnabungard.github.io/accessibility/ - if it would help
  22. [donnabungard] If you have thoughts / contributions: https://github.com/donnabungard/accessibility
  23. [garcialo] Work with those teams; don’t just try and dictate accessibilty
  24. [virtualalex] Well we need to formalize the process
  25. [garcialo] Which process?
  26. [virtualalex] Well let’s say web component development
  27. [donnabungard] Check out the R&R document - that is EXACTLY what a few of us are trying to do - if everyone knows who needs to understsand what...
  28. [virtualalex] Say we need to build a new user path for filling out a form
  29. [virtualalex] I need this form to be accessible and any components related to the form as well
  30. [virtualalex] I need accessibility to be a formal part of that process
  31. [garcialo] What processes do you currently have for review?
  32. [garcialo] Design review? Code review? etc.
  33. [virtualalex] yes we have a code review, and a user testing review
  34. [virtualalex] no design review yet
  35. [virtualalex] well not a fromal one
  36. [garcialo] Get buy in from those teams; ask to get invited to those so you can raise a11y concerns as early as possible.
  37. [virtualalex] yes I will certainly talk to the teams and stakeholders
  38. [garcialo] Well, check with the design folk…if they don’t have a formal review, you can ask to be sent mocks like anyone else reviewing would receive
  39. [virtualalex] I guess I am more conerned with “Can this form be navigated with keyboard only” and “does this form work with a screen reader”
  40. [virtualalex] I find that following web design best practices is generally good for accessibility
  41. zakim-robot
    @zakim-robot
    Jul 14 15:04
    [garcialo] Yes
  42. [virtualalex] I need to bake a11y into design as well of course. But I am less concerned about that than the more use-centric stuff
  43. [garcialo] Well, if the design they’re having the devs make is very mouse-centric
  44. [garcialo] …
  45. [virtualalex] Is it not okay to be “mouse sentric” as long as it’s also keyboard accessible?
  46. [garcialo] Of course it’s fine…but I’m saying if the designer isn’t including keyboard interactions in their design docs or what they provide to developer, the devs won’t make it happen until they talk to you
  47. [garcialo] …or unless they happen to think of it
  48. [garcialo] …or know to consider it
  49. [garcialo] …which they should also be doing
  50. [virtualalex] I want them to consider it
  51. [virtualalex] but I am asking if it makes sense to write a “our company a11y guide” or if it is sufficient to simply use the standard one by WCAG?
  52. [virtualalex] and make sure everone is on board, and using that is a part of our design and dev process
  53. [garcialo] yeah, you could do that, but I don’t think anyone should be thinking about WCAG except for those who are expected to be accessibility experts
  54. [donnabungard] You need to bake A11y into your existing documentation. I keep muttering about making it "just what we do" - you have to make it a natural evolution and making a separate guide wont help in the long run - it'll always be an extra thing. I'd bake it into what you have and then reference WCAG
  55. [garcialo] I usually only reference it when I get specific pushback or there’s curiosity about a particular issue
  56. zakim-robot
    @zakim-robot
    Jul 14 15:09
    [donnabungard] slowly gets off soap box
  57. [garcialo] because a lot of the time, we’ll do something a specific way where WCAG might allow several methods for meeting a particular guideline
  58. [garcialo] yeah, you need to make a11y a part of each person’s job
  59. [virtualalex] What is my starting point for that?
  60. [garcialo] for designers, we put together a list of things our designers need to consider, for developers, we have documentation that covers common patterns we see that developers are creating, for testers, we had documentation for how to test for what’s required for launch
  61. [virtualalex] Would you be kind enough to let me peek at that documentation?
  62. [garcialo] For developers - https://ebay.gitbooks.io/mindpatterns/content/
  63. [garcialo] That also includes some interaction design, so it can be used by testers to see whether the components work the way they’re intended to
  64. [garcialo] For testers - https://ebay.gitbooks.io/oatmeal/
  65. [garcialo] I…desperately need to make time to work on this. It’s woefully behind what I want it to be
  66. [donnabungard] Here is the ebook for content editors: https://www.mediacurrent.com/blog/accessibility-for-content-editors-ebook
  67. [virtualalex] thanks
  68. [virtualalex] thanks for all these great resources!
  69. [garcialo] For designers, we basically just provide them with a bunch of links to a lot of the a11y in design links people have put online
  70. [virtualalex] I feel like design is the easiest
  71. zakim-robot
    @zakim-robot
    Jul 14 15:14
    [virtualalex] unless that is ignorant heh
  72. [garcialo] easy is relative
  73. [virtualalex] It just feels like what is “best” for design is best for a11y also
  74. [garcialo] it might be difficult for them to not consider “color alone” so you could suggest they use a tool such as…
  75. [virtualalex] like using proper H tags, and using relevant images, using large fonts and good contrast
  76. [garcialo] https://chrome.google.com/webstore/detail/desaturate/nkjkbbbjkbaddfcfbdakknhodgpcdhfa
  77. [garcialo] exactly…you’d want them to maintain a consistent heading structure and communicate this to developers in their design docs
  78. [donnabungard] This is a good tool for designers too http://contrast-grid.eightshapes.com/
  79. [garcialo] same thing with “how does this button-looking element behave? like a button or link?”
  80. [virtualalex] I used this in the past http://leaverou.github.io/contrast-ratio/#grey-on-blue
  81. [garcialo] if you already have a set of colors in your brand/design guidelines, you should put together…or better yet have one of the designers put together a subset of combinations that meet accessibility guidelines
  82. [donnabungard] that's what I like about the eightshapes tool - you can put in all your brand colors all at once
  83. [garcialo] and then each designer doesn’t need to worry about testing for accessibility, they can just reference to a chart like they do when they’re looking for the colors to use
  84. zakim-robot
    @zakim-robot
    Jul 14 15:20
    [garcialo] @donnabungard That sounds neat, I’ll check it out :)
  85. [virtualalex] thank you all very much for the insight
  86. [virtualalex] Here are some general rules, tell me if these make sense when I am in a light meeting and i don’t want to overwhelm people
  87. [virtualalex] “Everything needs to be: Accessible in black and white, accessible with keyboard only navigation, accessible with a screen reader.”
  88. [virtualalex] this feels like pretty good to me as a “shooting from the hip” lesson to people who don’t know anything about a11y
  89. [donnabungard] I think your verbiage may be too ... stoic
    I'd make it more human and less utilitarian... for example give me a moment
  90. zakim-robot
    @zakim-robot
    Jul 14 15:25
    [garcialo] try not to use the word itself while you’re defining what it means to be the word
  91. [virtualalex] hmm word feels fine to me
  92. [virtualalex] usable?
  93. [garcialo] what would it mean to be “accessible with a screen reader” to someone whose never used a screen reader or likely has never heard of one
  94. [donnabungard] >Our goal is to connect with all of our (customers, stakeholders... not sure to whom you speak). Each one may have challenges perceiving our content: permanent disabilities, temporary disabilities, situational challenges etc. In order for us to achieve our goal we'll need to provide keyboard-only navigational options, text that makes sense to a screen reader and other details. Please review the following checklists to make sure that the contribution you're making helps us reach this goal and empowers the end user.
  95. [donnabungard] Talk to the person - not at them
  96. [virtualalex] Very nice not really my style, but I will try to take some notes
  97. zakim-robot
    @zakim-robot
    Jul 14 16:11
    [virtualalex] Is there a free screen reader for windows you guys recommend?
  98. [marcysutton] NVDA. it's open source and free
  99. [marcysutton] or Narrator
  100. zakim-robot
    @zakim-robot
    Jul 14 17:05
    [callumacrae] Is there a word for clicking with the keyboard? just "clicking" still?
  101. [garcialo] I sometimes use “activate” for control
  102. [garcialo] but “click” is fine
  103. [garcialo] it’s like “look at this”
  104. zakim-robot
    @zakim-robot
    Jul 14 17:10
    [garcialo] for controls*
  105. stacycarston
    @stacycarston
    Jul 14 17:46
    Does anyone have experience making XFA forms accessible with Adobe LiveCycle? Specifically radio button groups - I've tried setting text for the "Exclusion Group" object as described on WCAG Techniques and Adobe's documentation but I am not having any luck with NVDA or JAWS and Reader DC. I would truly appreciate if someone is able to confirm if this does or does not work.
  106. zakim-robot
    @zakim-robot
    Jul 14 20:04
    [melsumner] What do you do when there are multiple regions "loading" at once?
  107. [melsumner] (Besides ask for a better UX)
  108. [melsumner] Any suggestions?
  109. zakim-robot
    @zakim-robot
    Jul 14 23:05
    [sandecorbett] Happy Friday! We’ve been asked to build a “hotspot” component similar to the one demonstrated here: http://avirtum.com/demo/imagelinks/. The webaim.org WAVE tool doesn’t call out many errors on that page, but I’m concerned about accessibility in the one we’re building. If anyone here has any suggestions for ensuring that a hotspot/image map with popovers is accessible, please let me know!