Archive index

A11y Slackers Gitter Channel Archive 12th of January 2017

What fresh hell is THIS now? - Patrick Lauke
  1. zakim-robot
    @zakim-robot
    Jan 12 00:42
    [shawn.henning] @karlgroves: Have you given any of this feedback to Amazon? I was struck by the number of Amazon speakers at the m-enabling conference given my poor experiences with Amazon software and websites.
  2. [karlgroves] @shawn.henning I just got my Alexa set up last weekend and used the app only once or twice.
  3. zakim-robot
    @zakim-robot
    Jan 12 03:20
    [caesar] How would you code a "link row" element consisting of an icon, a text label and a right-pointing chevron so that VoiceOver doesn't try and read each of the elements separately when you read the page using VO+right arrow?
  4. [caesar] Tabbing (both in Windows and OSX) is OK because the tab stops are set up for the grouped elements
  5. powrsurg
    @powrsurg
    Jan 12 14:18
    I have a block of text with a background color and a text color that has sufficient contrast. In line I have a <code> tag that has its own background to highlight it. The text color to this background color has sufficient contrast, but the <code>'s background to the outer background does not. Is that okay, or should I find another color?
  6. zakim-robot
    @zakim-robot
    Jan 12 14:38
    [sylvia] @powrsurg That sounds okay to me. You only check text against its own background
  7. [sylvia] So if you have white text in a black box, that's fine, even if the box is on a lighter background
  8. [tink] +1 But I'd make sure the padding is sufficient to give the background a clear margin from the text.
  9. [tink] So the text sits clearly on the block of background colour.
  10. [sylvia] In unrelated news, a vendor just tried to tell me they didn't need to do accessibility because they "had a Section 508 waiver"
  11. [tink] Does such a thing even exist?
  12. [sylvia] I mean, yes. You can get a specific waiver from a specific agency for a specific purpose
  13. [tink] I didn't know that.
  14. [sylvia] Like a journal I used to work with got a waiver for temporarily (less than a week) posted draft articles in PDF before the final, accessible version was posted
  15. [tink] But you wouldn't get a permenant waver?
  16. [sylvia] In this case, though, they were just waving themselves, blanket, because accessibility is hard
  17. [sylvia] The journal did have a permanent waiver for that specific activity
  18. [sylvia] So on the first of the month every month, they could post the temporary articles, as long as they posted the accessible, HTML version within a week. Which they did.
  19. [sylvia] The exciting part is that Section 508 doesn't even apply to this vendor!
  20. zakim-robot
    @zakim-robot
    Jan 12 14:43
    [tink] (facepalm)
  21. [sylvia] I nearly rolled my eyes right out of my head
  22. powrsurg
    @powrsurg
    Jan 12 15:16
    Thanks for the replies. Appreciated
  23. zakim-robot
    @zakim-robot
    Jan 12 15:54
    [beth] @sylvia Thanks for the laugh!
  24. zakim-robot
    @zakim-robot
    Jan 12 16:12
    [karlgroves] I offer free downloadable 508 waivers right here: http://www.karlgroves.com/2011/07/28/get-a-free-section-508-waiver-here/
  25. [deconspray] Question: aria-hidden="true" on a legend. Would that be read by SC? (it is in NVDA 2016.3)
  26. zakim-robot
    @zakim-robot
    Jan 12 16:22
    [karlgroves] It shouldn’t be. That’s the purpose of aria-hidden=”true”
  27. [tink] +1 Karl it won't be in the accessibility tree, so ATs should not be aware of it.
  28. zakim-robot
    @zakim-robot
    Jan 12 16:34
    [sylvia] Thanks @karlgroves. Totally sending that to my team
  29. [deconspray] Just performing a sanity check. :)
    BTW, it is.... Hoping human (coding) error is introducing something here. Thanks all.
  30. zakim-robot
    @zakim-robot
    Jan 12 17:39
    [melsumner] Question: do you have a baseline monitor resolution that you then support up to 200% zoom on? How does everyone approach this?
  31. [melsumner] It came up after I noted an issue where someone else's "page zoom 200%" screenshot looked a lot different than mine.
  32. zakim-robot
    @zakim-robot
    Jan 12 18:16
    [karlgroves] Strictly in terms of WCAG compliance, it doesn’t matter
  33. zakim-robot
    @zakim-robot
    Jan 12 18:49
    [beth] @karlgroves Do you happen to have any WCAG 2.0 waivers? I’ve had some clients argue they should be able to get a “WCAG exemption” because their products are so “awesome” they shouldn’t have to “ruin” them by making them accessible. >:-(
  34. [karlgroves] LOL I’d like to make one. I’ll make that waiver look like a kid made it with construction paper and crayon, so they get the point that the only thing keeping them from making their product accessible is their own lack of creativity. (trollface emoji)
  35. zakim-robot
    @zakim-robot
    Jan 12 19:08
    [melsumner] It makes me sad when I hear things like that, but I remember sort of thinking the same way back when, before I really learned A11y properly.
  36. zakim-robot
    @zakim-robot
    Jan 12 19:41
    [deconspray] Update on aria-hidden="true" on a legend: apeears to be an issue with older version of Firefox (v45) and NVDA (2016.3). Testing updated version later.
  37. zakim-robot
    @zakim-robot
    Jan 12 19:49
    [beth] Yes @melsumner The saddest part was that the guy I’m referring to wanted to start a charity, which is a respectable dream to have. Only thing was, he didn’t want to give the charity a name… only a symbol (like the-artist-formerly-known-as-Prince). He wanted the symbol to be so well-known that people would instantly recognize it. Online shopping companies and the government would have this symbol on their sites for donating, but he didn’t want to put alt text on the symbol because that would force him to actually name it. The level of anger I saw in this man when I told him he’d never get a government contract without his idea being accessible scared me so much I had to end the meeting!
  38. [melsumner] That may perhaps have been too much ego for a charity then ;)
  39. zakim-robot
    @zakim-robot
    Jan 12 19:54
    [karlgroves] Prince first needed to make a name for himself.
  40. [melsumner] That's a good point.
  41. [beth] LOL, right!?!
  42. [karlgroves] Reminds me a bit of a guy I knew named “Rick”. Changed his name to “Ric” because “Rick” was far too common of a name. #tryingTooHard
  43. zakim-robot
    @zakim-robot
    Jan 12 20:00
    [beth] @karlgroves Did he spell it for people when he met them, so they’d know that he wasn’t your run-of-the-mill “Rick"?
  44. [karlgroves] YES
  45. [melsumner] "Ric no K"
  46. [karlgroves] “Ric, that’s R. I. C. “Rick”, no “K”, by the way"
  47. zakim-robot
    @zakim-robot
    Jan 12 20:09
    [beth] @karlgroves Did you at least turn your head, so he couldn’t see you rolling your eyes at him?
  48. [melsumner] I'm chuckling a little about this but I do get a little peeved when people try to spell my son's name Dillon instead of Dylan (ohcrap emoji)
  49. [karlgroves] Beth: Oh, everyone knows I’m too much of a nice guy to do anything like that.
  50. [karlgroves] ;)
  51. [tink] Zakim: I empathise. I have to listen to my screen reader pronounce my name badly every time someone calls me Leonie instead of Léonie.
  52. [beth] BTW, I’m “Beth”, with only one H.
  53. [beth] Like Leon-y?
  54. [tink] Oops. Didn't mean to mention the W3C bot in that last msg.
  55. [tink] @beth yes, it should be lay-oh-nee, but without the accent it's Lee-oh-nee
  56. [tink] Little things I suppose...
  57. [melsumner] Idk I just straight up get the wrong name a lot. Melanie ends up being Melissa or Michelle.
  58. [beth] Lay-oh-nee, Are you going to CSUN this year?
  59. [tink] Yup, me too... usually Melanie or Naomi (especially when I'm on the phone).
  60. [beth] Mine’s so short, the nicknames are usually longer than my actual name.
  61. [tink] grins. @Beth, yes I am.
  62. [beth] I wanted to meet you last year, but didn’t get the chance.
  63. zakim-robot
    @zakim-robot
    Jan 12 20:14
    [beth] I will try to stalk you better this year. ;)
  64. [tink] Definitely :)
  65. [deconspray] Don't feel bad, the Barista at Starbucks calls me Denise all the time.
  66. [deconspray] Renaming my Starbucks name to Bertha
  67. [melsumner] You should curtsy and smile (joy/allthethings emoji)
  68. zakim-robot
    @zakim-robot
    Jan 12 20:24
    [beth] @melsumner I will go with him next time and video the interaction. Would love to see you do this Dennis! ;P
  69. zakim-robot
    @zakim-robot
    Jan 12 20:55
    [melsumner] @karlgroves: going back to the original question I asked - can you clarify a little? Do you mean anyone at any resolution should be able to zoom and have no issues? Was it left ambiguous enough that apps can self-identify their own baseline?
  70. [marcysutton] just loves it when recruiters call me Mary
  71. zakim-robot
    @zakim-robot
    Jan 12 21:01
    [melsumner] Do you give them gardening tips? (thinking face emoji)
  72. [melsumner] I'd do it just to see if they got the reference
  73. [melsumner] (Ok I wouldn't really, I'd just delete the email, but somehow I'm amused to imagine it)
  74. [marcysutton] They were emails to two separate addresses, both having my name in the address. I wrote back to tell them they might have more success if they addressed candidates correctly.
  75. zakim-robot
    @zakim-robot
    Jan 12 21:06
    [melsumner] Yeah that seems really logical.
  76. [marcysutton] So I completely understand the frustration >:-(
  77. zakim-robot
    @zakim-robot
    Jan 12 21:19
    [bkardell] ok... so...

  78. [bkardell] 'The tabindex attribute can also make any element into interactive content.'
    except tabstoppable doesn't really mean it's interactive, no? like, if you did

    <div style="make this a big green rectange" tabindex="0"></div>

    even if it is clickable, is that really interactive?

  79. [bkardell] like... why are you there? I'm dealing with some visualizations right now and looking hard for a way to make this accessible but it is basically that - colored elements that you can tab, touch and hover on with tooltips. Even if I make those aria-describedby... is that really clear? like, won't somoene really want to know "what is all this""? or am I over thinking it?
  80. [bkardell] I see this a lot, an element whose whole purpose is just to pop up information without activation behavior... is it just me or do others see it too... what do you do about it?
  81. zakim-robot
    @zakim-robot
    Jan 12 21:29
    [herin] Hi... I find Mandatory indicator inserted using CSS is a recent trend. But, this would fail as per F3: Failure of Success Criterion 1.1.1 due to using CSS to include images that convey important information. Reason being CSS information are lost in High contrast mode and test only browsers etc.
    How would you address the severity of this issue? Is there any semi-automated tool that picks this up and provide error / warning?
  82. zakim-robot
    @zakim-robot
    Jan 12 22:04
    [melsumner] @bkardell: you could add a role to that div though.
  83. [melsumner] @herin do you mean like for required fields? You could use aria-required.
  84. [herin] Hi @melsumner : Aria-required is only for the screen reader users. But, not for visual users.
  85. [herin] So when the required field * is inserted using CSS, this is considered as an important information
  86. [melsumner] I wouldn't use an image though, I'd use the CSS content property and put an asterisk in it
  87. [melsumner] And I don't interpret that requirement in the same way that you are, I think
  88. [caesar] @herin the screen reader is covered using aria-required, and sighted users have the CSS visual... if both of these are present I'm not sure why this would be non-conformance?
  89. [herin] .mandatory {
    background: rgba(0, 0, 0, 0) url("../icons/star.gif") no-repeat scroll right 7px;
    }
  90. [herin] In this case it's an image inserted.
  91. [melsumner] It's okay to use an image for visual users and the aria property for the alternative. It's cool you're covered thumbsup emoji
  92. [melsumner] It's just not okay to ONLY use an image for everyone
  93. [herin] When you change the theme of the windows for colour contrast, all the CSS images are lost. Hence this information is lost as well
  94. zakim-robot
    @zakim-robot
    Jan 12 22:10
    [melsumner] I suppose I'd suggest putting a fallback in there, but more standard than that, use an * and not a .gif
  95. [melsumner] Unless you have a big enough perf budget and aren't otherwise using it
  96. [melsumner] It depends (TM)
  97. [herin] That makes sense... I will try with Content property and see the impacts.
  98. [herin] Thanks @melsumner and @caesar
  99. [melsumner] thumbsup emoji
  100. [caesar] LOL thanks back to you. I learned something about high-contrast mode today :)
  101. zakim-robot
    @zakim-robot
    Jan 12 22:19
    [herin] @melsumner : F87: Failure of Success Criterion 1.3.1 due to inserting non-decorative content by using :before and :after pseudo-elements and the 'content' property in CSS
  102. [herin] F3: Failure of Success Criterion 1.1.1 due to using CSS to include images that convey important information
  103. [herin] These both are WCAGs failures.
  104. [melsumner] I guess I see the asterisk as a decorative element since I use required in the HTML and have aria-required="true" just in case.
  105. [melsumner] But maybe some other people can weigh in too, since I'm not the all-powerful Oz or anything thumbsup emoji
  106. [herin] The problem is with the High Contrast mode... Glad I tried the content now. I had a long discussion with the dev about this yesterday and couldn;t stop reading on it.
  107. [herin] I was unsure about this if its a conformance failure
  108. [herin] it's good we could discuss these in slack
  109. zakim-robot
    @zakim-robot
    Jan 12 22:26
    [melsumner] Yes, it's very helpful for everyday development, I've been so grateful for the guidance I've received here.
  110. zakim-robot
    @zakim-robot
    Jan 12 23:19
    [bkardell] @melsumner what role is what i mean.. what interactive element isn't interactive?
  111. [caesar] Tab stop is just the ability to receive focus
  112. [caesar] Focus and interactivities are separate properties
  113. zakim-robot
    @zakim-robot
    Jan 12 23:36
    [marcysutton] If I remember correctly @bkardell is this the hover equivalent thing where there is no action other than showing a thing on focus?
  114. [marcysutton] I recommended using a button role, but if there is no action when the user presses enter they might be confused by it.....
  115. [caesar] I don't quite follow what the UX scenario is, but I would've thought that's what tabindex="-1" is for. I don't understand why the user would need to tab to it but not be able to interact with it.
  116. [marcysutton] The example was a tooltip-like thing, where it shows more information on hover/focus. I hate tooltips :\
  117. [marcysutton] Almost always they are usability/design smell if something isn't clear enough on its own. Don't Make Me Think.
  118. zakim-robot
    @zakim-robot
    Jan 12 23:42
    [cordelia] +1, tooltips are a challenge
  119. [cordelia] Especially tooltips on disabled buttons!