Archive index

A11y Slackers Gitter Channel Archive 20th of August 2015

What fresh hell is THIS now? - Patrick Lauke
  1. StommePoes
    08:01
    ug, marketer added some bootstrap/jquery tooltip thingie and it only works with the mouse and because it removes the real title attribute i can't quickly enough find a hack to allow this to show on focus
  2. StommePoes
    08:02
    steaming piles of code get shovelled in faster than I can clean up afterwords, only to find that some things I did get cleaned are replaced by some other, similar plugin and broken again.
  3. StommePoes
    08:02
    Man, the person who replaces me at my job is going to think I was a lazy nogoodnik
  4. LjWatson
    08:03
    @StommePoes I shouldn't laugh, but "nogoodnik" is a wonderful phrase :)
  5. LjWatson
    08:03
    This is the first time I've heard it.
  6. rodneyrehm
    08:34
    I have a rather complex table and am wondering if I’m doing it right - http://rodneyrehm.de/t/focusable.html - any comments on my questions at the top are greatly appreciated :)
  7. StommePoes
    08:43
    nogoodnik, I think was at least a regular on Rocky and Bullwinkle Show
  8. StommePoes
    08:43
    hm, pidgin is showing my posts since I logged on, but not showing Leonie's (instead i see them on the web page)
  9. yatil
    09:14
    @rodneyrehm: headers/ids look good, I’m not sure about display:none on the thead…
  10. rodneyrehm
    09:15
    well, I don’t want them visible on screen. I assumed (not tested) that invisible headers would be read out properly because of the header attribute
  11. StommePoes
    09:19
    I moved whole theads offscreen using the usual method. Wouldn't surprise me if that messed with VO, but for the desktoppers I don't see why that would be an issue, esp since we're not changing the display state (they are still display table header etc)
  12. StommePoes
    09:19
    so you could try that, just positioning them away
  13. rodneyrehm
    09:19
    my brain autocorrects theads to threads and that totally fucks me up
  14. rodneyrehm
    09:20
    how would I best position them away?
  15. LjWatson
    09:25
    @rodneyrehm the table seems to do what it's supposed to with Jaws/FF.
  16. LjWatson
    09:26
    @Yatil where is display:none; being set on the thead? Can't find it, but I'm probably looking in the wrong place.
  17. yatil
    09:28
    @LjWatson The header is display:none on every table but the first one.
  18. yatil
    09:28
    @rodneyrehm I had a look with accessibility inspector on mac os and the display:none headings are not in the accessibility API there.
  19. yatil
    09:30
    @rodneyrehm I usually use this approach for hiding content from view: http://w3c.github.io/wai-tutorials/forms/labels/#note-on-hiding-elements
  20. LjWatson
    09:30
    @Yatil @rodneyrehm right - it's the same in IA2. display:none; effectively hides content from the API in a similar way to aria-hidden.
  21. StommePoes
    09:31
    foo, is IRC broken? I can post, but nobody's replies appear in pidgin. I can see everything on the website.
  22. LjWatson
    09:32
    @rodneyherm if you want to use the headers for the first table for all the tables, this technique might work http://juicystudio.com/article/accessible_data_tables_static_headers.php
  23. StommePoes
    09:32
    I do similar to @yatil's, except I don't go all that far (I'm never compensating for rtl langs for example). I just position absolute, left a bazillion em, height 0 as one browser added a wee bit of space. Top to auto if IE had issues. But I've avoided the whole clip() thing as I keep hearing they've now deprecated it (without replacement that works in current browsers of course), arg.
  24. StommePoes
    09:33
    whoa
  25. StommePoes
    09:33
    I've never seen something like Gez' example there
  26. rodneyrehm
    09:35
    I did not realize I could referemce a different table’s headers, @LjWatson - is that a good idea?
  27. LjWatson
    09:35
    @StommePoes IRC into the Gitter channel is working ok here I think. Messages from people in the Slack channel appear a little strangely to me though - because of the way messages are piped to/from/between the two channels.
  28. StommePoes
    09:35
    I'm getting zero, neither slackers nor gitter-ers...
  29. rodneyrehm
    09:35
    If I keep references contained to the same tables, I can move them around (and copy them to other documents) more freely
  30. LjWatson
    09:36
    @rodneyrehm the old-school bit of me thinks it's probably best to keep the headers within each table. But at the moment setting them to display:none; is removing them anyway, so a comprimise would be to use the technique in Gez's article I think.
  31. rodneyrehm
    09:38
    I’ll replace the display property and hide them properly
  32. rodneyrehm
    09:38
    (first I’ll read the docs you just linked)
  33. LjWatson
    09:39
    @rodneyrehm the other possibility is to use the clip CSS technique to hide them visually, but not from AT perhaps.
  34. StommePoes
    09:40
    I would try the hiding-visually option first
  35. StommePoes
    09:40
    we know in general that it works well, and it still lets you point to stuff and link stuff via aria
  36. StommePoes
    09:40
    and headers attrs etc have mostly only a fantastic track record with JAWS really
  37. LjWatson
    09:41
    @rodneyrehm here is Thierry Koblentz's article on the clip technique https://developer.yahoo.com/blogs/ydn/clip-hidden-content-better-accessibility-53456.html
  38. StommePoes
    09:41
    The first thing to test with offscreen visually hidden parts of tables would be VO, who seems to have issues with stuff not on screen
  39. LjWatson
    09:41
    @StommePoes agreed.
  40. rodneyrehm
    09:42
    ok, updated the table to “visually hide” using clip
  41. StommePoes
    09:42
    see, it makes me mad that someone just went and deprecated clip, what was the purpose of that?
  42. StommePoes
    09:43
    not that I use clip, but it is the main recommended way due to the articles @LjWatson linked, and web devs follow those
  43. StommePoes
    09:46
    What's a Real Developer supposed to do when they read "warning, clip is deprecated, use 'clip-path' instead", then go see what clip-path is all about, and find "warning, experimental in someone's garage, may explode in your face unexpectedly and sure as heck won't work in those corporate browsers your users are all stuck with". Srsly. Wut.
  44. yatil
    09:48
    @StommePoes You can just use clip-path instead (and keep clip as a fallback). It is mostly a new and more versatile syntax. Clip support won’t vanish quickly and especially not unless clip-path is widely implemented.
  45. StommePoes
    09:48
    so now anyway, someone with a mac or a copy of VO should see if @rodneyrehm's table headers are still there...
  46. rodneyrehm
    09:49
    hm, because of the absolute positionioning and hiding the header my table is now 1px wider than it used to be
  47. StommePoes
    09:49
    @yatil so Real Developers ought to triple their code for currently zero cookies?
  48. StommePoes
    09:49
    I at least want a damn cookie for that, I don't get paid by LOC but if I did, I'd be getting cookies...
  49. StommePoes
    09:49
    yeah I dislike clip rodney but there are several variations on it
  50. StommePoes
    09:50
    just have to stay away from any combo of height: 0 and overflow: hidden, hits VO hard
  51. yatil
    09:50
    @StommePoes /me agrees with cookies.
  52. StommePoes
    09:50
    and tables may act differently than All Other Elements Evar in many browsers
  53. StommePoes
    09:50
    normally pos-abs won't add in the room at all
  54. StommePoes
    09:51
    might have to do with browsers using parts of the tables to calculate widths etc.
  55. rodneyrehm
    09:54
    well, my pixel thing is only happening in chrome, so screw that pixel
  56. rodneyrehm
    09:55
    Considering I have many tables, how would I best add a legend explaining the data-cells’ contents both visually and for AT?
  57. StommePoes
    09:56
    you mean like the summary used to? "columns containing browsers, rows with HTML elements, cells showing whether that element is tabbable, focusable or inert in that combo" sort of thing?
  58. StommePoes
    09:57
    man, a visually sticky header would be great for this, as you scroll down it gets further and further scrolling back up to see again which browser you're looking at. Or, if there was another way to optionally show that info for a given cell... cognitively would rock.
  59. StommePoes
    09:58
    you oughtta try viewing a ginormous table like that in ZT.
  60. LjWatson
    09:59
    @rodneyrehm I don't think the data in those tables needs much explanation does it?
  61. rodneyrehm
    10:03
    well, the color-coding, which you obviously don’t get to see, threw up the question if green was considered good, and red bad
  62. rodneyrehm
    10:03
    …when they’re not, they’re just there to make the table glanceable
  63. rodneyrehm
    10:04
    I might just need to change colors
  64. rodneyrehm
    10:04
    @StommePoes I have a visually sticky header?
  65. rodneyrehm
    10:06
    haha, firefox also has the off by one pixel problem - obly to the left instead of the right
  66. rodneyrehm
    10:06
    I should’ve drawn the table in a canvas instead…
  67. LjWatson
    10:07
    @rodneyrehm using any colours to indicate info isn't a good thing, but especially not red/green (because it's a common colour-blindness combo).
  68. StommePoes
    10:08
    Rodney I'm not getting a visually sticky anything on your page, lemme check if I get some error...
  69. StommePoes
    10:09
    caniuse also uses similar colours
  70. StommePoes
    10:09
    so long as theirr contrasts don't prevent readability,the colour is an extra
  71. rodneyrehm
    10:09
    the color is additional, It helps to spot patterns without having to read every cell (yes, only helps visually, I understand)
  72. StommePoes
    10:09
    so it shouldn't count in this case as a "sole conveyor of information" since it's really only an extra (aanvullende)
  73. rodneyrehm
    10:10
    @StommePoes what browser are you using? on Firefox and Chrome I get a sticky header
  74. StommePoes
    10:10
    but you could look to see if lighter versions of the colours are better, the inerts are a bit harder to read without colour blindness
  75. StommePoes
    10:10
    I'm using some form of Chromium, but it is an outdated one, lemme try FF
  76. StommePoes
    10:10
    I am getting an error tho
  77. StommePoes
    10:10
    Uncaught TypeError: Cannot read property 'style' of undefined
  78. StommePoes
    10:10
    focusable.html: 27412
  79. StommePoes
    10:11
    sticks in my FF
  80. rodneyrehm
    10:11
    ah, ok, I did not try to make the sticky header work in every browser out there. If you’ve got a modern one, you get the sticky thing, otherwise you’ll won’t. sticky header is an enhancement, so I guess that’s ok
  81. StommePoes
    10:12
    Yeah but chromium should show it, tho I dunno why it claims the tableHeader is undefined.
  82. StommePoes
    10:12
    chromium 37
  83. StommePoes
    10:13
    Firefox is not giving the error.
  84. sideshowbarker
    10:13
    @yatil about which ARIA requirements the W3C HTML Checker is currently checking, it’s basically just what's currently in the HTML spec and in @stevefaulkner’s ARIA in HTML doc, and I think that’s all essentially ARIA 1.0 attributes
  85. sideshowbarker
    10:14
    I sorta vaguely remember maybe recently adding support for one particular ARIA 1.1 attribute after @stevefaulkner added it to the ARIA in HTML spec
  86. LjWatson @LjWatson waves at @sideshowbarker
  87. sideshowbarker
    10:14
    hey @LjWatson
  88. sideshowbarker
    10:15
    I can’t remember now if I added support for the ARIA 1.1 attribute or if it was just that @stevefaulkner raised an issue for it
  89. sideshowbarker @sideshowbarker looks
  90. sideshowbarker
    10:17
    validator/validator#135
  91. sideshowbarker
    10:17
    still open
  92. sideshowbarker
    10:17
    I guess I didn’t actually add it yet
  93. sideshowbarker
    10:18
    role=switch
  94. StommePoes
    10:18
    hm looks like chromium executes the self-invoking function before all the other functions that define the tableHeader.
  95. stevefaulkner
    10:26
    @sideshowbarker haven't added other new attributes/role values yet as am waiting for feedback from ARIA WG bods as to which are mature/stable in ARIA 1.1
  96. sideshowbarker
    10:27
    ok
  97. LjWatson
    10:27
    @sideshowbarker would it be feasible to add aria-current to the conformance checker do you think? http://www.w3.org/TR/wai-aria-1.1/#aria-current
  98. sideshowbarker
    10:27
    @LjWatson yeah there’s actually already an open bug for that, I think
  99. LjWatson
    10:27
    Believe it's stable now in 1.1
  100. sideshowbarker
    10:27
    ok
  101. LjWatson
    10:27
    Cool :)
  102. sideshowbarker
    10:27
    yeah I think David Storey filed a bug
  103. sideshowbarker @sideshowbarker looks
  104. sideshowbarker
    10:28
    validator/validator#131
  105. sideshowbarker
    10:28
    see comments from @stevefaulkner there
  106. sideshowbarker
    10:29
    seems like maybe aria-current is not supported yet in UAs?
  107. LjWatson
    10:31
    @sideshowbarker @stevefaulkner is right in that no UA support it yet - but not wholly sure whether that's likely to happen until 1.1 reaches a more advanced state of maturity as a whole.
  108. LjWatson
    10:32
    It's that chicken and egg time... devs need to use it to encourage UA support, UA support encourages devs to use it. Time for a blog post or two on it perhaps :)
  109. LjWatson
    10:32
    I'm also hesitant to file AT bugs until there is API support for something.
  110. yatil
    10:34
    @sideshowbarker see this issue for details on the issue (I hope I captured everything): w3c/aria#85
  111. yatil
    10:35
    I think it needs clarification from the PFWG, imho it is vaguely defined or at least confusing.
  112. LjWatson
    10:36
    @Yatil it was a good summary of the conversation I think.
  113. sideshowbarker @sideshowbarker looks at w3c/aria#85
  114. sideshowbarker
    10:52
    hmm maybe the checker warning is due to a bug in the ARIA in HTML spec
  115. sideshowbarker
    10:53
    because the ARIA in HTML spec doesn’t say any role value is allowed for form
  116. sideshowbarker
    10:54
    it says only role=form is allowed
  117. sideshowbarker
    10:55
    for cases where any role is actually allowed, the table in the ARIA in HTML spec says, “Any role”
  118. sideshowbarker
    10:55
    I mean specifically at https://www.w3.org/TR/html-aria/#document-conformance-requirements-for-use-of-aria-attributes-in-html
  119. sideshowbarker
    10:56
    the validator does actually allow any role for form (I guess because I implemented it originally according to what the HTML spec says, not what the ARIA in HTML spec says)
  120. sideshowbarker
    10:57
    but I added warnings recently for all cases of elements where the only allowed role is the element’s implicit role
  121. rodneyrehm
    10:58
    @StommePoes that self-invoking function theorem doesn’t make much sense to me. The functions are declared first, then executed in the IIFE…
  122. zakim-robot
    10:58
    [serendavies, a11y] not sure where the best place to ask this is so ill try here
    Which of these is the best one to use image-replace or visually-hidden ?
  123. sideshowbarker
    11:00
    @stevefaulkner need you to weigh in on whether (A) the ARIA in HTML spec has a bug and that form can still have any role, or (B) that you really did change it so that form can only have role=form
  124. yatil
    11:34
    @sideshowbarker @stevefaulkner This (I assume it is the current editor’s draft for ARIA 1.1) says “any role”: https://specs.webplatform.org/html-aria/webspecs/master/#docconformance [can’t link to the specific table(!sic) row]
  125. stevefaulkner
    11:46
    @sideshowbarker @yatil current editors draft http://w3c.github.io/html-aria/ no role allowed, same as current WD
  126. stevefaulkner
    11:49
    Note: 3rd column of table is for "ARIA roles, states and properties which may be used" for form only global aria attributes indicated
  127. zakim-robot
    11:51
    [Klara Schmitt, a11y] Does anyone have any tips on the appropriate handling of form errors? I am helping someone consider a 3rd party vendor. The vendor has a form with a bunch of required fields. If I leave them blank and hit submit, the form populates with inline text errors and a heading that says "Please correct the errors below," but the focus says on the submit button and I don't actually hear anything in VO or NVDA implying the submission failed. What should be the proper behavior?
  128. stevefaulkner
    11:52
    If you disagree please file a bug on spec with reasoning
  129. LjWatson
    12:10
    @serendavies what is you're trying to hide and why?
  130. LjWatson
    12:11
    @Klara It's a good idea to display a summary of errors at the top of the form and move keyboard focus to that summary.
  131. LjWatson
    12:12
    Then list the errors in the summary, and make each one a link down to the corresponding field with the error. Lastly, associate inline errors with each error stricken field.
  132. zakim-robot
    12:47
    [Klara Schmitt, a11y] @ljwatson Thank you. I don't suppose you have a documentation link where it says that though? I've been scouring the WCAG documentation this morning and I can't determine whether it's a requirement or just recommended.
  133. zakim-robot
    12:48
    [Klara Schmitt, a11y] I've read a lot of articles suggesting that's the way to go, but the vendor is dragging their feet.
  134. sideshowbarker
    12:51
    @stevefaulkner so per the current spec, the checker should actually be emitting an error for form role=search, right? (not just that warning)
  135. sideshowbarker
    12:54
    btw I guess we should redirect https://specs.webplatform.org/html-aria to https://w3c.github.io/html-aria/
  136. LjWatson
    12:58
    @Klara it's worth noting that there is no requirement to meet WCAG guidelines using any specific technique(s). The techniques included with WCAG are just informative suggestions.
  137. zakim-robot
    12:58
    [Klara Schmitt, a11y] @ljwatson Thank you. I was just googling that trying to figure that out.
  138. LjWatson
    12:58
    That said, this technique suggests using the approach I outlined above http://www.w3.org/TR/WCAG20-TECHS/G139.html
  139. LjWatson
    13:00
    So you could use this technique to meet 3.1.1 (Error identification), or you could use another technique entirely providing it fulfilled the purpose of the guideline. It just so happens that this technique is a pretty good way to do things. HTH.
  140. LjWatson
    13:01
    @sideshowbarker yes, according to the spec I think it should be an error not a warning.
  141. zakim-robot
    13:01
    [dylanb, a11y] @klara: The requirement is 1.3.3 http://www.w3.org/TR/WCAG20/#content-structure-separation which you can meet in many ways - including putting focus in the first field with an error, or on a group of error messages etc.
  142. LjWatson @LjWatson waves @dylanb
  143. zakim-robot
    13:02
    [dylanb, a11y] Here is an example of the focus method http://dylanb.github.io/bower_components/a11yfy/examples/form-validation.html
  144. zakim-robot
    13:03
    [dylanb, a11y] The styles ar garish to illustrate a point :simple_smile:
  145. zakim-robot
    13:03
    [dylanb, a11y] *are
  146. dylanb @dylanb waves at @LjWatson
  147. zakim-robot
    13:04
    [dylanb, a11y] @klara: and of course 1.3.3 combined with 3.3.1 :simple_smile:
  148. zakim-robot
    13:06
    [Klara Schmitt, a11y] @dylanb I hadn't considered it part of 1.3.3, thanks. I'm still sorting out all the pieces. Generally, I can identify problems, but then I don't always know what section the problems fall under as to suggest why they need to be fixed. :simple_smile:
  149. zakim-robot
    13:06
    [Klara Schmitt, a11y] Vendor doesn't want to change their code, but if it means not getting our sale contract, they might.
  150. zakim-robot
    13:07
    [dylanb, a11y] @klara: that is not a simple thing, we have experts at Deque who still argue about allocation after doing this for (in some cases) more than a decade
  151. LjWatson
    13:07
    @Klara and the more buyers that take that position, the more likely vendors are to change - so bravo for pushing on this.
  152. zakim-robot
    13:07
    [dylanb, a11y] +1 what @ljwatson said
  153. zakim-robot
    13:08
    [dylanb, a11y] I was actually interested to see what other on this thread would say, I was expecting some arguments :simple_smile:
  154. LjWatson
    13:09
    @dylanb would you like the five minute argument, of the full half hour?
  155. LjWatson @LjWatson hopes @dylanb knows his Monty Python.
  156. zakim-robot
    13:09
    [dylanb, a11y] the full half hour please
  157. LjWatson @LjWatson grins.
  158. zakim-robot
    13:10
    [dylanb, a11y] this isn't an argument
  159. zakim-robot
    13:10
    [dylanb, a11y] in fact, at this point, it is not even a conversation :simple_smile:
  160. LjWatson
    13:12
    http://www.montypython.net/scripts/argument.php
  161. zakim-robot
    13:16
    [serendavies, a11y] @ljwatson: At work we are discussing the best way to hide content from screen readers and given the fact non of them or even me really know alot about them we where wondering what was the best option
  162. deborahgu
    13:18
    serendavies
  163. LjWatson
    13:18
    @serendavies you want something to remain visible on the page, but to be hidden from screen readers?
  164. deborahgu
    13:19
    sorry -- dictation fail /o. Was goinf to answer but I'll let LjWatsontake it.
  165. LjWatson
    13:19
    @deborahgu go ahead :)
  166. zakim-robot
    13:20
    [serendavies, a11y] @ljwatson: Yes, as I dont think we should hide stuff of the screen as then we are not catering for users who use a screenreader but can see the page
  167. deborahgu
    13:20
    wait, @serendavies, what do you mean by not catering for users who use a screen reader?
  168. LjWatson
    13:20
    @serendavies is the thing in question focusable, or just static content?
  169. zakim-robot
    13:21
    [serendavies, a11y] @deborahgu I mean not every user who user a screen reader has a visual impairment and I don’t want to hide content off the screen because then they will get a weird experience
  170. deborahgu
    13:23
    @serendavies, could you explain a use case in which a weird experience might happen?
  171. zakim-robot
    13:23
    [serendavies, a11y] well if your users using a screen reader but you have hidden stuff of the side of the screen then they will be read something but they wont be able to see it
  172. zakim-robot
    13:23
    [serendavies, a11y] Or am I wrong?
  173. LjWatson
    13:24
    @serendavies providing the thing isn't focusable (shouldn't/can't be interacted with), you could use aria-hidden="true" to hide it from screen readers. The thing would remain visible on-screen though, so people with some usable sight would still be able to see it.
  174. deborahgu
    13:25
    LjWatson: I think serendavies is asking for the opposite, am I correct?
  175. zakim-robot
    13:25
    [serendavies, a11y] @ljwatson: Thank you thats just what i wanted to hear
  176. LjWatson
    13:25
    The discrepancy would come for sighted people using screen readers (perhaps for cognitive reasons). They *might find it strange that their screen reader wasn't announcing a piece of content they could see on-screen.
  177. deborahgu
    13:25
    oh, then I'm mistaken!
  178. deborahgu
    13:26
    sorry, I misunderstood. I thought you were asking about hiding context from the visual but not from screen readers.
  179. zakim-robot
    13:26
    [serendavies, a11y] @deborahgu aa I may have not been clear but oo I never had though of doing that
  180. deborahgu
    13:27
    :)
  181. zakim-robot
    13:27
    [serendavies, a11y] how would you do it the other way ?
  182. deborahgu
    13:28
    what, making it screen reader only? Position the element offscreen is one of the most common ways: http://webaim.org/techniques/css/invisiblecontent/ You have to be careful about left to right languages, etc., but it works pretty well.
  183. deborahgu
    13:30
    that's often used for things like "it is obvious to sighted users from page layout conventions that this is a navigation menu, but we need to tell screen reader users." Although best practice is to ask if it is anything is really that obvious from page layout conventions. (Thinking about cognitive.)
  184. LjWatson
    13:30
    @serendavies @deborahgu this clip technique is direction agnostic https://developer.yahoo.com/blogs/ydn/clip-hidden-content-better-accessibility-53456.html
  185. LjWatson
    13:30
    Although as @rodneyrehm noted earlier today, the CSS clip property has been deprecated - although for the time being this hasn't made any material difference in browsers AFAIK.
  186. deborahgu
    13:31
    since current design trend is never label anything that you can replace with a unique unrecognizable icon, and never put an icon on any page element which you could insteas set off by low contrast, flat texture, scarcely visible layout.
  187. LjWatson
    13:33
    @deborahgu don't know if you've read this, but it's a good analysis of the hamburger icon and exactly the issue you've just described http://deep.design/the-hamburger-menu/
  188. deborahgu
    13:33
    Oh man, LjWatson, every time somebody posts that article I read it again and send it hopelessly to every designer I know
  189. LjWatson
    13:34
    LOL. I read it for the first time today, and was very impressed. It's a really lucid analysis.
  190. deborahgu
    13:35
    it really is! I wish design best principles included that the best way to get people's money or clicks is not to make it difficult for them to give it to you.
  191. LjWatson
    13:36
    You'd really think that would be an important consideration in the scheme of things. Given the lengths people will go to to get an extra $/£ out of you, still they don't do the simple/obvious things.
  192. deborahgu
    13:36
    I have been finding it almost impossible to find search boxes lately. The common design pattern I've been seeing lately for the the search box is an unlabelled 3 em text field that doesn't expand to a normal size until you focus on it, which is unbordered and set off by a mild contrast difference from the page, totally flat design, with a similarly low contrast magnifying glass set off in the search box.
  193. deborahgu
    13:36
    you would think!
  194. LjWatson
    13:37
    Ugh. That's something to which I'm blissfully unaware using a screen reader. Sounds ghastly for everyone else though.
  195. deborahgu
    13:47
    it is. I am getting to the point where I have started asking my friends who do not work in web industries if they are having trouble navigating the web in general. And sometimes the answer is that they get to everything by following directly from Facebook, so it doesn't really come up.
  196. stevefaulkner
    13:48
    This message was deleted
  197. LjWatson
    13:50
    @deboragu I know when we started work on the beta for what's now http://gov.uk we did so on the basis that Google was most likely to be the "homepage" from which people arrived into Gov.UK from.
  198. stevefaulkner
    13:50

    @sideshowbarker btw I guess we should redirect https://specs.webplatform.org/html-aria to https://w3c.github.io/html-aria/

    Yeah I did a few weeks back webspecs/html-aria@f667045 but looks like the autoupdate is borked

  199. Heydon
    13:51
    @MichielBijl +1 for those lyrics. If we can get someone to turn it into a song, I'll put it on the a11y album.
  200. deborahgu
    13:53
    yep, Steve. For many sites, I find it easier to websearch for "[search term] site:site-I-am-navigating.com" than to use the site's internal navigation. Which is not necessarily a critique of the site, so much as it is a credit to very strong indexing. Though that does give you a false sense of security with respect to the idea that the search engines have necessarily indexed everything.
  201. stevefaulkner
    13:59

    @LjWatson: @stevefaulkner is this the latest version of ARIA in HTML module? https://specs.webplatform.org/html-aria/webspecs/master/

    No this is http://w3c.github.io/html-aria/, that one has been gutted and redirected, but the commit has not stuck need @darobin to fix

  202. stevefaulkner
    14:12

    A11ySlackers chat log 19th August 2015 http://w3c.github.io/a11ySlackers/archives/2015/08/2015-08-19.html

  203. stevefaulkner
    14:16
    @deborahgu context? is this in regards to nav vs find in page?
  204. deborahgu
    14:19
    stevefaulkner: site navigation vs. faster search via external search engine. I've put so much effort into building understandable site navigation that works for the user base, but personally, I get better results by ignoring site navigation and trusting google. (Well, usually DDG in my case.)
  205. zakim-robot
    14:33
    [David Kennedy, a11y] Hi all! Great to “meet” you all! Longtime reader, first time question asker. :simple_smile: In some a11y testing, I ran across some inline SVGs used solely for decorative purposes. They put them inline so they could better control the styling. What would be the equivalent of a null alt text in this case?
  206. zakim-robot
    14:34
    [David Kennedy, a11y] I read this awesome article, but it didn’t quite hit that use case: http://www.sitepoint.com/tips-accessible-svg/
  207. Heydon
    14:34
    @David Kennedy: aria-hidden="true"
  208. zakim-robot
    14:34
    [David Kennedy, a11y] Ah, that’s what I was thinking… That was easy! Thanks!
  209. Heydon
    14:35
    np
  210. zakim-robot
    14:35
    [David Kennedy, a11y] By the way Heydon, did you get your issues with Dreamhost sorted? I point people to your ARIA examples all the time.
  211. Heydon
    15:18
    Yes! http://heydonworks.com/practical_aria_examples/
  212. Heydon
    15:18
    Any ideas for new ones?
  213. LjWatson
    16:13
    msg Alice
  214. LjWatson
    16:14
    @Alice in your OWC talk I think you mentioned the Chrome a11y tools being included with the Chrome dev tools. Any update on this?
  215. powrsurg
    16:42
    I just noticed that NVDA does not read off '>' or '&ge'. How can we make it visually say "greater than" or "greater than or equal to"
  216. powrsurg
    16:43
    going to need to include a span that is visually hidden?
  217. alice
    17:07
    @LjWatson Hello! Update = I'm working on it :)
  218. alice
    17:07
    In between my myriad 20% projects, anyone got a cloning device handy?
  219. zakim-robot
    17:49
    [Francis Storr, a11y] How to mark up these color blocks?
  220. LjWatson
    17:51
    @Francis can you provide a description of the image? Thanks.
  221. zakim-robot
    17:58
    [Francis Storr, a11y] @ljwatson: there are two squares of pure color: one blue and one green. Both squares have had color blindness filters applied to them so some of the colors don’t look like the original color (for instance green looks like yellow). Underneath the color blocks there is text that describes the type of color blindness, for example "Deuteranopia (no green cones, red-green blindness)”.
  222. LjWatson
    18:11
    @Francis if you plan to use the image, then something like <img src="image.jpg" alt="Red and green coloured blocks looking pink and orange as someone with Deuteranopia (red/green colour-blindness) would see them">.
  223. LjWatson
    18:12
    I'm a screen reader user so the pink/orange bit of the text description will need sorting out!
  224. LjWatson
    18:13
    Realise one of the original blocks is blue not green, but hopefully you get the idea of the text description.
  225. LjWatson
    18:13
    So the above will give people like me (who can't see the image) a description of what it contains. Is that what you were after?
  226. zakim-robot
    18:20
    [Francis Storr, a11y] @ljwatson: I’d like to keep the color squares as divs with background colors rather than use an <img> element as it means the page is much more portable (I don’t have to zip up a whole load of images and the page itself). If I do that, it sounds like I should use an aria-label on each color square. Should I add role=img to each square as well? It might make them more discoverable. Thanks!
  227. LjWatson
    18:23
    @francis you'd need to add a role of some kind to the div for the aria-label/aria-labelledby to work.
  228. zakim-robot
    18:24
    [Francis Storr, a11y] @ljwatson: excellent. Thanks :simple_smile:
  229. LjWatson
    18:24
    Using role="img" seems workable. I'd suggest putting some text inside the div to act as a visible label, then hooking it to the dive using aria-labelledby perhaps.
  230. LjWatson
    18:25
    Although that would mean the label would be duplicated for screen readers, so perhaps that wouldn't be such a good idea.
  231. zakim-robot
    18:25
    [Francis Storr, a11y] @ljwatson: that seems like a plan. Thanks again.
  232. LjWatson
    18:25
    It depends if there is other information on the page to explain what the divs/imgs mean?
  233. zakim-robot
    18:30
    [Francis Storr, a11y] @ljwatson: Ah. Yes. Well, I’ll work something out so I get the descriptions and a sensible result in screen readers. I need to write some more content for the page itself so it’s understandable.
  234. LjWatson
    18:33
    @francis sounds good :)
  235. aardrian
    19:10
    @francis Not what you were asking, but any reason you cannot use images with base64-encoded chunks? If part of your goal is portability, that addresses it and you don't need to assign role="image" to anything.
  236. aardrian
    19:11
    @francis If it's flat color it will compress really well. You can use one of the online tools to generate the base64 URL. Something like http://b64.io/
  237. fstorr
    19:37
    @aardrian hadn't thought of that. Good idea. Thanks :)
  238. aardrian
    19:42
    @fstorr Happy to help (and by "help" I mean "answer a question different than the one you asked").
  239. bkardell
    19:43
    @alice this is me every day, except I dont get 20% time :) > In between my myriad 20% projects, anyone got a cloning device handy?
  240. alice
    19:47
    @bkardell ;_;
  241. fstorr
    20:16
    @aardrian Ha! All feedback welcome.
  242. zakim-robot
    21:44
    [Myles Borins, a11y] Hey all
  243. zakim-robot
    21:44
    [Myles Borins, a11y] I'm trying to round up people to make a nodeschool workshopper to help teach people about accessibility
  244. zakim-robot
    21:44
    [Myles Borins, a11y] TheAlphaNerd/a11y-school#1
  245. zakim-robot
    21:44
    [Myles Borins, a11y] For context --> http://nodeschool.io/index.html#workshoppers
  246. zakim-robot
    21:45
    [Myles Borins, a11y] node school is a series of terminal based workshops to get people up and running in everything from basic js to server side frameworks to webgl to performance
  247. zakim-robot
    21:45
    [Myles Borins, a11y] I think this could be a great way to onboard new people and educate a ton of people on accessibility
  248. zakim-robot
    21:45
    [Myles Borins, a11y] above I referenced an issue to discuss what the curriculum might be
  249. zakim-robot
    21:46
    [Myles Borins, a11y] If anyone can chime in that would be awesome!
  250. zakim-robot
    21:46
    [Myles Borins, a11y] I am also not sure how a11y friendly the terminal based node school modules are. I would love a chance to talk to anyone with accessibility needs who has a chance to play with them. Perhaps through this process we can improve the ecosystem as a whole!
  251. zakim-robot
    22:14
    [Jordan Scales, a11y] @thealphanerd so amazing!
  252. zakim-robot
    22:17
    [Brian Kardell, a11y] @alice: ¯\(ツ)/¯
  253. zakim-robot
    22:18
    [Brian Kardell, a11y] @alice: let's just communicate purely in emoticons from now on. W3C needs a good spec with no actual words :stuck_out_tongue:
  254. zakim-robot
    22:18
    [Jordan Scales, a11y] would also love to know how accessible the terminal UI they’re using is
  255. zakim-robot
    22:18
    [Alice Boxhall, a11y] @bkardell: \m/