Archive index

A11y Slackers Gitter Channel Archive 22nd of March 2017

What fresh hell is THIS now? - Patrick Lauke
  1. zakim-robot
    @zakim-robot
    Mar 22 06:33
    [juliettepiazza] If you have experience doing testing with people with disabilities I would love to hear from you
  2. zakim-robot
    @zakim-robot
    Mar 22 14:56
    [cklatik] Okay... I've got a trip down memory lane for some of you....
    I have an ASP control [old school ASP] that just will not behave with JAWS... Go figure ... And we can't use a native HTML control for this + JS is out as well... The app is running in comparability mode in IE as IEv5... Anyone have 'historic' knowledge on ASP control accessibility? In other word how do I make an ASP app/control that is old enough to vote accessible? '
  3. [tink] I don't, but... what isn't working ATM?
  4. zakim-robot
    @zakim-robot
    Mar 22 15:06
    [cklatik] It's a scrollable list of checkboxes control. JAWS can read that it is a control that is interactive, but when a user arrows into the control JAWS does not read the individual controls, and when a user tabs to a control space to activate a check box is resulting JAWS reading all of the contents of the control
  5. [tink] What sort of thing are you able to change within the code that is output by the control?
  6. [cklatik] I am able to add a notification/tooltip on the label of the control letting the user know that they need to use tab and enter on the control rather than arrow and space...
  7. [tink] Can you add ARIA attributes for example?
  8. [cklatik] Technically we can dynamically add the ARIA attrib to the individual checkboxes, but JAWS ignores the ARIA... I think it has something to do with running in compatibility view.
  9. [tink] Hmm. Yes, that might well get in the way.
  10. [tink] If it's preventing things from getting into the accessibility tree, like the role of the checkboxes).
  11. zakim-robot
    @zakim-robot
    Mar 22 15:11
    [cklatik] Exactly. It's kind of hillariously terrible.
  12. James Nurthen
    @jnurthen
    Mar 22 15:11
    @cklatik what type of control does JAWS think the list of checkboxes is?
  13. zakim-robot
    @zakim-robot
    Mar 22 15:11
    [tink] Do the checkboxes have properly formed and associated labels?
  14. [cklatik] Multi Select combobox application
  15. James Nurthen
    @jnurthen
    Mar 22 15:12
    ok - that is better than expected - at least a combo box allows child elements :)
  16. zakim-robot
    @zakim-robot
    Mar 22 15:13
    [cklatik] @tink As far as I can tell in the app.
  17. James Nurthen
    @jnurthen
    Mar 22 15:13
    i'm assuming as you said no JS you can't pipe a message into a live region on the page to kind of "self voice" movement in the control
  18. zakim-robot
    @zakim-robot
    Mar 22 15:14
    [cklatik] Correct.
  19. [tink] Is there an example of this you can post here?
  20. James Nurthen
    @jnurthen
    Mar 22 15:14
    i don't think i can be any help to going to be quiet :)
  21. zakim-robot
    @zakim-robot
    Mar 22 15:15
    [tink] @JNurthen not sure I can offer much of use here either :(
  22. [cklatik] We tried writing a microservice to pipe the control contents to an html5 custom control/widget... no go... tried a jquery widget... no go... in fact when we try to implement the widgets they flat out don't load in the compatibility view... then when we try to up the ie version the rest of the app breaks
  23. [tink] Ugh. Seems like you've tried all the logical things.
  24. [cklatik] Sadly no example I could share... it's Internal to the company, and my google-fu has hit a wall... hence why I'm pestering you lot. :)
  25. James Nurthen
    @jnurthen
    Mar 22 15:16
    put the time/money you would spend investigating into the rewrite onto a suppored technology stack ;)
  26. zakim-robot
    @zakim-robot
    Mar 22 15:16
    [cklatik] Heh. THat's where I'm at.
  27. zakim-robot
    @zakim-robot
    Mar 22 15:55
    [marcysutton] Wow, that takes me down memory lane. Compatibility mode really messes things up. Any idea what's triggering that part of it?
  28. [marcysutton] By compatibility mode do you mean Quirks Mode? (ohcrap emoji)
  29. [kevmarmo] often it's white space at the top of documents that triggers Quirks Mode
  30. zakim-robot
    @zakim-robot
    Mar 22 16:19
    [cklatik] @marcysutton It's not something I can quite verify... but my guess is that it's an active-x database connection.
  31. [tink] @cklatik I mentiond this to @aardrian who wondered whether this was a third party control - so you don't have control over the output so much?
  32. zakim-robot
    @zakim-robot
    Mar 22 16:28
    [karlgroves] sees mention of classic ASP. Backs away slowly...
  33. zakim-robot
    @zakim-robot
    Mar 22 16:37
    [cklatik] https://media.giphy.com/media/3KQ4VNwCrOThC/giphy.gif
  34. [cklatik] @tink I can't get a straight answer from the team on that... My first suggestion was to rewrite the control and I got a big load of silence
  35. [karlgroves] What you have happen a lot with old ASP stuff is that business logic and presentation logic are intrinsically tied to each other. Often a horrible mess. I’m surprised that throwing some JS at it after the fact isn’t working
  36. zakim-robot
    @zakim-robot
    Mar 22 16:44
    [tink] Rewriting the control is possible if it isn't a third party thing, but like @karlgroves says it isn't pretty.
  37. zakim-robot
    @zakim-robot
    Mar 22 16:53
    [ted_drake] OMG! I recently found some old ASP and started to cry silently onto my desk. Let’s wrap the entire page in a form...
  38. [tink] I'd forgotten it used to do that.
  39. [tink] heads for the medicinal tequila.
  40. [marcysutton] awwwww I am chuckling over here but it's not funny if you're on the hook to fix it.
  41. [tink] No, you're right @MarcySutton.
  42. [marcysutton] it is still kinda funny though. And makes me glad we've come so far. I agree with Karl that I wonder if throwing some JS at it is worth another try? Any errors thrown, or things just get weird and unexpected with compatibility mode?
  43. zakim-robot
    @zakim-robot
    Mar 22 16:58
    [marcysutton] I swear so much of web development is debugging errors by tossing in log statements
  44. Adrian Roselli
    @aardrian
    Mar 22 17:20
    Classic ASP never encoded a whole page in a form, that was .NET. Poor developers did that. Coming in late, but did you have a block of code somewhere that I could scan?
  45. zakim-robot
    @zakim-robot
    Mar 22 18:11
    [sri429] Q: Have a bunch of <li>'s. And hover on them will bring up a card. For keyboard onfocus we bring up the same card. Now the Problem is if the user tries to quickly shuffle with arrow keys between these <li>'s, opening and closing these cards at the same pace is causing issues. Also going forward the data in the card might come from an ajax call. what would be the recommendation here?
  46. [scottohara] so the cards open on focus of an li, and close when the li is blurred?
  47. [sri429] As of now the plan is open the card only if the focus remains on the node for say 1 second.
  48. [sri429] yeaah
  49. [scottohara] so, then a user could never tab into a card, because when they tried, it would disapear?
  50. [conley] I would avoid spaning any kind of of content onHover/onFocus
  51. [sri429] the tab brings to the 1st li. another tab takes me into the card. escape key closes the card. tab again takes me to next control after ul
  52. [conley] is there an implicit close button?
  53. [conley] per card
  54. [sri429] yeah
  55. zakim-robot
    @zakim-robot
    Mar 22 18:17
    [conley] I would recommend that the card be spawned onclick and trap focus within the card
  56. [conley] some operability patterns in play
  57. [sri429] @conley yeah thats what is happening. but the problem is when someone has to go to the last li node
  58. [sri429] and he continuously presses right arrow key
  59. [conley] he has to read every card before getting to that last <li>
  60. [conley] since they're on hover/focus
  61. [conley] thus, on click would be a better implementation imo
  62. [conley] give the user the option to read more
  63. [conley] hover might suffice if they're using a mouse
  64. [sri429] so you mean press enter?
  65. zakim-robot
    @zakim-robot
    Mar 22 18:22
    [sri429] for opening the card?
  66. [conley] yes
  67. [sri429] hmm there's a catch here. on click of that actually takes me to that page. and hover shows the card.
  68. [conley] then you're dealing with an incorrect operability pattern at this point
  69. [sri429] and i dont want to give a random shortcut.
  70. [sri429] @conley yeah true. any better pattern?
  71. [conley] if the card content is minimal, including it in title attribute or aria-label and only have the card appear onHover and hide from screen reader
  72. [scottohara] you could have the card appear on hover, and have a separate button element to open the card for keyboard users?
  73. [sri429] hmm no it has 4/5 clickable elements
  74. zakim-robot
    @zakim-robot
    Mar 22 18:27
    [conley] then I would revisit the entire module tbh
  75. [conley] sounds like there's too much swiss army "knifing" going on
  76. [sri429] @scottohara that sounds a better option. only down fall is it takes double the time to reach the last node for keyboard user
  77. [scottohara] i’d submit that the li’s shouldn’t be focusable in the first place. and that by using the button, you can let that be the focusable element
  78. [scottohara] so, still the same amount of tab stops
  79. [conley] I'm with @scottohara on this one
  80. [conley] <link> and `<button>click to expand more information about link</button>
  81. zakim-robot
    @zakim-robot
    Mar 22 18:33
    [sri429] the current mark up is <li><a href="link"></li>
  82. [scottohara] ok. misunderstood. when yo you said there was hover/focus on the li’s, i understood that to be on the actual li's
  83. [conley] just doing short hand ;) don't take my markup for gospel
  84. [sri429] and on focus of $("li a") we show the card. so i think the best option is have a button when anchor get focus.
  85. [sri429] saw facebook contact card . but dammm they dont show the card on keyboard focus :(
  86. [scottohara] then you will need to have two tab stops. one for <a>, one for the button, that opens more details/controls pertaining to the content of <a>
  87. [scottohara] but, even with the increased tab stops, that’s still a better experience than before
  88. [sri429] yeah. but this is better than having a time delay
  89. [scottohara] and keyboard users that are also using screen readers may be navigating by links anyway, so they could bypass the double tabs
  90. [sri429] thanks @conley and @scottohara for your time
  91. zakim-robot
    @zakim-robot
    Mar 22 18:38
    [conley] np :)
  92. [sri429] yeah. i was worried about screen reader users if its a delay based approach by the time screen reader reads it we might not show the card and it would have been lost.
  93. [conley] yeah and then you're getting into aria-live rabbit hole
  94. [sri429] yeah correct
  95. zakim-robot
    @zakim-robot
    Mar 22 19:27
    [iamjohnellison] *:dollar: Paid contract:* Hello all! My name is John Ellison. I am a freelance product designer looking for an accessibility consultant to help me and my client achieve an accessibility certification for the redesign of their application. If you are available and interested, please send me a DM.
  96. zakim-robot
    @zakim-robot
    Mar 22 19:50
    [car] @sri429 This may seem off the wall, and I know you said "i dont want to give a random shortcut"... but years ago in Eclipse we decided to use the F2 key to open "more info" in our code editor. Stuff like comments, annotations (bookmark/breakpoint/error/warning), etc. In short, any popup info that a mouse user could get on hover at a specific location was also accessible via keyboard F2 at the caret location. These "tooltips" could also contain interactive controls, such as a "Quick Fix" button for a syntax error, etc.
    https://shortcutworld.com/en/Eclipse/win/all (and find F2 on this page).
    Anyhow, F2 is often used for "Rename", so if your li's can be renamed, then this would not be helpful.
    F2 has also been used for "more stuff to do/see for the focused thing" (MS Excel - edit current cell), so this is perhaps not completely crazy... ;)
  97. zakim-robot
    @zakim-robot
    Mar 22 20:00
    [car] @iamjohnellison Fyi, there's a #jobs channel here, in case it's useful. Also, this conversation about the phrase "accessibility certification" might be interesting to you:
    https://web-a11y.slack.com/archives/C042TSFGN/p1476227516003155
  98. zakim-robot
    @zakim-robot
    Mar 22 22:35
    [cyns] Anyone know of a good free/cheap tool for adding closed captions to a movie on a mac? (my switch from windows is still painful...)
  99. zakim-robot
    @zakim-robot
    Mar 22 23:41
    [caesar] I think Avidemux is free and can do that
  100. [caesar] http://avidemux.sourceforge.net/download.html