Archive index

A11y Slackers Gitter Channel Archive 5th of September 2017

What fresh hell is THIS now? - Patrick Lauke
  1. zakim-robot
    @zakim-robot
    Sep 05 12:57
    [skymaiden] hello :) i'm looking for good examples of inaccessible websites (aside from my own organisation's) as points of comparison for my internal workshop – does anyone here have any recommendations?
  2. zakim-robot
    @zakim-robot
    Sep 05 17:15
    [tink] @skymaiden bbc.co.uk, gov.uk, morrisons.co.uk are all good examples IMO
  3. [tink] Oops! Realise belatedly you said "inaccessible". Ignore ^^
  4. [tink] Inaccessible sites... medium.com and twitter.com come readily to mind.
  5. [tink] marksandspencer.co.uk, next.co.uk are two more.
  6. zakim-robot
    @zakim-robot
    Sep 05 17:20
    [jasonday] @skymaiden - I found coding a dummy inaccessible page is useful in those type of scenarios
  7. zakim-robot
    @zakim-robot
    Sep 05 17:58
    [jasonday] It allows you to do a comparison/contrast on the same bit of code.
  8. [jasonday] slash experience
  9. zakim-robot
    @zakim-robot
    Sep 05 19:17
    [ghanek] I must say I'm disappoint that MarksNSparks is not accessible.
  10. zakim-robot
    @zakim-robot
    Sep 05 20:21
    [svinkle] My investment org, Wealthsimple, now has ab autoplaying video with audio on their homepage. :( I sent them a message that this was not good a11y. Also, their control to stop the video is marked up with a <div>. :'( I sent them this gist as an example to remediate the issue: https://gist.github.com/svinkle/e093626f74418dc98f187978d1f4e5b7
  11. zakim-robot
    @zakim-robot
    Sep 05 20:29
    [vyku] can some one suggest what should be the navigation order when use keyboard only in a sign in widget. should the sign in button be the last one before close button? what would be the order if the widget has username/password/remember me/sign in /forget username or password/join/lean more.../enroll
    both ins usability and accessibility point of view
  12. zakim-robot
    @zakim-robot
    Sep 05 20:53
    [herin] https://uxcellence.com/2017/design-podcasts
    On Twitter last week there were recommendations given for podcasts on webdesign, usability and accessibility. But I can't seem to find the thread back :( Does anyone hear has some recommendations?

  13. [morgan] Hi there. I'm struggling to find the right pattern for a simple component. It's a language switch on a small website (on the header). I would have a button that opens a menu from which a language can be picked among three. The action leads to a new page.

    Menu button (Navigation Menu Button, Action Menu Button, Button + Button[role="menuitemradio"]), Radio Group...

    As a newbie in inclusive design, I'm having a though time to figure out which one to pick.

    Any experience to share on something similar? Any advice?

  14. zakim-robot
    @zakim-robot
    Sep 05 21:43

    [vavroom] @morgan As a bilingual web user, I have found it clearer if the language options are clearly displayed, rather than having a button for "change language" or some such. My preference would be, and this is not backed up by numbers or studies, just my own bias, it would be to have two links to the other languages not being used at the moment. So if the site is available in English, French, and Italian, and the current page is in English, I'd have two links like FR | IT, or something like that. When one of the links is activated, then the page reloads in the appropriate language.

    One thing to avoid for sure: Don't send people away from the content they are looking at. So if your language switcher link loads the same page in an alternate language, that's good. If the switcher sends users back to the homepage, then, not so good. If there is no equivalent page in other languages, don't give language options.

  15. zakim-robot
    @zakim-robot
    Sep 05 22:00
    [quidkid] Hey guys, I’m trying to do a wcag aa compliant single page app in React and trying to keep in accessibility in mind and getting confused. The site I’m building will have a lot of buttons that open modals and I’ve been reading how it’s better to just have one Modal component and pass down props to change the content but I’m confused in terms of how to make this accessible. I’m also lost in terms of making the React router accessible as half the time I’m not sure whether these modals should be links if they are given a url but if they are opening on the same page, they should be buttons right?
  16. zakim-robot
    @zakim-robot
    Sep 05 22:10
    [ayashi] @ugi @svinkle sorry I didn't respond, went home for the long weekend and I'm not logged in to this slack from there :x we currently have a "reduce motion" link in the header that is always visible, I think it's actually next to our visually-hidden-unless-focused skip to content button XD so we def did something similar. I do think that the ideal situation is to have the pause button on or very close to the video though
  17. zakim-robot
    @zakim-robot
    Sep 05 22:48
    [svinkle] @quidkid See if this helps: https://github.com/davidtheclark/react-aria-modal
  18. zakim-robot
    @zakim-robot
    Sep 05 23:40

    [gokatgo] Hi @quidkid! With respect to making the SPA accessible if you're also using React Router, take a look at this for injecting <head> element titles for route changes. I'm actually testing out this library myself for an SPA, I'll let you know if I have success with it!

    https://github.com/gaearon/react-document-title