Archive index

A11y Slackers Gitter Channel Archive 23rd of August 2017

What fresh hell is THIS now? - Patrick Lauke
  1. zakim-robot
    @zakim-robot
    Aug 23 08:48

    [dean] Hey folks! Question for you - we’re redesigning a timeline about innovations, and these innovations use names such as Poly Predix, Expressive Power, Voca Priority… they mean nothing. From the timeline you can select one of the innovations, which goes to a specific page about the innovation.

    My question relates to the link text. Would something like…

    <article>
    <H2>Expressive Power<H2>
    <p>This is a bit of blurb about Expressive Power</p>
    <a href=“URL”>Expressive Power</a>
    </article>

    …suffice?

    I like to be more meaningful with links, but it’s quite difficult for unavoidable words like these. Thoughts?

  2. LauraOU
    @LauraOU
    Aug 23 12:04
    @seankeegan I think a lot of them just don't know what things like keyboard accessible and visible focus mean. I think they think keyboard=form entry.
  3. LauraOU
    @LauraOU
    Aug 23 12:15
    the 2.0 vpat beta I think is overly complex, since they list all the cross-references between standards in the first column.
  4. zakim-robot
    @zakim-robot
    Aug 23 15:44
    [pweil] It's nice to see that Slick has finally been updated. We couldn't wait any longer for a fix, and finally did our own version last year to get around the describedBy issue (as well as others).
  5. stacycarston
    @stacycarston
    Aug 23 16:04
    @dean If I'm understanding your example correctly, that seems plenty meaningful to me. If I already know I want to learn more about "Expressive Power", that link text gives me all the info I need to know I want to click it. If I don't, I can easily explore the rest of the page and click on whichever one interests me. Either way, the link text "Expressive Power" tells me that the topic will be "Expressive Power," even if I don't know what that is. Usually it's things like "click here" and "read more" that are considered lacking in meaning.
  6. zakim-robot
    @zakim-robot
    Aug 23 16:06
    [zzzzbov] could wrap the entire <article> with the link instead for a larger click target, but that assumes that the paragraphs never have interactive content, but otherwise I agree with @stacycarston
  7. zakim-robot
    @zakim-robot
    Aug 23 16:18
    [cameron] Friends! Check this out, Rails merged a PR I made to remove default filename alt text generation
  8. [cameron] rails/rails#30213
  9. [kivi] Oh, I hate when people do that! You click your mouse on what appears to be innocuous text, and all of a sudden you find yourself on a new page. Links should be clearly identified.
  10. zakim-robot
    @zakim-robot
    Aug 23 16:42
    [calebtang] Deliveroo would like to host some events at their new venue https://twitter.com/tommypalm/status/899926481815707649
  11. zakim-robot
    @zakim-robot
    Aug 23 16:53
    [scottohara] per links wrapping large bodies of text, you also dont' want to tip the scale and go from not enough announced link context, to too much information being announce
  12. [craig] @scottohara that is a great point I didn’t consider. If you wrap all of that info in an <a> it will read all of it?
  13. [scottohara] yup
  14. [rselzer] if you throw an aria-label on that wrapping link will it override what the screen reader reads?
  15. [scottohara] yes. but then you've made it difficult for a AT user to get to any of the information within that wrapper
  16. [craig] We are still kind of struggling with how to handle that design pattern, which is really ingrained in our client base.
  17. [scottohara] so 
    <a href="#!" aria-label="read me instead">   <h3>my title</h3>   <p>lead-in information about this topic</p> </a>
  18. [scottohara] you'll get "read me instead"

  19. [craig] ----

    Headline

    Shortened post description…

    Read More

  20. [scottohara] and that lead-in information may become inaccessible to the AT user
  21. [craig] but they want the entire block to be a link
  22. [craig] and the “read more” link obviously isn’t great
  23. zakim-robot
    @zakim-robot
    Aug 23 16:58
    [scottohara] yeh...i personally don't much like that from a UX standpoint
  24. [scottohara] i will click/highlight text i'm reading
  25. [scottohara] as i'm scanning a page
  26. [scottohara] i've had to train myself not to do that for things like card patterns, because people often implement what you just outlined
  27. [scottohara] and i want to read, not go somewhere
  28. [scottohara] which, on one hand "well just don't click and read"
    but "well don't make basic paragraphs into links"
  29. [craig] > yeh...i personally don’t much like that from a UX standpoint
    me either
  30. zakim-robot
    @zakim-robot
    Aug 23 17:43

    [zzzzbov] > which, on one hand "well just don't click and read"

    but "well don't make basic paragraphs into links"

    if there's so much content that you're clicking to read, the pattern is being used wrong. Ideally it's something like 

    [image] [title] [first few words...]

    and then links you to the page where you can actually read the content.

  31. [scottohara] agree and disagree there.
  32. [scottohara] it's a bit presumptuous to tell someone "don't read / interact with a site the way you are accustomed because we decided to make non-interactive text clickable"
  33. [zzzzbov] i didn't say anything about it being non-interactive text
  34. zakim-robot
    @zakim-robot
    Aug 23 17:48
    [scottohara] having an entire paragraph being a clickable element, when the text doesn't 'look' clickable would be a perfect examle of this pattern
  35. [zzzzbov] who said anything about the paragraph not looking clickable?
  36. [zzzzbov] that's a css implementation detail
  37. [zzzzbov] that all said, i'm not going to keep pushing a point that probably doesn't apply to this situation that i rarely use myself
  38. [sarahebourne] I was involved with a group of state/local government and higher ed folks last year, pulled together by Jim Tobias. We came up with recommendations, based on how we used VPATs and the problems we encountered. Nov. 2016, Jim sent a cover letter and the recommendations to Ken Salaets at ITIC, who promised to get back to us. I haven't heard from Jim since, so I'm assuming Ken never got back to us. The links he gave us are broken., but I'll attach the documents here (if I can figure out how…)
  39. zakim-robot
    @zakim-robot
    Aug 23 17:53
    [sarahebourne] vpat20_cvrltr.pdf
  40. [sarahebourne] VPAT_20_pubsec.pdf
  41. zakim-robot
    @zakim-robot
    Aug 23 18:00
    [sarahebourne] (BTW, it doesn't look like they included any of our recommendations. I'm shocked, shocked!)
  42. Anastasia Lanz
    @anastasialanz_twitter
    Aug 23 19:39
    Is there any way to make this outline show only when using "tab" and not on each mouse click?
  43. zakim-robot
    @zakim-robot
    Aug 23 19:41
    [alexlande] https://github.com/ten1seven/what-input
  44. [alexlande] Some day (hopefully) there will be a CSS pseudo-selector for that purpose so it won’t require JS: https://drafts.csswg.org/selectors-4/#the-focusring-pseudo
  45. [marcysutton] That question gets asked in here almost once a week!
  46. Anastasia Lanz
    @anastasialanz_twitter
    Aug 23 19:45
    Really?!
  47. zakim-robot
    @zakim-robot
    Aug 23 19:47
    [rselzer] did your client say to you "it looks good, but can we get rid of the blue thing around the links?"
  48. Anastasia Lanz
    @anastasialanz_twitter
    Aug 23 19:47
    It's on a group of custom radio buttons
  49. with tabIndex="0"
  50. zakim-robot
    @zakim-robot
    Aug 23 19:57
    [karlgroves] Anyone know of a good, accessible Help Desk software? Have customer looking and I’m drawing a blank.
  51. zakim-robot
    @zakim-robot
    Aug 23 20:02
    [zzzzbov] every time i hear about people needing to get rid of focus outlines it seems like it's a design oversight. IMO: get rid of the outline style and make it look good enough that no one cares that the focus style is applied when the mouse is used.
  52. [cmegown] i can mostly agree with that @zzzzbov in my experience things work out better when you work with the designer to think of focus as a state they need to account for
  53. [cmegown] most seem to only think about hover, and sometimes active
  54. Anastasia Lanz
    @anastasialanz_twitter
    Aug 23 20:05
    Even when a focus occurs on click but it was meant for tab?
  55. zakim-robot
    @zakim-robot
    Aug 23 20:06
    [cmegown] this is on an element that has tabindex='0' correct?
  56. [cmegown] the scenario you're talking about is exactly what :focus-ring intended to solve i believe
  57. Anastasia Lanz
    @anastasialanz_twitter
    Aug 23 20:06
    Yes a div with a bunch of custom radio buttons.
  58. zakim-robot
    @zakim-robot
    Aug 23 20:07
    [cmegown] here's a polyfill for :focus-ring you may want to consider: https://github.com/WICG/focus-ring
  59. Anastasia Lanz
    @anastasialanz_twitter
    Aug 23 20:11
    Thank you!