Archive index

A11y Slackers Gitter Channel Archive 27th of January 2017

What fresh hell is THIS now? - Patrick Lauke
  1. Job van Achterberg
    @jkva
    Jan 27 09:57
    Morning folks
  2. I was asked "how to make sure images used in facebook posts are accessible". I don't use FB myself, what is your preferred method?
  3. zakim-robot
    @zakim-robot
    Jan 27 09:59
    [tink] Morning.
  4. [tink] I use the captions field to describe the image - though Facebook's auto-image recognition thing does an adequate job of it.
  5. Job van Achterberg
    @jkva
    Jan 27 10:06
    Thanks @tink! I did read about facebook's algorithms for image captioning. Very interesting. And a bit creepy.
  6. zakim-robot
    @zakim-robot
    Jan 27 10:09
    [tink] It is a bit strange. But it makes so many more images accessible - at least to a degree, that it's worth it I think.
  7. [tink] For some reason I find Facebook's ability to auto-recognise my friends from pictures even creepier.
  8. Mallory
    @StommePoes
    Jan 27 11:03

    "It’s important to note the difference between accessibility tree focus and literal DOM focus, which are not the same thing.

    Literal DOM focus occurs when focus is set to a focusable element in the DOM, such as an active element like a link or form field. The accessibility tree focus however, is what is reported in the accessibility tree as currently having focus. To put this another way, the literal DOM focus reflects the currently focused element in the DOM, whereas the accessibility tree focus reflects only the accessibility tree object that is reported as presently having focus. In the DOM, only one element is allowed to have focus, which is also true in the accessibility tree, where only one accessibility tree object is allowed to be set as focused."

  9. That is just... messed up weird. It's like David Attenborough describing an animal that is born old and grows young and then eats itself.
  10. Mallory
    @StommePoes
    Jan 27 11:15
    And I'm curious what diffy-oriented Javascript libs like React do with this mismatch--does React updating a state post-diffing have any consequences for what the browser exposes to the a11y tree?
  11. It does look like a solution to the problem of, if you need to move focus to a descendent to expose that it exists to SRs, but don't want to actually move DOM focus so non-AT keyboard users don't have to constantly keep shift-tabbing out of submenus they only wanted to open and see, but remain on the top-level.
  12. I still think, after looking at the example "navigation" menus with all the menu aria roles, that I would only allow that pattern for regular navigation on a website IF and ONLY IF all those keystrokes were posted visually for keyboarders to read. And find some solution for having the top-level links not be links to landing pages anymore.
  13. "App" menus with menu aria roles I'm more okay with, since if you're in an "application" you've got to memorise a crap-ton of funky keystrokes to do pretty much anything, and it makes sense to expect something claiming to be an app work similar to your browser or other real app's menus, where the options Do Stuff.
  14. Mallory
    @StommePoes
    Jan 27 11:21
    Also easier to keep track of the menu state since choosing items wouldn't navigate users to some other page.
  15. powrsurg
    @powrsurg
    Jan 27 14:08
    https://developers.google.com/web/updates/2015/03/push-notifications-on-the-open-web we're looking to copy the interface here where the columns on the left and right scroll down with the page. I was thinking that may not be good for those with vestibular disorders. I feel it needs a hint that it scrolls with you. Any recommendations?
  16. zakim-robot
    @zakim-robot
    Jan 27 15:56
    [quidkid] quick question, for arrow icons next to links that are decorative, I should be putting a null alt tag right? not “arrow icon” because otherwise all will have “arrow icon” and i don’t think it’s accessible according to the wave toolbar test to have things with the same alt tag description
  17. [quidkid] Thank you!!
  18. zakim-robot
    @zakim-robot
    Jan 27 16:06
    [alastc] @quidkid yep, so long as the link text describes the target page, no need for alt text on the arrow, but make it "null" rather than missing, so <img alt="" src="something.jpg">
  19. [alastc] NB: You could look at putting that image into the CSS a a background, but null alt is ok.
  20. zakim-robot
    @zakim-robot
    Jan 27 16:11
    [quidkid] Thank you! another question.. so running the WebAIM toolbar and the Axe from Deque toolbar, it’s triggering contrast errors, however when I looked into it, it says both the foreground and background colors are white when the element in question is going from white foreground/purple bg to purple foreground/white bg. and the purple and white have the appropriate contrast. i also i think the fade transition might have something to do with this. What should i do or should I just ignore it
  21. [alastc] Um, that sounds hideous, but in accessibility terms I would check the least contrasting part of that text with this: https://www.paciellogroup.com/resources/contrastanalyser/ which works on colours shown, rather than checking CSS and not understanding gradients / background images.
  22. [alastc] If it goes purple on white, to white on purple, perhaps it should be failing? (And changed?)
  23. zakim-robot
    @zakim-robot
    Jan 27 16:20
    [quidkid] @alastc thanks so im not entirely sure how to use this tool. it doesn’t tell me anything different than that color combo being accessible at normal size for wcag aa
  24. [alastc] Is the background consistent behind the text? Or does it fade out so some of the text is on a less-contrasty background?
  25. [quidkid] during the fade of course the contrast isn’t there but thats fractions of second before it’s white on dark purple vs original dark purple on white
  26. zakim-robot
    @zakim-robot
    Jan 27 16:33
    [quidkid] question about audio.. so i’m currently working on a podcast site and the toolbar says “Audio elements must have captions track” but we do have a link to the transcript on the page? does the latter suffice for that requirement for WCAG AA?
  27. zakim-robot
    @zakim-robot
    Jan 27 16:41
    [tink] If the podcast is audio only, it does yes.
  28. zakim-robot
    @zakim-robot
    Jan 27 17:30
    [quidkid] cool thank you tink!
  29. [tink] NP :)
  30. zakim-robot
    @zakim-robot
    Jan 27 17:36
    [marcysutton] Happy friday Slackers (coffee emoji)
  31. [alastc] @quidkid Sorry, I thought fade = gradient, but you meant animation. If it's a second, and then the colour-combo has good contrast, ignore the reports from the tools, false-positives.
  32. James Nurthen
    @jnurthen
    Jan 27 17:43
    @quidkid does it keep on changing or does it only do it once?
  33. zakim-robot
    @zakim-robot
    Jan 27 18:03
    [marcysutton] Hard for automated tools to judge things that are animating...which state do we report?
  34. zakim-robot
    @zakim-robot
    Jan 27 18:21
    [quidkid] @alastc yeah i think it was a false positive
  35. [quidkid] @jnurthen only upon click
  36. zakim-robot
    @zakim-robot
    Jan 27 18:40
    [shawn.henning] @tink I find the FB auto captioning infuriating as a lot of images are "Image, contains text" and the text is not read even though I suspect it is available. Also would not be hard to OCR. But perhaps it is just the random images I get on my timeline.
  37. zakim-robot
    @zakim-robot
    Jan 27 22:34
    [dylanb] @quidkid can you make that code available publicly so we can see if we can eliminate the false positive?
  38. [dylanb] we don’t like false positives...
  39. zakim-robot
    @zakim-robot
    Jan 27 22:41
    [quidkid] @dylanb what is the minimum you need from it? It’s actually my coworker’s project but I’m just reviewing it for accessibility
  40. [dylanb] @quidkid could you put the animation onto a jsfiddle or something like that (HTML + CSS)?
  41. [quidkid] @dylanb crap its not looking right in the codepen
  42. zakim-robot
    @zakim-robot
    Jan 27 22:51
    [quidkid] Screen Shot 2017-01-27 at 5.51.02 PM.png
  43. [quidkid] Screen Shot 2017-01-27 at 5.50.52 PM.png