Archive index

A11y Slackers Gitter Channel Archive 7th of October 2016

What fresh hell is THIS now? - Patrick Lauke
  1. zakim-robot
    @zakim-robot
    Oct 07 01:53
    [cookiecrook] Hi everyone, I'm trying to build a list of sites that use vestibular trigger animations: parallax, multi-plane animation, zoom/scale, multi-directional animation, peripheral animation during focus/typing operations, etc.
  2. [cookiecrook] Here are a few of the better ones I've found:
  3. [cookiecrook] Examples of vestibular trigger usage on sites (Mostly desktop):
  4. [cookiecrook] - multi-plane animation: http://www.apple.com/ios/ios-10/
  5. [cookiecrook] If you know of more, please post them with an @cookiecrook... Thanks!
  6. [cookiecrook] Making the case for a (prefers-reduced-motion) media feature.
  7. [caesar] Not sure what this has to do with accessibility (other than being "not very")?
  8. [caesar] But here's one for you: https://onlycoin.com/
  9. zakim-robot
    @zakim-robot
    Oct 07 02:01
    [cookiecrook] @caesar Re: "what this has to do with accessibility": There are visual accessibility settings for this on Apple platforms. The vestibular issues include inner-ear based balance problems and motion sensitivities related to a heightened psychological response to the perception of neurotoxin poisoning.
  10. [cookiecrook] Basically, the worst of these sites could potentially make someone fall over (Cuberto example) or feel ill/queasy or even lose their lunch (NYT Penn Station example)
  11. [cookiecrook] Thanks for the example.
  12. James Nurthen
    @jnurthen
    Oct 07 02:05
    @cookiecrook why did apple tie the reduce motion to the new iMessage features? Most of the animations I see in iMessage aren't very motiony
  13. zakim-robot
    @zakim-robot
    Oct 07 02:05
    [cookiecrook] @jamesn No comment. Try the betas.
  14. James Nurthen
    @jnurthen
    Oct 07 02:06
    @cookiecrook Understood.
  15. zakim-robot
    @zakim-robot
    Oct 07 02:11
    [caesar] Sorry, I just misunderstood your intentions because you mentioned that "here are a few of the better ones", which made me think they were somehow "good"
  16. [cookiecrook] Actually @jamesn, comment should probably be: "Thank you for your feedback. Apple is committed to accessibility and the engineering teams work hard to make all features available to all users at first launch… or as soon as possible."
  17. James Nurthen
    @jnurthen
    Oct 07 02:12
    :)
  18. zakim-robot
    @zakim-robot
    Oct 07 02:12
    [cookiecrook] @caesar Ah yeah. Good examples demonstrating the need for a media feature.
  19. zakim-robot
    @zakim-robot
    Oct 07 02:21
    [caesar] Quora is probably a good place to find more: https://www.quora.com/What-are-some-good-examples-of-parallax-scrolling-in-web-design
  20. zakim-robot
    @zakim-robot
    Oct 07 07:52
    [jv] https://twitter.com/sw12/status/784028066293121024
  21. zakim-robot
    @zakim-robot
    Oct 07 08:30
    [jpdevries] I'm in <3 with `<details>`. I wasn't sure if this would be possible so I tried it. Accessible tree component! https://twitter.com/mrktps/status/784306981494362112
  22. zakim-robot
    @zakim-robot
    Oct 07 08:39
    [cookiecrook] Great idea @jpdevries! Have you tried sprinkling ARIA roles (tree, group, treeitem) and levels (aria-level) on it to make it more understandable? Probably okay to leave aria-expanded out of your test case, b/c it seems like rendering engines could infer the expansion state from the open DOM property. (And because that would break your goal of an JS-free tree.)
  23. JP DeVries
    @jpdevries
    Oct 07 08:41
    I haven't but I think the details component is accessible out of the box? Haven't tested it yet https://twitter.com/stevefaulkner/status/783336943388127232
  24. zakim-robot
    @zakim-robot
    Oct 07 08:55
    [cookiecrook] The functionality of <details> is accessible, but using it as a tree is not understandable (WCAG Guideline 3)… I bet it would be more so if you used ARIA to convey it as a tree.
  25. [cookiecrook] https://www.w3.org/TR/WCAG20/#contents
  26. zakim-robot
    @zakim-robot
    Oct 07 11:21
    [tommyfeldt] Hi everyone! I was wondering, does anyone know a good accessible date picker widget in the wild?
  27. zakim-robot
    @zakim-robot
    Oct 07 12:25
    [scottohara] @tommyfeldt i’ve heard https://github.com/dbushell/Pikaday plays nicely with screen readers, and in my light testing of it, it seemed to work as expected
  28. zakim-robot
    @zakim-robot
    Oct 07 12:40
    [lefthandev] Hey there, anyone know of a website that claims to meet AAA compliance out there on the internets?
  29. zakim-robot
    @zakim-robot
    Oct 07 13:32
    [jv] Any google developer here? This extension is not working https://chrome.google.com/webstore/detail/image-alt-text-viewer/hinbolcnfifkhlcehoakdledkfjiaeeg
  30. zakim-robot
    @zakim-robot
    Oct 07 13:52
    [car] @jpdevries @cookiecrook The deets keyboard behavior feels a bit non-intuitive (for a tree) without arrow keys. Would marking it up as a tree make it confusing to use?
  31. [jpdevries] @car thx for the feedback. so far it is just nested details. What do you mean by marking it up like a tree?
  32. zakim-robot
    @zakim-robot
    Oct 07 14:10
    [jpdevries] looks like the "icons" could maybe use tabindex="-1" they probably don't really need to receive focus
  33. zakim-robot
    @zakim-robot
    Oct 07 14:33

    [car] @jpdevries Agreed re icons tabindex=-1. The svg's could probably use a <title> (even if they won't take focus any more): https://css-tricks.com/accessible-svgs/#article-header-id-8

    What do you mean by marking it up like a tree?
    I meant what @cookiecrook mentioned:
    Have you tried sprinkling ARIA roles (tree, group, treeitem) and levels (aria-level) on it to make it more understandable?

  34. [jpdevries] @car icons have a title in the symbol sprite but I haven't tested if that gets included with <use> yet
  35. [jpdevries] Oh, no I haven't. Reason being I was under the impression <details> had all those a11y goodies baked in.
  36. Jonathan Neal
    @jonathantneal
    Oct 07 15:23
    Here’s a beautifully dreadful topic: carousels and slide shows. I’ve been long skeptical of carousels, and I’m familiar with many “accessible” carousels around the web. However, I’m told that our users strongly engage with carousels across our sites, and my role will be to build a new, configurable carousel system that is as accessible as possible.
  37. The problem I am trying to solve right now is that I find carousels to be inherently visual. I think of them as a viewport for a list, showing only one or a few items in that list at a time, and having pagination controls to manipulate the viewable area. I’m not sure if that translates into something aural. I would think it would be better for the aural experience to be simply a list. The mixed aural/visual experience would then be something like pagination controls. Does this line of thinking seem sensical to anyone else?
  38. zakim-robot
    @zakim-robot
    Oct 07 17:07
    [alice] That's on me. A change to <img> internals in chrome broke the extension. Thanks for bugging!
    Any google developer here? This extension is not working https://chrome.google.com/webstore/detail/image-alt-text-viewer/hinbolcnfifkhlcehoakdledkfjiaeeg
  39. zakim-robot
    @zakim-robot
    Oct 07 19:10
    [drtomlins] has anyone tried the ARIA Validator extension for Chrome?? https://chrome.google.com/webstore/detail/aria-validator/oigghlanfjgnkcndchmnlnmaojahnjoc?browser=chrome
  40. James Nurthen
    @jnurthen
    Oct 07 22:47
    @drtomlins - the fact that it hasn't been updated since August 6, 2014 would concern me. I'd stick to aXe which includes quite a bit of ARIA validation (Chrome Accessibility Dev Tools do as well I believe)
  41. actually - looking at https://code.google.com/archive/p/aria-toolkit/ it seems like this got consumed into Chrome Accessibility Developer Tools