Archive index

A11y Slackers Gitter Channel Archive 27th of June 2017

What fresh hell is THIS now? - Patrick Lauke
  1. zakim-robot
    @zakim-robot
    Jun 27 12:18
    [mgifford] I posted some accessibility courses here on GitHub, please let me know ones I’ve missed (or that are no longer being offered) https://github.com/mgifford/a11y-courses
  2. [mgifford] This is a github account, so would love to share access to folks looking to maintain a list like this.
  3. zakim-robot
    @zakim-robot
    Jun 27 12:34
    [bethra] I'm working with 2 dev teams to create a mobile app, and they're arguing over which javascript framework to use. I've been asked to use accessibility as a reason to go with native over ionic. Is this a valid argument? I do not know the first thing about javascript, but I'm the only a11y person at this company whom they can ask... so I defer to y'all. :-*
  4. zakim-robot
    @zakim-robot
    Jun 27 12:43

    [cehfisher] nice list @mgifford! i’ll be sharing it with my team :) wondering if there is a list someplace of a11y certifications too?

    p.s. we could discuss the pros/cons to certifications to no end, but the clients i work with (who typically know nothing about accessibility) like to see them. shows some sort of quantifiable measure of a11y knowledge

  5. [ilwcss] sorry for writing in general, but i have a question specifically to html select and input fields, which channel is the correct one? (sweat smile emoji)
  6. [bethra] @ilwcss this one gets the most traffic.
  7. zakim-robot
    @zakim-robot
    Jun 27 12:49
    [ilwcss] alright thanks, so i will just go ahead and ask, i have a simple select box like this https://jsfiddle.net/ucswub42
  8. [ilwcss] all the examples in the web also suggest adding correct labels, but the mac voice over just won’t announce them
  9. [ilwcss] it just announces the current value, which is without context (the label) not very useful :o
  10. [ilwcss] maybe someone already encountered it and can help me?
  11. zakim-robot
    @zakim-robot
    Jun 27 12:57

    [scottohara] hi @ilwcss what browser combination are you using?

    just tested in safari and firefox w/voice over and it announced “[current value] what’s your favorite fruit, popup button”

  12. [ilwcss] i use chrome
  13. [scottohara] ha. yup. doesn’t read as it should there.
  14. [scottohara] it does announce itself correctly if you pair chromevox w/chrome though
  15. [scottohara] most screen reader users on a mac will use voice over + safari, as VO is optimized to work primarily w/Safari
  16. [ilwcss] okay, good to know thanks.
  17. [ilwcss] and chromevox is a chrome plugin?
  18. [scottohara] yes
  19. [scottohara] you should give this post a read if you want more info on pairings for SR+browser testing: http://hollier.info/browserpairing/
  20. [ilwcss] thanks a lot, will read it :)
  21. zakim-robot
    @zakim-robot
    Jun 27 13:22
    [mgifford] I posted this on Twitter, but wondered if anyone here knew https://twitter.com/mgifford/status/879675619499548673
  22. zakim-robot
    @zakim-robot
    Jun 27 14:16
    [muan] @mgifford I do most of the accessibility fixes in GitHub
  23. [mgifford] Terrific @muan thanks for reaching out to me.
  24. zakim-robot
    @zakim-robot
    Jun 27 14:23
    [starla175] @karlgroves @marcysutton @tink I have 2 dev teams arguing over which javascript framework is the best for building a new app. One team wants to use Native, the other Ionic. I'm assuming Native is better, but I'm not a developer, and I don't know anything about javascript. I asked a little earlier under a different account (I have Slack password issues) but I'm afraid it will get lost. You are my only hope Obi Wan! ;)
  25. zakim-robot
    @zakim-robot
    Jun 27 14:31

    [karlgroves] A long time ago I used to work at a Harley dealership. The service department had two techs next to each other who used to argue all the time - one was a young guy named Rob who thought he was the coolest guy on earth. He had to have all the latest shiny tools and things. The guy in the next bay - who he’d always argue with - was a guy we affectionately called “Old Man Brian”. Old Man Brian was a member of the Boozefighters motorcycle club. Boozefighters, BTW, was the group portrayed in the old movie The Wild One. (For the record, Boozefighters by this point were all old men who didn’t fight much anymore and didn’t drink much booze)

    Anyway, Old Man Brian used to ride Rob pretty hard, as men do sometimes, and used to say “it is a poor mechanic who blames his tools”.

    And in my long rambling way, what I’m saying is a good developer can get the job done with either framework. Personally, I hate anything Angular-based so I’d steer away from Ionic. I can bet $10 that @marcysutton would disagree.

  26. [karlgroves] BTW, when you say “Native” do you mean NativeScript or React Native?
  27. [marcysutton] I actually don't have a preference as they're all tools for getting the job done. Shrug
  28. [starla175] @karlgroves LOL, did Rob later legally change his name to Robb?
  29. [starla175] and thank you both!
  30. zakim-robot
    @zakim-robot
    Jun 27 14:37

    [karlgroves] > I actually don’t have a preference as they’re all tools for getting the job done. Shrug

    I meant more in terms of my aversion to Angular. ;)

  31. [karlgroves] @starla175 Rob was actually a cool guy. I think he just liked gadgets and Brian knew how to get under his skin.
  32. [starla175] So there's no real downside to using a "hybrid" app vs. creating 2 native apps?
  33. [starla175] iOS and Android
  34. [kivi] Is the distinction between web apps vs native apps, or between two Javascript frameworks, one of which is called "native"?
  35. zakim-robot
    @zakim-robot
    Jun 27 14:42
    [starla175] yes, I don't know Javascript, so when I say "Native" I just mean a native app
  36. [starla175] I'm not even qualified to be having this conversation, let alone making decisions on it. LOL

  37. [karlgroves] @starla175 Oh, so thats what you meant by Native.

    IMO, I’d always opt for using the platform objects. That said, I don’t have any data to suggest doing otherwise is bad. The thing is, the native UI objects should have everything needed for accessibility. If the hybrid framework doesn’t do what’s necessary to create those objects accessibly, things go south

  38. [starla175] I know you can use ng-aria to improve a11y, but is that enough?
  39. [starla175] Someone I work with said they heard you can't increase dynamic text sizes with Ionic, but I wouldn't know if that's true or not.
  40. [scottohara] ng-aria can help. but aria can also hurt if used incorreclty
  41. [scottohara] or provide a false sense of value
  42. zakim-robot
    @zakim-robot
    Jun 27 14:48
    [starla175] The scary thing is they don't know anything about accessibility yet. Their only frame of reference is a 20 minute talk I gave for GAAD. :\
  43. [scottohara] i was reviewing an angular app the other day that was riddled with aria-flowto attributes. i was thoroughly confused as to it’s usage, because it didn’t seem to be used in a way to alter normal parsing of the content in any way
  44. zakim-robot
    @zakim-robot
    Jun 27 14:53
    [marcysutton] Worth noting that ng-aria was only for Angular 1. Newer versions don't have the same utility--but you don't necessarily need it if you handle accessibility yourself. I agree with Scott that it created a false sense of security since ARIA is a more advanced topic to reach for only after you've exhausted native HTML first.

  45. [scottohara] i got some major push back from a dev partner of ours, when i was telling them “you really don’t need role=“form” on your <form>”

    not sure if they were using ng-aria or what, but they were adamant that “this is what angular recommends, so we don’t think we should remove it”

    just let that one go…

  46. zakim-robot
    @zakim-robot
    Jun 27 15:10
    [starla175] @scottohara That's hilarious, and super frustrating.
  47. [scottohara] yeh. i waiver on the hilarious/frustrated/meh scale. totally depends on the day :)
  48. zakim-robot
    @zakim-robot
    Jun 27 15:46
    [kivi] @starla175 web apps, native apps, and hybrid apps can all meet accessibility requirements if coded with intention. This may be a decision you'll have to make on other merits.
  49. zakim-robot
    @zakim-robot
    Jun 27 16:01
    [bethra] Thanks @kivi I feel like sticking with native apps would be safer as far as incorporating ally when working with people new to a11y.
  50. [bethra] (Sorry... I'm the same person, using a different account)
  51. zakim-robot
    @zakim-robot
    Jun 27 17:50
    [melsumner] Some days I feel like there should be an "accessibility developer support hotline." Totally one of those days, y'all.
  52. zakim-robot
    @zakim-robot
    Jun 27 18:29
    [sugi] hi all, have a bit of issue and hoping someone could shine some lights. So, I have a <button> on my page. The problem is whenever i click on it, the focus shows up and I have to click somewhere else to discard it. Is there a way to just display the focus when i navigate to it using keyboard?
  53. zakim-robot
    @zakim-robot
    Jun 27 18:39
    [chrisgeary92] I think you need JS to do it.. You can check the event that's triggered and see whether it was by click, or by keypress (tab)
  54. [tyronem] Something like this, @chrisgeary92? https://stackoverflow.com/questions/23705055/input-effect-on-keyboard-tab-focus-but-not-on-click
  55. [alexlande] https://github.com/ten1seven/what-input is a library for this purpose
  56. [sugi] so i have to use js.
  57. zakim-robot
    @zakim-robot
    Jun 27 18:44
    [chrisgeary92] Yeah like those :)
  58. [alexlande] yeah. There's a proposal for a :focus-ring pseudo-class that would let you handle it in CSS, but I don't think it's implemented anywhere yet: https://drafts.csswg.org/selectors-4/#the-focusring-pseudo
  59. [sugi] @alexlande do you mean this one?
    https://developer.mozilla.org/en-US/docs/Web/CSS/:-moz-focusring
  60. zakim-robot
    @zakim-robot
    Jun 27 18:49
    [alexlande] oh yeah, that would be the one
  61. [alexlande] the firefox prefixed version anyway
  62. [sugi] i guess it has to be js for now =@
  63. [sugi] Thank you everyone for your help :)
  64. zakim-robot
    @zakim-robot
    Jun 27 19:13
    [marcysutton] > Is there a way to just display the focus when i navigate to it using keyboard?
    Ah, a question for the ages. There's an active discussion going on here, might be of interest: w3c/csswg-drafts#709
  65. zakim-robot
    @zakim-robot
    Jun 27 19:24
    [sugi] @marcysutton thanks for the link! going to read it now
  66. zakim-robot
    @zakim-robot
    Jun 27 19:48
    [melsumner] Has anyone ever dealt with "load more options" in a typeahead component?
  67. [melsumner] I'm looking at something that seems like it should technically be doable but there's this little voice in the back of my head that is saying "hey hey this is a bad idea."
  68. zakim-robot
    @zakim-robot
    Jun 27 20:45
    [geertmelotte] Hello all, I am implementing an autocomplete that is added to the page through javascript as a form of progressive enhancement. I have followed following guidelines https://www.w3.org/TR/wai-aria-1.1/#aria-autocomplete. Now my implementation won’t pass the AXE check “Certain ARIA roles must contain particular children, Required ARIA child role not present: option”. The problem is that these children will be inserted into the DOM once the users enters a value in the input field. Is this a problem for screenreader users?
  69. zakim-robot
    @zakim-robot
    Jun 27 20:54
    [robdodson] @sugi we also have a polyfill for focus-ring https://github.com/wicg/focus-ring
  70. [robdodson] someone on twitter recently clued me into https://github.com/evcohen/eslint-plugin-jsx-a11y. Do you all know of any other a11y linters for frameworks out there?
  71. [marcysutton] react-a11y probably?
  72. [marcysutton] or react-axe. they have similar places in the development lifecycle
  73. zakim-robot
    @zakim-robot
    Jun 27 21:12
    [robdodson] @marcysutton oh yeah i mean for othe rframeworks
  74. [robdodson] like does angular have any kind of a11y linter?
  75. [marcysutton] Not that I know of.
  76. zakim-robot
    @zakim-robot
    Jun 27 21:19
    [sugi] @robdodson I have somehow similar idea of listening to key code and change it to using css class that shows the outline if the key code is enter or space. But i think what you just showed is more comprehensive. definitely will take a look at that. thanks^
  77. zakim-robot
    @zakim-robot
    Jun 27 22:01
    [joseorihuela] :wave:
  78. zakim-robot
    @zakim-robot
    Jun 27 23:38
    [nschonni] Does anyone have a better understanding of vestibular disorders? I filed ossfriday/ossfriday#107 but I may be way off base. /cc @muan since it's GH related
  79. zakim-robot
    @zakim-robot
    Jun 27 23:55
    [marcysutton] it is kind of an unnecessary animation...but it doesn't flash or continue past a few seconds. You could suggest they use prefers-reduced-motion perhaps? https://www.w3.org/TR/UNDERSTANDING-WCAG20/seizure-does-not-violate.html
  80. [marcysutton] ^ that's the WCAG criteria I refer to for flashing content.