Archive index

A11y Slackers
Gitter Channel Archive 30th of July 2015

What fresh hell is THIS now? - Patrick Lauke
  1. stevefaulkner
    Jul 30 01:48
    @indrekpaas sure
  2. Scratch2k
    Jul 30 01:48
    Nice one Marcy, now I understand what the bot spam is, Slack users :)
  3. stevefaulkner
    Jul 30 01:53
    @Scratch2k ha!
  4. Scratch2k
    Jul 30 02:05
    I had no idea, I knew it was message forwarding from somewhere (maybe native IRC) but for some reason I has assumed the Slack channel was abandoned in preference for here, all good, it's a great solution.
  5. stevefaulkner
    Jul 30 02:24
    @Scratch2k http://www.paciellogroup.com/blog/2015/07/anybody-can-be-an-a11y-slacker/#sameroom
  6. Scratch2k
    Jul 30 02:30
    Yeah, I'm sure you've added that since I first read that post @stevefaulkner :)
  7. zakim-robot
    Jul 30 02:43
    [dylanb, a11y] @Scratch2k problem with gitter is there is only one channel. Slack has multiple, including one for jobs, event, UX, a11y-devtools, etc., etc. - only the general channel is currently being piped to gitter
  8. zakim-robot
    Jul 30 02:44
    [dylanb, a11y] so y'all that only hang out in gitter are only getting half the goodness
  9. Scratch2k
    Jul 30 02:46
    that's a good enough reason for me to swap ;)
  10. zakim-robot
    Jul 30 02:57
    [chris.hore, a11y] I could have a conversation with myself
  11. Scratch2k
    Jul 30 02:57
    Yes indeed, I could
  12. Scratch2k
    Jul 30 02:57
    ok sorry, signing off gitter :)
  13. zakim-robot
    Jul 30 03:15
    [dylanb, a11y] @chris.hore: welcome
  14. zakim-robot
    Jul 30 03:58
    [chris.hore, a11y] Thanks
  15. zakim-robot
    Jul 30 04:57
    [jitendra, a11y] @techthomas - I know them but we don’t have product companies so they can’t help
  16. stevefaulkner
    Jul 30 06:38
    Should NVDA users upgrade to Windows 10? An official statement from NV Access: http://www.nvaccess.org/win10/
  17. StommePoes
    Jul 30 07:37
    Anyone know of an accessible anti-CAPTCHA system out there?
  18. StommePoes
    Jul 30 07:38
    I don't mean the one you can access via WebVisum
  19. StommePoes
    Jul 30 07:58
    ah, I see Leonie's disclosure span does the set-aria-hidden-to-false bit instead of removing the attribute entirely. That's good.
  20. StommePoes
    Jul 30 08:59
    nevermind on the captcha question, it turned out the question was different, I mis-interpreted it.
  21. stevefaulkner
    Jul 30 09:00

    A11ySlackers chat log 29th of July 2015 - http://w3c.github.io/a11ySlackers/archives/290715.html

  22. MichielBijl
    10:59
    stevefaulkner: appreciate your effort on the logging. Any luck on finding someone to automate it?
  23. stevefaulkner
    11:10
    @MichielBijl @IanPouncey is working on it
  24. MichielBijl
    11:12
    Great!
  25. philwolstenholme
    11:50
    Hello all, first time using this room. Does anyone have any advice on forcing screen readers to read a date in an explicit format/order rather than adjusting the order of the date to suit the user's regional settings or the preferences of the screenreader? I've got a label for a text input which tells the user that they should enter a date using the format '30 July 2015' (not great I know, but it's a design requirement for consistency with how dates are displayed across the site). VoiceOver reads this as '30 July 2015' (which is what we want) but Narrator reads it as 'July 30th, 2015' which isn't a format that would be accepted. I don't have a copy of Jaws or any other AT to test with. I wonder if putting the date in a <pre> tag or something similar would instruct the screen reader to not reformat it?
  26. StommePoes
    11:52
    I'm not sure, but you could get around the issue using longer descriptions: "2-digit day, full month name, 4-digit year, no commas"
  27. StommePoes
    11:52
    If the point is to let all users know how they must input data.
  28. StommePoes
    11:53
    Better is to let the backend do Postal's law and accept more styles and sanitise/reformat back there, but I understand not everyone does that.
  29. philwolstenholme
    11:54
    Thanks @StommePoes - 2 very good points, I'll look into if we have capacity to make the backend accept a greater variety of dates, if not then the more verbose description sounds like a good approach too.
  30. StommePoes
    11:54
    I think this would be safer than trying to force an existing date description to get read out some certain way. Also, you could keep the example and let users go over it themselves moving letter-by-letter (but this along with the manual description I mentioned earlier)
  31. stevefaulkner
    11:55

    hi @philwolstenholme:

    forcing screen readers to read a date in an explicit format/order

    There are no methods that I know of

  32. StommePoes
    11:56
    The nice thing about being able to reformat the dates in the back end is you get to use the full power of your backend language and backend tools. The only obvious issue is if users put in ambiguous American/European time orders (which, on the front end you'd want to detect this and alert the user that this is an error since software cannot tell which way the date is meant)
  33. StommePoes
    11:57
    So if someone does 09/10/yyyy then it's impossible for backend software to know if this is the 9th of october or the 10th of september. This must always be a fail.
  34. StommePoes
    11:58
    I've seen some folks do a first-sweep reformat on the front-end where Javascript changes the user input to the format you prefer as soon as they blur from it or even while typing, but you'd still need sanitisation on the back end anyway, so double work. But the usability benefits might be worth it, esp if users return to the site regularly instead of being a one-off thing.
  35. StommePoes
    11:59
    I've seen it with telephone numbers as well.
  36. zakim-robot
    12:01
    [Robin Whittleton, a11y] American / Everyone else
  37. zakim-robot
    12:02
    [Robin Whittleton, a11y] well, apart from non-Gregorian I guess
  38. philwolstenholme
    12:02
    Thanks for the help :) The date field has a jQuery datepicker which we imagine most sighted users will use (although they can still type in a date manually), but we have a story to remove the date picker on small viewports and replace it with a type="date" input field instead so mobile users get the native datepicker of their OS. I might try and expand this story so that the field is turned into a date input if the field is tabbed into. Does that sounds like something that would be beneficial?
  39. philwolstenholme
    12:02
    Just heading out to lunch now, thanks again everyone
  40. MichielBijl
    12:13
    Here is a list of the different date formats around the world: https://en.wikipedia.org/wiki/Date_format_by_country
  41. rodneyrehm
    12:13
    @alice @marcy you remember talking about removing a shadowed tree from the sequential focus navigation order, when the ShadowHost got tabindex=“-1”? in case of <video> "it works as intended” - https://code.google.com/p/chromium/issues/detail?id=512133
  42. StommePoes
    12:36
    @Michiel looks correct: America vs the world
  43. StommePoes
    12:36
    :P
  44. MichielBijl
    14:25
    @Mallory haha, yeah, but I was surprised by the different notation around the world (like DMY)
  45. StommePoes
    14:27
    ddmmjjjj
  46. zakim-robot
    14:31
    [Robin Whittleton, a11y] First time I got a Japan Rail pass I was a bit confused by the date
  47. zakim-robot
    14:31
    [Robin Whittleton, a11y] example: http://nisa-arce.net/blog/wp-content/uploads/2012/05/japan-rail-pass-multizona-2.jpg
  48. zakim-robot
    14:32
    [Robin Whittleton, a11y] it’s yymmdd, where the yy is the traditional Japanese year notation of ‘years since the Emperor came to power’
  49. Heydon
    15:01
    Question: If I use role="form" does anyone know if any UAs actually then bind ENTER to submit? I know it's unlikely/shouldn't but these are strange days we live in.
  50. zakim-robot
    15:05
    [Wilco Fiers, a11y] It shouldn't. ARIA only effects how something is communicated to AT, not the way UAs work with the element
  51. Heydon
    15:07
    @Wilco Indeed. But there have been some notable exceptions, like Microsoft's aria-haspopup implementation. https://msdn.microsoft.com/en-us/library/jj152135%28v=vs.85%29.aspx
  52. rodneyrehm
    15:21
    @Heydon since when do UAs (browsers, I assume) do anything with any aria attribute (other than than passing it through to the AT)?
  53. rodneyrehm
    15:22
    PSA: if you scroll all the way to the bottom, you may not need to reply to a question anymore :D
  54. Heydon
    15:23
    @rodneyrehm https://msdn.microsoft.com/en-us/library/jj152135%28v=vs.85%29.aspx
  55. rodneyrehm
    15:23
    yeah, reading it right now
  56. Heydon
    15:24
    It is an exception, but it gave me the jitters.
  57. rodneyrehm
    15:24
    interesting. we now have precedence… :/
  58. rodneyrehm
    15:25
    *precedent
  59. Heydon
    15:26
    I think they removed the behavior later, but not sure.
  60. rodneyrehm
    15:28
    https://msdn.microsoft.com/en-us/library/dn265029%28v=vs.85%29.aspx (IE11)
  61. Heydon
    15:31
    Oh. Not sure what I think of this.
  62. rodneyrehm
    15:46
    I was going to implement keyboard handling for aria defined widgets in a way that would determine the activeElement’s role and decide what to do for “arrow left” from there. So, I would have tied aria to actual behavior in the browser as well
  63. rodneyrehm
    15:47
    and if I remember correctly, your aria examples did the “same” thing. how’s that different to what IE did here, @Heydon?
  64. rodneyrehm
    15:48
    (same goes for [aria-hidden] { display: none; })
  65. zakim-robot
    15:59
    [monastic.panic, a11y] does anyone know what a good top level role should be for a dropdown list (<select/> replacement)
  66. zakim-robot
    16:00
    [monastic.panic, a11y] listbox comes to mind but the inner <ul> containing all the options (the popup) already has that role
  67. zakim-robot
    16:01
    [monastic.panic, a11y] is combobox fine to use?
  68. rodneyrehm
    16:10
    combobox implies selection and input, no?
  69. rodneyrehm
    16:10
    http://www.w3.org/WAI/PF/aria/roles#combobox
  70. kaleb
    16:14

    @monatic.panic :point_up: Earlier I asked:

    When should one use [role=textbox aria-autocomplete=list] vs [role=combobox aria-autocomplete=list]?

  71. kaleb
    16:15
    With the textbox, you would have to state that it controls a popup, I assume, but combobox takes care of that?
  72. zakim-robot
    16:16
    [monastic.panic, a11y] for some context here is the actual dropdown
  73. zakim-robot
    16:16
    [monastic.panic, a11y] http://jquense.github.io/react-widgets/docs/#/dropdownlist
  74. kaleb
    16:16 
    <div role=combobox>
  <input role="textbox">
  <ul role=listbox>...</ul>
</div>
  75. Heydon
    16:17
    @rodneyrehm I think the idea is that behavior should_ be user defined, in which case it _shouldn't be UA defined. TBH, though, I'd rather UAs did all the hard work.
  76. zakim-robot
    16:17
    [monastic.panic, a11y] ^^^ I am leaning towards that, but the "input" is jsut a span with text in it
  77. kaleb
    16:19
    If the user is not typing like in the link you shared, i don't think combobox is appropriate.
  78. kaleb
    16:19
    But I am no expert.
  79. rodneyrehm
    16:20
    @Heydon I’m creating a generic library to take care of the “hard work” so we don’t have to re-implement the same shit over and over again… https://github.com/medialize/ally.js/tree/master/ - currently only dealing with focus management, next step (after releasing 1.0.0) would be looking at making working with aria less of a pain
  80. kaleb
    16:20
    The abstract select role has many sub-classes.
  81. rodneyrehm
    16:21
    (in case you’re interested)
  82. Heydon
    16:42
    @rodneyrehm I like your style +1
  83. rodneyrehm
    16:50
    to some extent, the project was triggered by your fronteers talk last year - and our little discussion outdoors afterwards ;)
  84. Heydon
    16:51
    I remember it well!
  85. rodneyrehm
    16:52
    the talk or the discussion? :D
  86. Heydon
    16:56
    The discussion. I've supressed the talk ;-)
  87. rodneyrehm
    16:57
    why? it was a good one. in fact it was so good, that it got me started on this stuff.
  88. StommePoes
    17:23
    dammit why aren't you coming to fronteers again this year
  89. powrsurg
    17:31
    ... got a client wondering why our PDF to text feature wasn't converting over the slide for this companies "Accommodations & ADA Compliance practices" pdf. That text is a graphic ....
  90. StommePoes
    17:34
    heh
  91. StommePoes
    17:34
    though you'd be an awesome superhero if you pdf-to-png-to-tesseract'd that file
  92. StommePoes
    17:35
    (you'd have to correct tesseract tho)
  93. powrsurg
    17:35
    yes I would
  94. StommePoes
    17:36
    @philwolstenholme: https://twitter.com/scottjehl/status/626778748143185920
  95. StommePoes
    17:36
    @philwolstenholme: Marcy described it "Love the message about being liberal with inputs, and conservative about features delivered. "
  96. zakim-robot
    19:02
    [Marcy Sutton, a11y] @rodneyrehm super interesting regarding the video/audio elements and not being able to suppress focus on items in the shadow tree. What is the use case though?
  97. rodneyrehm
    19:03
    use case of disabling focus?
  98. zakim-robot
    19:04
    [Marcy Sutton, a11y] disabling focus of video controls
  99. zakim-robot
    19:04
    [Marcy Sutton, a11y] (just thinking through the scenario)
  100. rodneyrehm
    19:04
    http://medialize.github.io/ally.js/examples/disable-focus.html
  101. rodneyrehm
    19:05
    the use case is to be able to provide a function that mimics inert sub-trees (the inert attribute was dropped from HTML5, because “the dialog element has inert sub trees, and that’s enough")
  102. rodneyrehm
    19:07
    the idea is to stop “trapping focus”, because messing with user-interaction never goes well. simply “inerting” all interactive content is the cleaner way to go (in my mind, at least)
  103. zakim-robot
    19:08
    [Marcy Sutton, a11y] ooooo
  104. zakim-robot
    19:10
    [Marcy Sutton, a11y] Really cool;
  105. rodneyrehm
    19:11
    Alice mentioned something about you having tried something similar?
  106. rodneyrehm
    19:11
    with “inert”, I mean
  107. zakim-robot
    19:11
    [Marcy Sutton, a11y] Not that I can recall at the moment, and pretty sure I would remember doing it
  108. rodneyrehm
    19:12
    ok, no worries
  109. zakim-robot
    19:12
    [Marcy Sutton, a11y] I have written a DOM walker to disable everything behind a modal dialog, maybe that’s what she was thinking of?
  110. rodneyrehm
    19:12
    maybe. do you have a link handy?
  111. zakim-robot
    19:12
    [Marcy Sutton, a11y] https://github.com/angular/material/blob/master/src/components/dialog/dialog.js#L686
  112. zakim-robot
    19:13
    [Marcy Sutton, a11y] It was only written in that fashion because we allow developers to choose a parent
  113. rodneyrehm
    19:13
    do you know about https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker for walking the dom?
  114. zakim-robot
    19:13
    [Marcy Sutton, a11y] Focus is also trapped in the modal to complete the interaction…but it currently allows accessing of browser UI controls
  115. zakim-robot
    19:13
    [Marcy Sutton, a11y] Yes, but I had to start at the dialog and go upwards
  116. rodneyrehm
    19:14
    ehy?
  117. rodneyrehm
    19:14
    why upwards?
  118. zakim-robot
    19:14
    [Marcy Sutton, a11y] Maybe there’s a way to do it with TreeWalker…but I had to keep a path to the body open in order to set aria-disabled
  119. zakim-robot
    19:15
    [Marcy Sutton, a11y] i.e., only set it on sibling nodes and not any parent elements all the way up the DOM tree
  120. rodneyrehm
    19:16
    I guess I’d have collected the ancestry and then fired from the top, filtering any elements in the ancestry…
  121. zakim-robot
    19:16
    [Marcy Sutton, a11y] Sounds possible, that’s just how I solved it
  122. rodneyrehm
    19:17
    not judging ;)
  123. zakim-robot
    19:17
    [Marcy Sutton, a11y] If you could override a subtree with aria-hidden=false, i could remove it altogether
  124. rodneyrehm
    19:18
    you can’t?
  125. zakim-robot
    19:18
    [Marcy Sutton, a11y] Nope. Once you set aria-hidden=true, all children are hidden
  126. rodneyrehm
    19:19
    ah, you can’t set aria-hidden=“false” on a descendant of aria-hidden=“true” - that’s what you mean, right?
  127. zakim-robot
    19:19
    [Marcy Sutton, a11y] Correct
  128. rodneyrehm
    19:19
    ok, yeah, that’s the same issue I had with the inert polyfill
  129. rodneyrehm
    19:19
    (and the original spec, for that matter)
  130. rodneyrehm
    19:21
    ha, interesting problem
  131. zakim-robot
    19:22
    [Marcy Sutton, a11y] Definitely :simple_smile:
  132. zakim-robot
    19:22
    [Marcy Sutton, a11y] I love what you’re doing, keep it up!
  133. rodneyrehm
    19:23
    do you think that “hide everything but my ancestry and myself” is something regular applications need?
  134. zakim-robot
    19:25
    [Marcy Sutton, a11y] I needed it for dialogs, i could see it coming up again but I’m not sure of the context
  135. rodneyrehm
    19:26
    so basically what I’ve done for interactive content (ie. making them unfocusable) is what you’ve done for all content
  136. rodneyrehm
    19:27
    “disable focus” needs to be done for everyone, “hide” needs to be done for AT.
  137. zakim-robot
    19:28
    [Marcy Sutton, a11y] Sweet!
  138. rodneyrehm
    19:29
    I don’t think the TreeWalker thing would’ve imrpoved anything for you
  139. zakim-robot
    19:29
    [Marcy Sutton, a11y] I was curious about the video element mostly regarding when you would disable focus vs. using display: none, but I think I have my answer: what if it was behind a modal dialog
  140. rodneyrehm
    19:39
    @marcy what’s the reason you filtered script and style elements in your walkDOM()?
  141. zakim-robot
    19:42
    [Marcy Sutton, a11y] Ya know, I can’t recall what my reasoning was at the time
  142. zakim-robot
    19:42
    [Marcy Sutton, a11y] But it’s probably unnecessary
  143. rodneyrehm
    19:42
    hehe, ok
  144. zakim-robot
    19:44
    [Marcy Sutton, a11y] A more appropriate place could be <template> in IE, but you’d probably be using a polyfill anyways so ¯_(ツ)_/¯
  145. rodneyrehm
    19:50
    do you have do something to the ancestry itself as well?
  146. zakim-robot
    19:52
    [Marcy Sutton, a11y] I haven’t thought through the problem that much, regarding WC’s and inert. Kind of a time-suck for APIs that are quite in flux
  147. rodneyrehm
    19:53
    true
  148. zakim-robot
    19:53
    [Marcy Sutton, a11y] This topic keeps coming up though…I’m actually including it in my mobile web a11y talk this Saturday at Open Web Camp
  149. rodneyrehm
    20:08
    haha… I just realized this would totally fail in my app. only because of [aria-hidden=“true”] { display: none }
  150. rodneyrehm
    20:10
    ok, calling it a day. have fun :)
  151. zakim-robot
    20:11
    [Marcy Sutton, a11y] Ah yes I don’t follow that pattern...prefer to keep aria-hidden separate from display: none
  152. zakim-robot
    20:12
    [Marcy Sutton, a11y] Welcome @aarongustafson :simple_smile:
  153. zakim-robot
    20:12
    [aarongustafson, a11y] Thanks @Marcy Sutton!
  154. zakim-robot
    20:26
    [Winston Hearn, a11y] welcome Aaron!
  155. stevefaulkner
    20:56
    welcomes @aarongustafson, from the cheap seats
  156. stevefaulkner
    21:23
    hey @koalie!
  157. zakim-robot
    21:27
    [Marcy Sutton, a11y] Is it possible to automate a screen reader for testing/validation purposes? @dylanb mentioned Applescript for VO (though I haven’t seen a solution for it). Wondering if there is precedent on Windows
  158. zakim-robot
    21:34
    [Karl Groves, a11y] @Marcy Sutton: if you know Python you can probably do this with NVDA
  159. zakim-robot
    21:34
    [Marcy Sutton, a11y] hmm
  160. zakim-robot
    21:34
    [Marcy Sutton, a11y] It would be so rad to be able to add AT testing to integration tests
  161. zakim-robot
    22:10
    [dylanb, a11y] @Karl Groves: is right and I postulated this in the discussion @Marcy Sutton mentioned
  162. zakim-robot
    22:14
    [Karl Groves, a11y] I’m not really sure the utility of this, though, other than possibly to introduce more frustration. Assuming proper unit tests and acceptance test coverage, you’re more likely to discover browser/ AT bugs than bugs in your own code by down this
  163. zakim-robot
    22:38
    [Marcy Sutton, a11y] True :disappointed:
  164. zakim-robot
    23:09
    [Marcy Sutton, a11y] Question for you @Karl Groves: Tenon is JavaScript aware..but is it breakpoint aware? Wondering about testing page source specifically at mobile breakpoints
  165. zakim-robot
    23:10
    [Marcy Sutton, a11y] I’m asking a bunch of “what-if” questions right now :simple_smile:
  166. zakim-robot
    23:16
    [Karl Groves, a11y] Indeed it is!
  167. zakim-robot
    23:25
    [Marcy Sutton, a11y] Yay! How does that work?
  168. zakim-robot
    23:26
    [Marcy Sutton, a11y] Ahh nevermind I found it. viewportWidth
  169. zakim-robot
    23:36
    [Karl Groves, a11y] :+1: