Archive index

A11y Slackers Gitter Channel Archive 21st of November 2016

What fresh hell is THIS now? - Patrick Lauke
  1. zakim-robot
    @zakim-robot
    Nov 21 04:16
    [herin] Hi, Retrofitting A11y in one of the old application. A Results Data table that is created by javascript has 12 TRs and 6 TDs. The cells have OnClick events that take to 3 different screens. The whole row highlights on mouse hover. It's overly confusing now as I do not know that the TDs take me to different places.
    Making them <a> will make the page heavy with links as there are 25-30 links already in the navigation.
  2. [herin] Setting a tabindex=0 makes the focus on the TR.
  3. [herin] But, Is there a way to handle these tables?
  4. [herin] What do you suggest. To add complexity, the same JS creates multiple tables in different pages and they are all different from one another.
  5. luis garcia
    @garcialo
    Nov 21 04:29
    what do you mean by the cells' OnClicks go to 3 different screens? like are there three columns each of which go to different screens on click?
  6. and what are the destination screens? are they related to the data in the cells?
  7. if so, then probably just put links on the data in the cells instead of the cells themselves
  8. zakim-robot
    @zakim-robot
    Nov 21 04:35
    [herin] Yes. Column 1 is a student name --> (display only) Column 2 is reporting period related screen, Column 3 is curriculum & grade related and Column 4 is class related. All these are related to the current student what he is enrolled into.
  9. luis garcia
    @garcialo
    Nov 21 04:36
    so there is data in the cells you can just make into links, right?
  10. zakim-robot
    @zakim-robot
    Nov 21 04:37
    [herin] Yes, But when screen reader users use it by element list some information will be repeated
  11. [herin] Mutiple students in the same classin table - Will it be good to use Aria-describedby the student name on each link then?
  12. luis garcia
    @garcialo
    Nov 21 04:38
    yeah, I would do that
  13. or clipped text so it'll also show up in the list of links uniquely
  14. zakim-robot
    @zakim-robot
    Nov 21 04:40
    [herin] Clipped text sounds like a good idea.
  15. [herin] I might try that then.
  16. [herin] Thank you @garcialo
  17. luis garcia
    @garcialo
    Nov 21 04:40
    np
  18. Fiona Holder
    @FionaHolder
    Nov 21 11:16
    morning all
  19. Martin Držka
    @martindrzka_twitter
    Nov 21 14:24

    Hi, nowdays… can cut out role="region" when <section> tag is used. Or is it bettter to keep both?

    <section role="region" aria-labelledby="section-title">   <h2 id="section-title">Headline</h2>   ... </section>
    

    vs

    <section aria-labelledby="section-title">   <h2 id="section-title">Headline</h2>   ... </section>
    
  20. powrsurg
    @powrsurg
    Nov 21 14:41
    Well, it would depend on what AT your users actually tend to use (since some may use older tech), but the recommendation is for the latter as all modern AT understands that (the modern spec was updated to match what AT actually did). I'm not sure when exactly each version gained that though (that is a question I've asked here and don't think anyone had an exact answer).
  21. James Nurthen
    @jnurthen
    Nov 21 16:03
    I think the latter should work fine for everything except IE. if you need to support IE you should use the former.
  22. zakim-robot
    @zakim-robot
    Nov 21 16:04
    [zuzudev] Hi everybody
  23. zakim-robot
    @zakim-robot
    Nov 21 16:11
    [zuzudev] Following the advice of a member of this community, I've joined looking for some help. Does anyone know how accessible are NextCloud, ownCloud, Google Drive or OneDrive? I would appreciate any help.
  24. powrsurg
    @powrsurg
    Nov 21 16:14
    I wouldn't know, but wouldn't that all depend on the way you're accessing them (e.g. web interface, app, etc)?
  25. zakim-robot
    @zakim-robot
    Nov 21 16:16
    [zuzudev] You are right. I would focus on web interface.
  26. zakim-robot
    @zakim-robot
    Nov 21 16:24
    [quidkid] hey all! last week I finally got the tab index on my website to work properly…except it only works perfectly in Chrome. IE seems to take a few more tabs in certain areas before it gets to the right thing to focus and Firefox doesn’t show the proper custom outline when focused on the hamburger menu. and in safari, it skips all the links before the menu, including the skip to main content link. how can I standardize this across browsers? is that even possible? what sort of things should I be googling and looking into?
  27. [quidkid] in IE it’s also focusing on things it shouldn’t.. even after I put tab index-1 on it =(
  28. powrsurg
    @powrsurg
    Nov 21 16:31
    got a link?
  29. zakim-robot
    @zakim-robot
    Nov 21 16:41
    [mattgregg] @quidkid safari has some hidden settings in both safari and your mac’s accessibility settings that need to be on for tabbing to work properly. I don’t know about the IE issue. What version of IE are you using?
  30. [quidkid] IE-11 and how to enable those settings? @mattgregg
  31. [quidkid] and thank you so much for responding!
  32. [quidkid] powrsurg: I’m not allowed to but really wish I could!! -__-"
  33. [mattgregg] Safari prefs
  34. [mattgregg] That link from @cameron.fawcett shows both. Thanks!
  35. stevefaulkner
    @stevefaulkner
    Nov 21 16:57
  36. zakim-robot
    @zakim-robot
    Nov 21 17:10
    [zuzudev] What about NextCloud @stevefulkner?
  37. zakim-robot
    @zakim-robot
    Nov 21 17:44
    [cyns] thanks @michiel and @marcozehe! That looks like what I need to get started.
  38. Martin Držka
    @martindrzka_twitter
    Nov 21 18:33
    @powrsurg So keeping both sounds like a bulletproof solution…
  39. zakim-robot
    @zakim-robot
    Nov 21 19:23
    [cameron] what are folks using for emulating tab navigation in automated tests?
  40. [cameron] happy to move to #automated-testing too, but wanted to put this out broadly first
  41. [cameron] I’m thinking along the lines of Selenium, capybara-webkit, and the like
  42. James Nurthen
    @jnurthen
    Nov 21 19:28
    please keep it here. I'm interested and can't slack
  43. zakim-robot
    @zakim-robot
    Nov 21 20:47
    [garcialo] @cameron Dippy Bird
  44. James Nurthen
    @jnurthen
    Nov 21 20:47
    LOL
  45. zakim-robot
    @zakim-robot
    Nov 21 22:14
    [herin] Hi, What's the mouse handler event that goes with OnKeyDown? I changed the OnChange to onKeyDown in one of my select boxes. But, lost the mouse functionality now. :(
  46. [herin] Simple HTML page for a demo
  47. zakim-robot
    @zakim-robot
    Nov 21 22:19
    [caesar] OnClick?
  48. [caesar] Or OnMouseDown
  49. [herin] Thank you @caesar. What will the impact on Touch screens?
  50. zakim-robot
    @zakim-robot
    Nov 21 22:26
    [herin] Please ignore my previous question. Overthinking brain... tired.
  51. [herin] It works fine now. :)
  52. [herin] OnMouseDown works for me
  53. zakim-robot
    @zakim-robot
    Nov 21 22:37
    [caesar] Touch just emulates click, in my experience
  54. Mallory
    @StommePoes
    Nov 21 22:38
    @cameron we have Java-based selenium tests and there's an actual Tab command we run
  55. however because we can't automatically fix broken mac default settings, these only test windows/linux.
  56. Macs we have to test manually :(
  57. @cameron code is stuff like
        //Tab on an element     public void tabOnElement(By element) {         webElement = driver.findElement(element);         webElement.sendKeys(Keys.TAB);         webElement.sendKeys(Keys.ENTER);     }
    
  58. zakim-robot
    @zakim-robot
    Nov 21 22:42
    [cameron] @StommePoes thank you, that’s in line with what I was thinking
  59. [cameron] there are inconsistencies in language specific adapters that sometimes make key presses unreliable
  60. [cameron] but fundamentally that seems effective
  61. [cameron] many webdriver adapters execute javascript keypresses
  62. [cameron] in fact, selenium might under the hood as weel