Archive index

A11y Slackers
Gitter Channel Archive 28th of July 2015

What fresh hell is THIS now? - Patrick Lauke
  1. Scratch2k
    Jul 28 01:00
    here's an example: pardon my dodgy substitution of >> for the image http://codepen.io/chris-hore/pen/ZGmYLQ?editors=110
  2. Scratch2k
    Jul 28 01:01
    wow, embedded codepen, that's cool
  3. zakim-robot
    Jul 28 07:49
    [Michiel Bijl, a11y] I think 3.2.1. is right for this; the context of the link changes
  4. zakim-robot
    Jul 28 07:53
    [Michiel Bijl, a11y] No, that’s not right.
  5. zakim-robot
    Jul 28 07:53
    [Michiel Bijl, a11y] It becomes clear what the link does, but the context doesn’t change.
  6. zakim-robot
    Jul 28 07:55
    [Michiel Bijl, a11y] Can’t you pin it on 2.4.4 Link Purpose?
  7. zakim-robot
    Jul 28 07:55
    [Michiel Bijl, a11y] @Scratch2k
  8. zakim-robot
    Jul 28 07:56
    [Michiel Bijl, a11y] The purpose of each link can be determined from the link text alone or from the link text together with its programmatically determined link context, except where the purpose of the link would be ambiguous to users in general. (Level A)
  9. zakim-robot
    Jul 28 07:56
    [Michiel Bijl, a11y] http://www.w3.org/TR/UNDERSTANDING-WCAG20/navigation-mechanisms-refs.html
  10. stevefaulkner
    09:03
    @Scratch2k from the example provided the 'accessibility' issues appear to be that the text is not displayed on focus (2.1.1 Keyboard) and the accessible name for the link does not include text that clearly describes the link target (4.1.2 Name, Role, Value) i.e. '>>' is as good as no label.
  11. stevefaulkner
    09:23

    A11ySlackers chat log 27th of July 2015 - http://w3c.github.io/a11ySlackers/archives/270715.html

  12. rodneyrehm
    09:27
    hm, did not know “accessibility” had a logo - http://www.un.org/webaccessibility/logo.shtml
  13. Scratch2k
    10:24
    Thanks @stevefaulkner and @zakim-robot (Michiel Bijl), that gives me a starting point.
  14. garcialo
    10:31
    It also has an icon - http://accessibleicon.org/
  15. Heydon
    10:35
    Is there any such thing as an accessible date picker? I fear this may be a rhetorical question. As Leonie Watson recently confirmed, jQueryUI's is not so hot (https://jqueryui.com/datepicker/). Anybody have any thoughts on this?
  16. Heydon
    10:35
    That is, we tried it in JAWS and it didn't work at all intuitively. Also, the custom key bindings are a mysery.
  17. garcialo
    10:35
    I haven't looked at it in detail, but the native Chrome input="date" seems pretty good.
  18. Heydon
    10:36
    @garcialo Thanks. Trouble is, whatever the js fallback is will have to work too :(
  19. Heydon
    10:37
    Could take some cues from that, though, I guess.
  20. garcialo
    10:37
    Understood; at least it'd be a place to start..yeah
  21. garcialo
    10:37
    Unless it's changed since last I used it, I really liked the keyboardability of it
  22. StommePoes
    10:38
    http://assets.cms.gov/resources/framework/2.0/Pages/datepicker.html
  23. StommePoes
    10:39
    http://webaim.org/discussion/mail_message?id=28308
  24. Heydon
    10:39
    @garcialo Woah, didn't realize they'd dispensed with the popup UI http://www.wufoo.com/html5/types/4-date.html
  25. StommePoes
    10:40
    how does one get focus to the arrow on the wufoo?
  26. zakim-robot
    10:42
    [Jason Kiss, a11y] @heydon I’ve not played with it, but here’s another example at http://wet-boew.github.io/wet-boew/demos/datepicker/datepicker-en.html
  27. Heydon
    10:43
    @StommePoes Cheers, Mallory. Good framework, that. Have you tested with AT?
  28. StommePoes
    10:57
    no, the govt one was sitting in my mail from webaim list from 2014
  29. StommePoes
    10:58
    for if I ever was allowed to update our datepicker
  30. StommePoes
    10:58
    which of course I can't, because they must look exactly a certain way and users be damned and all that, etc etc
  31. Heydon
    10:59
    @jkiss Not bad with JAWS. A little complex as you have two ways of changing month (the month caption is also a link which opens a separate form)
  32. Heydon
    11:01
    @StommePoes Done some testing with JAWS. Really good. Firstly, it lets enter the date directly and speaks the format as a hint. Then, if you want, you can press the button and the picker popup itself is intuitive. My favorite part is that, when you select a date, focus is returned to the input field and it reads out (confirms) what you've chosen. Nice one!
  33. Heydon
    11:03
    My fight to get this adopted despite probably not looking "pixel perfect" the same (boo hoo) will follow
  34. StommePoes
    11:04
    Since it's based on jQuery, our muliple languages ought to work the same with it
  35. zakim-robot
    11:25
    [Rick Brown, a11y] The one on this page should be pretty accessible but maybe tough to disentangle from the underlying JS library https://online.immi.gov.au/evo/firstParty
  36. stevefaulkner
    12:08
    @alice FYI Update on standardizing shadow DOM and custom elements https://annevankesteren.nl/2015/07/shadow-dom-custom-elements-update
  37. StommePoes
    12:40
    man, when our site goes live, I'll post the URL here for everyone to "enjoy".
  38. zakim-robot
    12:40
    [Michiel Bijl, a11y] Looking forward to it :wink:
  39. StommePoes
    12:40
    I was just told by the graphic guy "remove the word MENU from the hamburger, we only want the hamburger"
  40. zakim-robot
    12:41
    [Michiel Bijl, a11y] how him this: http://blog.manbolo.com/2014/06/30/apple-on-hamburger-menus
  41. zakim-robot
    12:41
    [Michiel Bijl, a11y] Including the Apple WWDC video
  42. zakim-robot
    12:41
    [Michiel Bijl, a11y] Show*
  43. StommePoes
    12:41
    I'm not sure why you are sending that to me. I showed him ALL the articles
  44. StommePoes
    12:41
    I showed him Luke W's
  45. StommePoes
    12:41
    I showed him Booking.com's
  46. StommePoes
    12:41
    I showed him one I found in Dutch
  47. zakim-robot
    12:41
    [Michiel Bijl, a11y] :disappointed:
  48. StommePoes
    12:41
    doesn't matter
  49. zakim-robot
    12:42
    [Michiel Bijl, a11y] Some people don’t want to understand I guess…
  50. StommePoes
    12:42
    Also: "can you set the body text for mobile to roboto" (so, now mobiles do do a font-download, yay) "thin or font-weight 300 pls thx"
  51. StommePoes
    12:42
    color: #777
  52. StommePoes
    12:42
    I can't read it on my desktop
  53. StommePoes
    12:43
    but I'm special and different, most other people aren't that way apparently
  54. StommePoes
    12:43
    Honestly, the current website isn't great either, but I did what I could with the design demands. I tried.
  55. StommePoes
    12:44
    I ought to get a job running a machine in a canning factory.
  56. zakim-robot
    12:44
    [Michiel Bijl, a11y] Plenty of those around…
  57. StommePoes
    12:44
    I've been looking
  58. zakim-robot
    12:44
    [Michiel Bijl, a11y] Or get a job at an agency/company that supports a11y :stuck_out_tongue:
  59. StommePoes
    12:44
    Most jobs that require zero skills I can find still want a drivers license
  60. StommePoes
    12:44
    bleh
  61. zakim-robot
    12:45
    [Michiel Bijl, a11y] Who needs a drivers license in this day and age
  62. zakim-robot
    12:45
    [Michiel Bijl, a11y] Crappy PT for the win!
  63. StommePoes
    12:45
    schoonmaksters def do
  64. zakim-robot
    12:46
    [Michiel Bijl, a11y] I wonder why there are no viesmaaksters…
  65. StommePoes
    12:46
    I have zero ervaring with cleaning, but I know not to mix bleach with ammonia...
  66. zakim-robot
    12:46
    [Michiel Bijl, a11y] That would be a cool job
  67. StommePoes
    12:46
    every company has those
  68. StommePoes
    12:46
    that's why we need schoonmaaksters
  69. zakim-robot
    12:46
    [Michiel Bijl, a11y] Haha
  70. zakim-robot
    12:47
    [Michiel Bijl, a11y] Oeh, there is a position for front-end dev at LEGO :smile:
  71. StommePoes
    12:47
    I'm not really a front-end dev
  72. zakim-robot
    12:47
    [Michiel Bijl, a11y] That would be cool!
  73. zakim-robot
    12:47
    [Michiel Bijl, a11y] Nah, that was for me :stuck_out_tongue: It’s in Denmark.
  74. StommePoes
    12:48
    I don't do MVC.js, any templating frameworks, no sass
  75. StommePoes
    12:48
    i aint got no sass, boy
  76. zakim-robot
    12:48
    [Michiel Bijl, a11y] I don’t do weird JavaScript server writing stuff
  77. zakim-robot
    12:48
    [Michiel Bijl, a11y] But html, css, sass, less, pre-processor of the month, are no problem.
  78. StommePoes
    12:49
    we're using less. It has one useful thing I can't live without: //comments
  79. StommePoes
    12:49
    man I love //comments
  80. zakim-robot
    12:49
    [jitendra, a11y] I use Sass, Gulp and Swig
  81. StommePoes
    12:49
    I can swear up and down like the sailor I am and nobody outside will ever see them
  82. zakim-robot
    12:49
    [Michiel Bijl, a11y] Technically speaking, //comments are valid in normal CSS
  83. StommePoes
    12:49
    swig? new one to me
  84. zakim-robot
    12:49
    [jitendra, a11y] all are useful for html prototyping
  85. StommePoes
    12:49
    Jitendra: I just write HTML.
  86. StommePoes
    12:49
    And CSS.
  87. StommePoes
    12:50
    @michiel lessc strips them out, though. Only the other developer(s) will see them in the less file
  88. zakim-robot
    12:50
    [jitendra, a11y] I use swig if there are more than one page which will share some common html
  89. StommePoes
    12:50
    Otherwise I have to do nice comments :P
  90. StommePoes @StommePoes goes to look up swig
  91. zakim-robot
    12:51
    [jitendra, a11y] Swig has Template inheritance
  92. StommePoes
    12:51
    oh, looks like Jinja. Ok, I technically do this, since we use Jinja.
  93. StommePoes
    12:51
    Jinja's ok, it's pretty nice.
  94. zakim-robot
    12:51
    [jitendra, a11y] yes Swig is inspired from Jinja
  95. StommePoes
    12:51
    I once did some stuff in jasmine?
  96. StommePoes
    12:52
    I think it was jasmine, was <% javascripty %>
  97. StommePoes
    12:52
    @jintendra ah cool
  98. zakim-robot
    12:52
    [jitendra, a11y] But I have read a blog post today that Mozilla’s Nnjucks is better than Swig
  99. StommePoes
    12:53
    What did they say was better?
  100. zakim-robot
    12:53
    [jitendra, a11y] Nunjucks is also inspired from Jinja
  101. zakim-robot
    12:53
    [jitendra, a11y] it’s faster
  102. zakim-robot
    12:54
    [jitendra, a11y] than Swig
  103. zakim-robot
    12:55
    [jitendra, a11y] @stomme - here is the article http://www.ianlewis.org/en/javascript-templating-languages
  104. zakim-robot
    12:55
    [jitendra, a11y] I have also added some postcss plugins in my workflow along with Sass
  105. StommePoes
    12:56
    I did read a bloggy about postcss
  106. StommePoes
    12:56
    I guess I'm still waiting for the need for a pre-processor...
  107. StommePoes
    12:56
    I use less because the other developer uses less. No other reason really.
  108. StommePoes
    12:57
    ah, Jade, that was the template language I dabbled in.
  109. zakim-robot
    13:01
    [jitendra, a11y] Postcss has some good plugins which are helpful for a11y
  110. StommePoes
    13:02
    Like what?
  111. zakim-robot
    13:02
    [Michiel Bijl, a11y] PostCSS lacks good nesting support
  112. StommePoes
    13:03
    it'll add in stuff like a[title]:focus{content: '\0a(title); //other styles to make a jawsome tooltip;}
  113. StommePoes
    13:03
    ?
  114. zakim-robot
    13:03
    [jitendra, a11y] @stom - like this https://github.com/postcss/postcss-focus
  115. StommePoes
    13:03
    oh yeah, someone asked on the HTML working group about adding some kind of both-selector
  116. zakim-robot
    13:04
    [jitendra, a11y] and this https://github.com/btholt/postcss-colorblind
  117. StommePoes
    13:04
    I tend to have very separate :focus styles but that's only because the graphics guys don't like focus styles so I just make very separate things.
  118. StommePoes
    13:05
    the colours one could be cool... I have plugins on two browsers that do that, but I often have to disabled them because the browsers are janky and freak out often when they're enabled.
  119. StommePoes
    13:06
    github has added little icons things... no idea what apples mean
  120. zakim-robot
    13:06
    [jitendra, a11y] And postcss also some useful plugins which can help developer to support older IE browsers
  121. StommePoes
    13:06
    back to ie6?
  122. zakim-robot
    13:06
    [Michiel Bijl, a11y] Just saw a position for “Motivated AngularJS frontend and UX/UI Developer”
  123. StommePoes
    13:07
    The only Angular JS developers are the manic motivated ones
  124. zakim-robot
    13:07
    [Michiel Bijl, a11y] Isn’t motivated implied when looking for a job?
  125. StommePoes
    13:07
    They mean "enthusiastic about Angular! You jump for joy when you see the name!"
  126. StommePoes
    13:07
    Plenty of jobs have unmotivated people.
  127. StommePoes
    13:07
    exhibit A
  128. StommePoes
    13:08
    I would be motivated if I could somehow convince my company about perf, usability and a11y
  129. zakim-robot
    13:08
    [Michiel Bijl, a11y] Haha
  130. zakim-robot
    13:08
    [jitendra, a11y] Plugins like these
    https://github.com/iamvdo/postcss-opacity
    https://github.com/axa-ch/postcss-pseudoelements
    https://github.com/iamvdo/postcss-vmin
    https://github.com/cssdream/cssgrace
    https://github.com/robwierzbowski/node-pixrem
    https://github.com/justim/postcss-svg-fallback
  131. StommePoes
    13:08
    I did see a job on Fronteers vacatures page once that listed CSS4 on it. I'm not kidding, and this was at least 2 years ago.
  132. zakim-robot
    13:08
    [Michiel Bijl, a11y] Maybe they’re looking for people at http://eend.nl|eend.nl
  133. StommePoes
    13:09
    svg-fallback looks cool
  134. StommePoes
    13:09
    eend is awesome, but they're above my calibre
  135. zakim-robot
    13:09
    [Michiel Bijl, a11y] Why would you say that?
  136. StommePoes
    13:10
    ah, the svg plugin does either <svg> or .someclass { background: image.svg}... though I suppose that ought to cover most browsers these days...
  137. StommePoes
    13:10
    eend is a high-level company. Excellent standards.
  138. zakim-robot
    13:11
    [jitendra, a11y] @Michiel Bijl: Postcss has plugins for Nesting https://github.com/postcss/postcss-nested
  139. zakim-robot
    13:11
    [jitendra, a11y] https://github.com/jonathantneal/postcss-nesting
  140. zakim-robot
    13:11
    [Michiel Bijl, a11y] Mallory, they’d be lucky to have you!
  141. StommePoes
    13:11
    Jitendra: do you suppose those plugins will be removed in the future and the nesting will go to the core?
  142. zakim-robot
    13:12
    [Michiel Bijl, a11y] jitendra: The nesting one doesn’t support multi-level nesting (and the syntax may still change as Tab Atkins isn’t happy with the current one).
  143. zakim-robot
    13:12
    [Michiel Bijl, a11y] The nested one is okay, but has some issues with ampersand notation.
  144. StommePoes
    13:13
    oh, is tab part of that postcss? me gusta
  145. zakim-robot
    13:13
    [Michiel Bijl, a11y] No
  146. zakim-robot
    13:13
    [Michiel Bijl, a11y] But he’s the editor of the nesting spec :simple_smile:
  147. zakim-robot
    13:14
    [Michiel Bijl, a11y] See this conversation on twitter: https://twitter.com/MichielBijl/status/623767436861513729
  148. StommePoes
    13:15
    okay I'm looking at a site eend built last year and I'm super-surprised they make their first heading an h6. On the other hand, if they're going by importance-but-must-have-a-heading, I still haven't found a solution to that.
  149. StommePoes
    13:15
    Sometimes stuff before the main h1 needs headings.
  150. zakim-robot
    13:15
    [Michiel Bijl, a11y] Which one?
  151. StommePoes
    13:16
    the afrika one
  152. StommePoes
    13:16
    wazaonline.com
  153. StommePoes
    13:16
    it kinda looks wordpressy but then with fastly cdn instead of wp URLs
  154. StommePoes
    13:16
    code-wise
  155. StommePoes
    13:16
    wait, no
  156. StommePoes
    13:16
    drupal
  157. StommePoes
    13:16
    It's got drupally classes.
  158. StommePoes
    13:17
    <a id="search-toggler"> </a>
  159. StommePoes
    13:17
    hmm...
  160. zakim-robot
    13:17
    [jitendra, a11y] In our country India I saw a news yesterday and that India govt. has decided to make all gov. websites WCAG AA compatible
  161. zakim-robot
    13:18
    [Michiel Bijl, a11y] I’m more supprised by the crappy markup :x
  162. StommePoes
    13:18
    That's cool, Jitendra. Is there a name of the bill yet? (like US has section 508 of the Rehabilitation Act)
  163. StommePoes
    13:18
    There's a lot of clickables without names
  164. zakim-robot
    13:18
    [Michiel Bijl, a11y] That is great news
  165. zakim-robot
    13:18
    [jitendra, a11y] there are 6,000 websites
  166. zakim-robot
    13:18
    [Michiel Bijl, a11y] Woah
  167. zakim-robot
    13:19
    [jitendra, a11y] Here is the news http://www.dnaindia.com/india/report-6000-government-websites-to-be-made-accessible-for-the-differently-abled-2108182
  168. StommePoes
    13:19
    It also looks like old markup, but I don't know that they weren't going for really old UAs. Q42 is a company to look at, Michiel, they're doing a lot of projects for places like parts of Africa with crappy internets and low-end phones
  169. StommePoes
    13:19
    that's tweetable
  170. zakim-robot
    13:21
    [Karl Groves, a11y] @jitendra: is there a list of all 6000 websites anywhere?
  171. StommePoes
    13:21
    Oh, I was wrong, some of the clickables I thought had no names, do.
  172. zakim-robot
    13:21
    [Michiel Bijl, a11y] Haha, do they actually have an interactive toilet status tracking system: http://q42.com/about-q42
  173. StommePoes
    13:22
    not only do they have games, they pay attention to who hacks into them
  174. zakim-robot
    13:24
    [jitendra, a11y] @Karl Groves: I don’t know exactly which 6000 website but this is website of govt. of India websites http://goidirectory.nic.in/index.php
  175. StommePoes
    13:25
    and here is DEPD http://disabilityaffairs.gov.in/content/
  176. StommePoes
    13:25
    Probably every tiny local govt website would count under the announcement.
  177. zakim-robot
    13:29
    [jitendra, a11y] "Of these 6,000 websites, 50% will be made friendly for people with disabilities (PwDs) by July 2016 according to the Department of Social Justice."
  178. zakim-robot
    13:29
    [jitendra, a11y] "The center is planning to engage web auditors to enhance the features of government web portals and make sure they adhere to the disability standards of Web Content Accessibility Guidelines (WCAG) 2.0."
  179. zakim-robot
    13:30
    [Michiel Bijl, a11y] Are there people here who have worked with or for Siteimprove?
  180. zakim-robot
    13:31
    [jitendra, a11y] I would like to help to govt. to make websites accessible but I don’t how and where to approach.
    I don’t think existing developers govt. already has have a good knowledge of A11y
  181. zakim-robot
    13:34
    [jitendra, a11y] @Michiel Bijl: this is the current guideline website from govt. to develop govt. websites http://web.guidelines.gov.in/
  182. zakim-robot
    13:35
    [jitendra, a11y] List of vendors who developed websites for govt. http://web.guidelines.gov.in/web_development.php
  183. zakim-robot
    13:37
    [Michiel Bijl, a11y] “GBIF will provide a residence and work visa for internationally-recruited candidates, under the GBIF host agreement with Denmark”
  184. zakim-robot
    13:37
    [Michiel Bijl, a11y] I’m applying right now!
  185. zakim-robot
    13:37
    [Michiel Bijl, a11y] :stuck_out_tongue:
  186. zakim-robot
    13:37
    [Michiel Bijl, a11y] @jitendra: couldn’t you hook up with one of those agencies?
  187. zakim-robot
    13:38
    [jitendra, a11y] What is GBIF?
  188. zakim-robot
    13:39
    [Michiel Bijl, a11y] Global Biodiversity Information Facility
  189. zakim-robot
    13:39
    [Michiel Bijl, a11y] Free and open access to biodiversity data
  190. zakim-robot
    13:39
    [Michiel Bijl, a11y] http://www.gbif.org/what-is-gbif
  191. zakim-robot
    13:39
    [Michiel Bijl, a11y] Government funded
  192. Heydon
    13:41
    @StommePoes KLIK HIER!
  193. Heydon
    13:41
    Fuck me this gitter wotsit does some mad scroll jacking
  194. zakim-robot
    13:41
    [Michiel Bijl, a11y] @Heydon: you can connect through IRC
  195. MichielBijl
    14:16
    @stevefaulkner: I thought inputs were allowed to have multiple labels, but can't find it in the spec. Do you know where I might find such information?
  196. StommePoes
    14:17
    html4
  197. MichielBijl
    14:17
    Not allowed in HTML5 then?
  198. StommePoes
    14:18
    More than one LABEL may be associated with the same control by creating multiple references via the for attribute. http://www.w3.org/TR/html401/interact/forms.html#h-17.9.1
  199. StommePoes
    14:18
    No idea if HTML5 changed this. Have to find a spec that bothers to mention
  200. MichielBijl
    14:19
    Yeah, that line is removed from the HTML5 spec
  201. StommePoes
    14:19
    still true that one label can't reference multiple inputs, something that we hated when doing <label><input 1><input 2><input 3>
  202. StommePoes
    14:19
    what does validator.nu say?
  203. MichielBijl
    14:20
    Let me try
  204. MichielBijl
    14:21
    Validates without warnings or errors
  205. rodneyrehm
    14:22
    I’m using two labels for <input type=“checkbox”> rather often. one to actually label the thing, the other to have a styleable element that passes control-interaction to the input element
  206. MichielBijl
    14:23
    I usually use spans inside the label for that
  207. stevefaulkner
    14:23
    its conforming, but doesn't work well http://www.paciellogroup.com/blog/2012/05/notes-on-using-multiple-labels-for-a-control-using-the-label-element/
  208. MichielBijl
    14:23
    Thanks Steve :)
  209. stevefaulkner
    14:23
    in particular http://www.html5accessibility.com/tests/mulitple-labels.html
  210. MichielBijl
    14:24
    There is a discussion about this in #a11y-ux on Slack
  211. deborahgu
    14:58
    has anyone found automated accessibility testers that test multimedia, eg: "you have video but no keyboard controls or captions"?
  212. stevefaulkner
    15:04
    @deborahgu not I
  213. deborahgu
    15:04
    alas. I suspect if there were one, you would know about it, Steve. :/
  214. deborahgu
    15:05
    Well, Kaltura is open source, so if I write one for our Kaltura instance, I can release it, at least.
  215. stevefaulkner
    15:06
    @deborahgu I don't look much at auto tools, don't use them much, but @karlgroves hinted that tenon may be getting auto tests for such things (or maybe or dreamed it)
  216. deborahgu
    15:07
    I think I saw it on the tenon wishlist.
  217. StommePoes
    15:09
    just got a mail claiming big things being released soon from tenon, maybe this is one of them
  218. stevefaulkner
    15:09
    yeah tenon spam me gets too :smile:
  219. StommePoes
    15:10
    i have yet to build a complicated enough setup to be able to use it (in a useful way I mean, not just getting a json block back). Some day...
  220. zakim-robot
    15:11
    [Michiel Bijl, a11y] I only use the url input method :x
  221. StommePoes
    15:11
    (our company is behind all the "young and dynamic" companies out there. We ssh into stuff)
  222. StommePoes
    15:11
    don't you get a json block as result, Michiel?
  223. StommePoes
    15:11
    you mean curl?
  224. zakim-robot
    15:11
    [Michiel Bijl, a11y] Yeah, but the results are right there on the page…
  225. zakim-robot
    15:13
    [Michiel Bijl, a11y] e.g.: http://tenon.io/testNow.php?url=http%3A%2F%2Fs.codepen.io%2FMichiel%2Fdebug%2Ffd93878e0d37cb5c8746cb265d85e0bb%3F
  226. zakim-robot
    15:15
    [Michiel Bijl, a11y] If only I had the money to pay for it and know what the recommended solution is :stuck_out_tongue:
  227. zakim-robot
    15:15
    [Michiel Bijl, a11y] lang attribute is obvious, but nothing I can do over at CodePen.
  228. StommePoes
    15:17
    Hm, any way to get line numbers? For example a shop has "an empty heading element" but I don't see it.
  229. stevefaulkner
    15:20
    @StommePoes I have requested that @karlgroves provides better access to code of errors (for web UI simpletons) as the code snippets displayed with errors often don't suffice (i think)
  230. StommePoes
    15:21
    well, I can find something like an empty h2, but when I don't find one, then I need to know where the program thought it saw it.
  231. MichielBijl
    15:22
    BTW, what would be an alternative to linking to an image?
  232. MichielBijl
    15:22
    A desktop picture download in this case?
  233. MichielBijl
    15:22
    There is a img with alt text in the same <article>
  234. stevefaulkner
    15:23
    @MichielBijl linking to a separate page containing the image i guess
  235. MichielBijl
    15:23
    But the link has a download attribute
  236. MichielBijl
    15:24
    So no linking to download images then?
  237. MichielBijl
    15:24
    That seems weird, how are you expected to download the thing with a keyboard?
  238. MichielBijl
    15:25
    This is the code I use in my new website: http://codepen.io/Michiel/pen/f44315b71ebdb8b3134241efd9a29325
  239. MichielBijl
    15:32
    If I were to add a separate page with the image, I'd add a download link there too; bringing me back to square one…
  240. StommePoes
    15:34
    well you have an alt which describes the image, but doesn't name it. The download link talks about its name.
  241. StommePoes
    15:35
    I think all you have to do is figure out how to name it for everyone, and describe it for lo/no-viz
  242. StommePoes
    15:35
    you don't need to programmatically link to it, just content.
  243. StommePoes
    15:35
    if there are a series of pages each with a single image+download-this-image link, then you've already got quite a bit of context.
  244. StommePoes
    15:36
    if it's a single page with a list of downloadable images, if I could move the "download" closer to the image (like maybe even wrapping it) then I would, but I think you would have done that already anyway.
  245. MichielBijl
    15:38
    Hmm, I could wrap the image in a link. Let me work something out.
  246. MichielBijl
    15:39
    Something like this: http://codepen.io/Michiel/pen/a02fb7ebfc6c92c02eca59e9c6ed0533?editors=100
  247. StommePoes
    15:39
    then you could do some hipster "button in the middle of the image and when you mouseover the image fades away and the button enhances" crap :)
  248. MichielBijl
    15:39
    It now has an alt text and states the purpose of the link
  249. StommePoes
    15:40
    ja
  250. MichielBijl
    15:40
    Haha, afraid that wouldn't go well with my design :p
  251. StommePoes
    15:40
    what, no skinny jeans in your design??
  252. StommePoes
    15:40
    no beards? tats?
  253. StommePoes
    15:40
    no ruby on rails?
  254. MichielBijl
    15:41
    I'm afraid not: http://codepen.io/Michiel/pen/fd93878e0d37cb5c8746cb265d85e0bb?editors=110
  255. zakim-robot
    15:41
    [Karl Groves, a11y] @deboragu @Steve Faulkner we’re releasing a metric shitload of changes this week. We will then transition back to our prior CI-based releases. The following 3 weeks will see a ton of big new changes. Once that’s settled we’re going to focus on tests. Some of the upcoming changes will make future tests much more powerful and accurate. Media tests are part of that long list.
  256. StommePoes
    15:41
    no ginormous 500kb scaling background images that scroll like molasses?
  257. MichielBijl
    15:41
    Seems Tenon is not to keen on the wrapping the image thingy; got the same error.
  258. StommePoes
    15:41
    what does the error say?
  259. MichielBijl
    15:42
    Link points to an image
  260. MichielBijl
    15:42
    This link goes directly to an image. As a consequence it is not possible to supply a text alternative to the image.
  261. StommePoes
    15:42
    oh
  262. MichielBijl
    15:42
    I don't agree with the error with the new markup.
  263. MichielBijl
    15:42
    I could reference the name of the image in the alt text, but that seems a bit too verbose
  264. StommePoes
    15:42
    I think it's going with, if you're just reading along, you may only get link text or alt text but not both. However if you get a link-graphic you can always explore the differences anyway
  265. StommePoes
    15:43
    yeah it's pretty explainy already. Tshirt companies sometimes just have the description outside the image
  266. StommePoes
    15:44
    "This link goes directly to an image. As a consequence it is not possible to supply a text alternative to the image."<-- this also makes trouble for all those links that open the full-sized image, popular in image galleries that don't use lightboxes, or as a fallback for no-js,no-lightbox
  267. MichielBijl
    15:44
    Yup
  268. MichielBijl
    15:45
    @Karl Groves: where can I submit bugs to Tenon?
  269. StommePoes
    15:45
    link text for those ought to be "full-sized image". or whatever
  270. StommePoes
    15:45
    there's a github
  271. MichielBijl
    15:45
    Oeh
  272. deborahgu
    15:45
    @karlgroves thanks!
  273. zakim-robot
    15:46
    [Karl Groves, a11y] @MichielBijl http://tenon.io/support.php
  274. deborahgu
    15:46
    @karlgroves if I want to talk to someone about what specifically are part of the media test plans, so I know what to implement by hand and what to say "we can wait for it", who would be the person to talk to?
  275. MichielBijl
    15:46
    Thanks
  276. StommePoes
    15:47
    hey @karlgroves I sent a tweet a while back with an error
  277. StommePoes
    15:47
    on http://tenon.io/documentation/terms-of-use.php there's a link to pricing but the URL itself is missing the .php
  278. StommePoes
    15:47
    probably all developers will pick out the right url but, you know...
  279. StommePoes
    15:47
    section C
  280. zakim-robot
    15:51
    [Karl Groves, a11y] @StommePoes Aha! Thanks! I’m updating docs now anyway.
  281. zakim-robot
    15:51
    [Karl Groves, a11y] @deborahgu - Email talktous@tenon.io|talktous@tenon.io
  282. deborahgu
    15:51
    thanks again @karlgroves!
  283. stevefaulkner
    16:37
    @MichielBijl didn't notice the 'download' attribute which puts a diff spin on it
  284. MichielBijl
    16:38
    Yeah, maybe Tenon didn't notice that, too.
  285. stevefaulkner
    16:41
    as long there is a reasonable description of what is being downloaded in the link, there should be no problem (and an indication that it will download - until the download attribute semantics are exposed)
  286. MichielBijl
    16:42
    So would the current link text suffice? Or should I wrap the image with the anchor (like in the second example)?
  287. stevefaulkner
    16:46
    @MichielBijl useful info that could be included (file size/format)
  288. stevefaulkner
    16:46
    @MichielBijl https://www.w3.org/Bugs/Public/show_bug.cgi?id=29000 :-)
  289. MichielBijl
    16:47
    Thanks
  290. MichielBijl
    16:48
    Something like this: http://codepen.io/Michiel/pen/YXRGav?editors=100
  291. MichielBijl
    16:49
    <a href="http://dir.agosto.nl/design/wallpaper/Do%20or%20Dive/Do%20or%20Dive.png" download="download">Download 'Do or Dive' desktop picture (JPEG file, 3.2MB)</a>
  292. stevefaulkner
    16:49
    yes especially since its BIG
  293. MichielBijl
    16:50
    Good call
  294. techthomas
    17:46
    @MichielBijl worth considering the screen reader stutter effect of having an h3 with text of Download and then having a link text that begins with "Download" PS love the embedded codepen
  295. MichielBijl
    17:52
    @techthomas: the h3 is inherited from my current design, and sort of legacy from when I uploaded desktop pictures in multiple formats. I'll reconsider it, maybe I'll work the link into the text.
  296. zakim-robot
    18:54
    [estelle, a11y] I wanted to say "Thank You" to all the experts in here who answer so many of our questions. You are all amazing.
  297. zakim-robot
    19:05
    [Marcy Sutton, a11y] :beers:
  298. zakim-robot
    19:06
    [Marcy Sutton, a11y] I too am really happy you’re all here. Keep up the good work :simple_smile:
  299. deborahgu
    19:13
    I keep tabbing here I keep tabbing here as I cycle through my work HipChat windows, thinking at first that this is a work chat window, and getting really excited that my coworkers are saying smart things about screen readers and ARIA. And then I realize it's all y'all and I'm still glad you're here but I'd rather my coworkers were saying these things. ;)
  300. jonathantneal
    19:41
    What tools do you use to validate local sites? So far, I only know of the downloadable version of https://www.totalvalidator.com/
  301. ryandudek
    19:44
    http://addyosmani.github.io/a11y/
    http://squizlabs.github.io/HTML_CodeSniffer/
    http://howlowck.github.io/Akbar/
    http://khan.github.io/tota11y/
  302. ryandudek
    19:44
    and planning to test out setting up a pa11y dashboard this week: http://pa11y.org/
  303. zakim-robot
    19:46
    [Marcy Sutton, a11y] I use the Chrome A11y Developer Tools a lot, runs on everything https://chrome.google.com/webstore/detail/accessibility-developer-t/fpkknkljclfencbdbgkenhalefipecmb?hl=en
  304. jonathantneal
    19:48
    Thanks, @ryandudek ! :)
  305. ryandudek
    19:49
    I found them all through a11yproject and through Marcy’s talks…
  306. ryandudek
    19:49
    I’m just good at repeating
  307. garcialo
    20:11
    @jonathantneal , I compiled a small list of easier to use tools for a presentation I gave recently: http://www.garcialo.com/tools/
  308. garcialo
    20:11
    There are some other useful tools like FireEyes (http://getfireeyes.com/). You can just hit "Register" without filling out the form.
  309. garcialo
    20:12
    The Web Developer Toolbar is also quite good as well for local sites.
  310. garcialo
    20:14
    I've also been quite interested in setting up pa11y for personal projects. =)
  311. zakim-robot
    20:23

    [Francis Storr, a11y] @jitendra: thanks for the info about the 6000 Indian web sites. I can’t find anywhere where it states that the standard is Level AA—all I can see is a less-than-specific quote:

    all current websites meeting the relevant International Organization for Standardization (ISO) criteria that are found in ISO/IEC 40500 : 2012, Information Technology W3C Web Content Accessibility Guidelines (WCAG) 2.0.

  312. zakim-robot
    20:24
    [jitendra, a11y] "The center is planning to engage web auditors to enhance the features of government web portals and make sure they adhere to the disability standards of Web Content Accessibility Guidelines (WCAG) 2.0."
  313. zakim-robot
    20:24
    [jitendra, a11y] http://www.nextbigwhat.com/indian-government-web-portals-297/
  314. zakim-robot
    20:28
    [Francis Storr, a11y] Yes, but where does it say Level AA? That article, and the previous one, don’t mention Level AA.
  315. zakim-robot
    20:42
    [jitendra, a11y] India govt consider AA for govt website for development
  316. zakim-robot
    20:42
    [jitendra, a11y] have seen AA on many sites
  317. zakim-robot
    20:44
    [jitendra, a11y] "WCAG 2 Level A became the standard for Indian government websites in February 2009"
  318. jonathantneal
    20:44
    I asked our team about it, and it turns out we were already toying with pa11y, so thanks again!
  319. zakim-robot
    20:45
    [Francis Storr, a11y] @jitendra: Could you point me at something that shows Level AA? I’m putting a presentation together on countries mandating that level so a URL would be really useful.
  320. zakim-robot
    20:49
    [jitendra, a11y] This is govt data website https://data.gov.in/accessibility-statement
  321. garcialo
    20:55
    @stevefaulkner Typo on the URL for http://www.html5accessibility.com/tests/mulitple-labels.html
  322. zakim-robot
    20:55
    [jitendra, a11y] Indian army Website WCAG AA http://joinindianarmy.nic.in/screen-reader-access.htm
  323. garcialo
    20:55
    @stevefaulkner Or is that the British spelling?
  324. stevefaulkner
    20:57
    @garcialo nah just my spelling
  325. zakim-robot
    21:07
    [jitendra, a11y] @Francis Storr: I think I was not correct in that in latest news Govt has stated that all website will tested and developed with AA lever but I can most of the existing govt. website has mentioned that they are WCAG 2.0 AA level compatible.
  326. zakim-robot
    21:08
    [jitendra, a11y] let me know if you need any other help
  327. zakim-robot
    21:25
    [Francis Storr, a11y] @jitendra: Excellent, thanks for letting me know. If I need anything else I’ll drop you a line.
  328. dylanb
    22:14
    @jonathantneal you can install:
    https://chrome.google.com/webstore/detail/axe/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US
    https://addons.mozilla.org/en-US/firefox/addon/axe-firefox-devtools/
    http://getfireeyes.com/
  329. zakim-robot
    22:25
    [Francis Storr, a11y] @Marcy Sutton: I put your upcoming talk in #events because that seemed like a sensible place.
  330. zakim-robot
    22:26
    [Marcy Sutton, a11y] Cool! Thank you!
  331. zakim-robot
    22:29
    [dylanb, a11y] I just posted a job to the #jobs channel