Archive index

A11y Slackers Gitter Channel Archive 15th of February 2017

What fresh hell is THIS now? - Patrick Lauke
  1. zakim-robot
    @zakim-robot
    Feb 15 03:00
    [herin] Has anyone got a recommendation for an Accessible Blog theme?
  2. [herin] Preferably wordpress
  3. [herin] Even others are fine
  4. zakim-robot
    @zakim-robot
    Feb 15 03:09
    [caesar] Considering NVDA ignores most symbols but JAWS doesn't, what's everyone's recommendation for how to code a piece of text like "250+" or "* indicates a mandatory field" without having to resort to converting it into text (due to space constraints)?
  5. [caesar] E.g. "Fields marked with an asterisk (*) are mandatory" would result in asterisk being duplicated in JAWS
  6. [caesar] And for 250+ putting "plus" offscreen will make JAWS read 250 plus plus.
  7. [caesar] Not to mention I wouldn't be able to convince anyone that 250-plus would actually be preferable to "250+"
  8. zakim-robot
    @zakim-robot
    Feb 15 03:43
    [herin] Hi @caesar : I am using the NVDA 2016.3 version and the symbols like * and + are read by it. I believe NVDA fixed this issue in 2014
  9. [herin] Is it any custom settings you have set to?
  10. [caesar] I'm on 2016.2, and should be using default settings...
  11. [caesar] https://education.eviq.org.au/feedback
  12. [caesar] Can you see if this "*Denotes mandatory field" reads the asterisk for you?
  13. [herin] Yes.. works for me
  14. [herin] I am on firefox browser
  15. zakim-robot
    @zakim-robot
    Feb 15 03:50
    [caesar] Oh strange. I'm on Firefox too.
  16. [herin] mmm...
  17. [caesar] My setting for asterisk is "star, level:some, preserve:never"
  18. [caesar] Under symbol pronunciation
  19. [herin] Same for me
  20. [herin] Could that be a version thing?
  21. [herin] 2016.3
  22. [herin] nvaccess/nvda#3799
  23. zakim-robot
    @zakim-robot
    Feb 15 04:00
    [caesar] Will update and see. Thanks for checking for me!
  24. [caesar] OK. 2016.4 and it still isn't reading it. So frustrating, LOL
  25. zakim-robot
    @zakim-robot
    Feb 15 04:14
    [herin] Arrrghhh... Windows or Mac?
  26. [herin] I am on win 7 though
  27. [herin] No problems!
  28. [herin] Gud luck!
  29. zakim-robot
    @zakim-robot
    Feb 15 04:20
    [caesar] Win 10, although I can't imagine that would be the difference.
  30. [melsumner] @caesar I would put text into the aria-label(etc) property that was more descriptive
  31. zakim-robot
    @zakim-robot
    Feb 15 04:26
    [caesar] But it's just plain text, not a link, so it won't take aria-label?
  32. [melsumner] hence the etc, I assumed aria-labelledby/label/describedby depending on the html element
  33. [melsumner] (sorry I wasn’t more explicit)
  34. [melsumner] but if you have the fields that are required marked with required or aria-required then you don’t have to worry about the *
  35. [melsumner] because it will already read that out in the AT
  36. [caesar] Yeah, it's more the instruction than the field itself.
  37. [caesar] I'm surprised the WCAG technique recommends <abbr title="required">
  38. [caesar] https://www.w3.org/TR/WCAG20-TECHS/H90.html
  39. [caesar] Example 2
  40. [melsumner] I use this one https://www.w3.org/TR/wai-aria-practices-1.1/ (or the editor’s draft: http://w3c.github.io/aria-practices/ )
  41. zakim-robot
    @zakim-robot
    Feb 15 04:37
    [caesar] Figured out my NVDA problem at least. The voice settings had Symbols set to "none" although that's weird since I've never modified the default settings...
  42. zakim-robot
    @zakim-robot
    Feb 15 09:54
    [callumacrae] Hello :) I've been googling this for a while but have only managed to find articles complaining about this and not people actually suggesting solutions - how do you make sure a single page web app works well for a user with a screen reader?
  43. zakim-robot
    @zakim-robot
    Feb 15 10:50
    [herin] @callumacrae : Are you using Angular JS?
  44. [herin] I'm not very skilled with the technology itself. But, from some of the speakers from various applications I understand that as long as the Page structure, Titles, navigation mechanism, Focus, if there are any live upating regions proper use of ARIA would help to meet the accessibility
  45. [herin] I came across this article from Simply Accessible long time and had book marked it... http://simplyaccessible.com/article/spangular-accessibility/
  46. zakim-robot
    @zakim-robot
    Feb 15 10:55
    [herin] This is more of a Angular article + Accessibility considerations
  47. [herin] You might have come across this earlier
  48. [callumacrae] @herin: VueJS, but I figure most things will be similar (I've worked with Angular before so I'm fine with technical Angular articles)
  49. [callumacrae] Will check that article out :)
  50. zakim-robot
    @zakim-robot
    Feb 15 14:25
    [marcysutton] @callumacrae here's an article on accessibility of single page apps in general: https://www.smashingmagazine.com/2015/05/client-rendered-accessibility/
  51. zakim-robot
    @zakim-robot
    Feb 15 14:38
    [callumacrae] will check that out too, thanks!
  52. zakim-robot
    @zakim-robot
    Feb 15 15:46
    [crazycatlena] Hi everyone, I may have to work on a project with Bootstrap 2.3 (with Liferay) and we need to be WCAG AA compliant. Do you know some articles or resources where I can find examples of accessibility issues on it?
  53. [crazycatlena] I just found some issues about contrast and using the <i> to use icons
  54. [conley] hey @crazycatlena check out #a11y-devtools
  55. zakim-robot
    @zakim-robot
    Feb 15 15:54
    [crazycatlena] thanks @conley :)
  56. powrsurg
    @powrsurg
    Feb 15 16:07
    We have a skip link to a main element. The main element has a tabindex="-1" because I thought that was an issue with Chrome and IE. For some reason it seems to be getting focus on click. Is this a known bug that I just can't find in Google?
  57. zakim-robot
    @zakim-robot
    Feb 15 16:20
    [marcysutton] That is by design–clicking sets the focus point
  58. [marcysutton] Welcome to what I like to call Button Focus Hell :)
  59. [alastc] Is the problem an outline, or that the focus goes to an element within main?
  60. powrsurg
    @powrsurg
    Feb 15 16:27
    The main element gets focus whenever it's clicked. It has tabindex="-1" so it shouldn't get it that way
  61. We added tabindex="-1" to it because Chrome/IE have an issue with a skip to link just going to an ID (from what I understood).
  62. And apparently being a main element has nothing to do with it ...
  63. zakim-robot
    @zakim-robot
    Feb 15 17:01
    [marcysutton] Nope it's entirely the tabindex. Are you worried about the outline? I just addressed this problem by using the What Input library, it allows you to style focus more deliberately https://github.com/ten1seven/what-input
    ...Until we have :focusring in the standards track
  64. [marcysutton] You can also do this: [tabindex="-1"]:focus { outline: none } but I'd argue the outline is useful for focus management. Hence the library usage
  65. powrsurg
    @powrsurg
    Feb 15 17:06
    http://jsfiddle.net/h39uy/9/
  66. The outline wasn't expected from that. We programmatically set focus a lot of times. It just seemed weird to come up from a skip-link.
  67. Or more over, I thought that an element shouldn't get focus from a click unless it was tabindex="0"
  68. zakim-robot
    @zakim-robot
    Feb 15 17:13
    [marcysutton] But it's sending your focus there, no?
  69. zakim-robot
    @zakim-robot
    Feb 15 17:50
    [ianmcburnie] you could set a ‘temporary' tabindex of -1 on the main element using javascript when the skipto link is activated. then remove the tabindex on blur event of main element. this way, clicking the main element with mouse will not set focus to it.
  70. powrsurg
    @powrsurg
    Feb 15 18:55
    Focus should go there from the skip link. Just clicking on the element shouldn't give it focus when it's tabindex="-1".
  71. zakim-robot
    @zakim-robot
    Feb 15 21:39
    [garcialo] In the future, please address all praise, shame, and complaints about eBay’s MIND Patterns to @ianmcburnie; it’s his fault
  72. zakim-robot
    @zakim-robot
    Feb 15 21:44
    [ianmcburnie] uh oh, time to scarper...
  73. zakim-robot
    @zakim-robot
    Feb 15 22:41
    [herin] Hi, any one has an accessible Rich Text Box API?