Archive index

A11y Slackers Gitter Channel Archive 13th of January 2017

What fresh hell is THIS now? - Patrick Lauke
  1. zakim-robot
    @zakim-robot
    Jan 13 00:02
    [melsumner] Wouldn't a tooltip on a disabled button be non-conformant?
  2. zakim-robot
    @zakim-robot
    Jan 13 00:24
    [cordelia] I know, it’s an anti-pattern and non-comformant, but in the past I had to work on making one accessible to fit an existing design requirement.
  3. zakim-robot
    @zakim-robot
    Jan 13 01:22
    [herin] Hi, Has anyone tested the Failure example given in F80 (https://www.w3.org/TR/WCAG20-TECHS/failures.html#F80)?

  4. [herin] <!Doctype html>

    <html>
    <head>
    <style>
    h1 { font-size: 2em; }
    p, label { font-size: 1em; }
    input {font-size: 12pt}
    </style>
    </head>
    <body>
    <h1>Contact Us</h1>
    <p>Please provide us with your details and we will contact you as soon as we can. Note that all of the form fields are required.</p>
    <label for="fname">First Name</label><input type="text" name="fname" id="fname" /><br />
    <label for="lname">Last Name</label><input type="text" name="lname" id="lname" /><br />
    <label for="phone">Telephone</label><input type="text" name="phone" id="phone" /><br />
    <label for="email">Email</label><input type="text" name="email" id="email" /><br />
    <input type="submit" name="Submit" value="Submit" id="Submit" />
    </body>
    </html>

  5. [herin] WCAG says this will fail 1.4.4 Resize text
  6. [herin] Can some one please explain why this would?
  7. [christian] @herin probably because of the CSS specified input {font-size: 12pt} instead of using em (like they do for the h1 and p, label)
  8. zakim-robot
    @zakim-robot
    Jan 13 01:28
    [herin] Thanks @christian. Do you interpret this as we need to use consistent font-size measures?
  9. [caesar] "relative" rather than "consistent"
  10. [herin] Get it... it's the conflict between Zoom & Resize. But, browser zooms work fine in this instance.
  11. [herin] Thanks both
  12. [herin] I checked with Text Resize and it fails
  13. [herin] ha.. so many things to take into account
  14. [caesar] There's a big debate about 1.3.3 and whether browser zoom meets it
  15. [caesar] Because the good thing about zoom is that all elements remain proportional with respect to each other, hence not deforming the layout, and not altering any special relationships so as to preserve any meaning that might arise through those relationships
  16. [caesar] But then the problem is that viewport size remains fixed, so stuff might disappear off the edges of the screen, requiring scrolling
  17. [herin] Yup...
  18. [herin] But, WCAG does not explicitly recommend relative font as well.
  19. zakim-robot
    @zakim-robot
    Jan 13 01:33
    [herin] It would have been much easier to convince many people when these words are used with out ambiguity
  20. [caesar] That's half the fun of language - the ambiguity, LOL
  21. zakim-robot
    @zakim-robot
    Jan 13 01:43
    [bkardell] @marcysutton yes exactly
  22. zakim-robot
    @zakim-robot
    Jan 13 03:17
    [melsumner] Wait @herin yes it does, I was just referencing it today. Don't use px or pt, use % or em. I noticed that it didn't have rem.
  23. [melsumner] Also I would compare 1.4.4 to 1.4.8 - are you going for AA or AAA?
  24. zakim-robot
    @zakim-robot
    Jan 13 03:24
    [herin] @melsumner : I am doing AA. There are CSS techniques in 1.4.4 :
    Yes... I see that.
    C28: Specifying the size of text containers using em units (CSS)
    Techniques for relative measurements
    C12: Using percent for font sizes (CSS)
    C13: Using named font sizes (CSS)
    C14: Using em units for font sizes (CSS)
  25. [herin] Thanks
  26. zakim-robot
    @zakim-robot
    Jan 13 14:47

    [karlgroves] @melsumner
    Re: https://web-a11y.slack.com/archives/general/p1484254553001556

    The “Understanding” document for that SC is here:
    https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-scale.html

    The physical size , resolution, and pixel density of the user’s display doesn’t matter/ isn’t discussed in the SC

  27. Mallory
    @StommePoes
    Jan 13 16:35
    I hope they don't allow browser zoom to be "good enough." Users ought to have teh freedom and ability to set their needed font size once in the browser or OS settings.
  28. but when websites set stuff in PX you still have to go back to browser zoom, because the designer knows better than you
  29. I also kinda personally disagree with all-options-accounted-for with an input with (aria-) required and some kind of image, because it kinda assumes a dichotomy that might not really be true... you're either blind and have a screen reader telling you it's required, or your totally awesome sighted and can see a star and know what it means.
  30. I dunno that I'd say it fails anything but it's sub-par compared to attribute+maybe image/visuals+the actual clear as day text "required".
  31. Mallory
    @StommePoes
    Jan 13 16:41
    where the attribute + clearly-conveyed text are the needs and a visual designation for additional ease/maybe cog issues as a plus.
  32. zakim-robot
    @zakim-robot
    Jan 13 16:42
    [melsumner] @karlgroves: I was worried that might be what you meant. Okay thanks! thumbsup emoji
  33. [melsumner] Re: browser vs text zoom: isn't browser zoom the only thing that is easily available across all browsers w/o installing any plugins or extensions?
  34. [melsumner] I feel like I remember there being some issues on deciding "which version of which extension for which browser" and we realized we couldn't influence extensions but browser zoom was the same for all of them
  35. zakim-robot
    @zakim-robot
    Jan 13 16:47
    [melsumner] Also I agree that there is a lot more clarity to have the word "required" rather than an asterisk, but perhaps we may differ in that I think that could be more of an AAA than an AA, since the "hamburger" menu icon is also acceptable instead of the word "menu" - which bothers me a LOT (more).
  36. zakim-robot
    @zakim-robot
    Jan 13 17:09
    [quidkid] for videos that are purely decorative in nature, how do i deal with them in accessibility?
  37. [marcysutton] Happy friday Slackers (coffee emoji)
  38. zakim-robot
    @zakim-robot
    Jan 13 17:14
    [marcysutton] @quidkid provide some alt text?
  39. [marcysutton] or add role="presentation" maybe?
  40. zakim-robot
    @zakim-robot
    Jan 13 17:21
    [quidkid] Happy Friday @marcysutton and okeydokey! yeah i figured it would be like decorative images but wasn’t sure. I’m also supposed to analyze the website I was given to make sure it is accessible in design but frankly im not too confident in my ability yet to fully determine by eye whether something is completely accessible. the website layout resembles a slideshow in form and function with video backgrounds. any suggestions and recommendations?
  41. [marcysutton] My first pass is usually to make sure I can accomplish everything with the keyboard alone, then I run an accessibility checker, and then I run it through some screen readers
  42. [quidkid] i meant i only have a wireframe
  43. [marcysutton] ohhhhh
  44. [quidkid] i’m supposed to develop the website
  45. [quidkid] but they want me now to say whether this is doable
  46. [quidkid] but im still pretty new so I hesitate to say i can’t do something when i just need to figure it out
  47. [quidkid] on the otherhand, i don’t want them to have an approved design by the client and later find out it cannot be made accessible
  48. [marcysutton] Totally
  49. [marcysutton] It is pretty meta, but if you can visualize the same process I mentioned above when looking at the wireframe you can think through the interactions
  50. [marcysutton] Design annotations would set you up for success, but a lot of design teams don't offer those. Such as: what are the focus states? Any ARIA roles for grouping / indicating what things do? Alt text?
  51. [marcysutton] Sounds like maybe you can suggest some of those things?
  52. zakim-robot
    @zakim-robot
    Jan 13 17:32
    [quidkid] yeah they wanted me to figure all that out. my current approach is to try to figure out what kind of component i could closely match the feature to… i would say for this, this is a bit of a cross between a tabbed layout and a carousel.... i’m trying to be able to look it up in the guidelines so i know what aria tags to match it to..
  53. [marcysutton] that sounds like a good place to start!
  54. [quidkid] problem is when i get these hybrids and i don’t know which to follow lol
  55. [marcysutton] You might be able to tell them to tweak it to follow a pattern more closely
  56. [quidkid] good point!! thank you!
  57. [marcysutton] That's the benefit of providing feedback at the wireframe stage!
  58. zakim-robot
    @zakim-robot
    Jan 13 19:18

    [karlgroves] > Re: browser vs text zoom: isn't browser zoom the only thing that is easily available across all browsers w/o installing any plugins or extensions?

    @melsumner When WCAG 2.0 was released all browsers offered text-based zoom. IIRC that’s all Internet Explorer had while FF and Chrome allowed users to choose between page & text zoom.

    I do wonder what the WCAG WG is going to do with “Silver” now that browsers are moving solely to page zoom

  59. zakim-robot
    @zakim-robot
    Jan 13 19:38
    [melsumner] Oh that's very interesting.
  60. zakim-robot
    @zakim-robot
    Jan 13 22:34
    [robdodson] hey folks, for anyone who's interested i just posted a video on my process for doing an accessibility audit https://www.youtube.com/watch?v=cOmehxAU_4s&list=PLNYkxOF6rcICWx0C9LVWWVqvHlYJyqw7g&index=1
  61. [robdodson] I'm going to do a follow up blog post to cover any bits i may have left out but would love to know what people think