website icon indicating copy to clipboard operation
website copied to clipboard

Published 20 hours ago • verified publisher icon emberjs

[a11y] Accessibility issues

Open kennethlarsen opened this issue 8 years ago • 6 comments

I think it's time to make the Ember website more inclusive. I noticed some low hanging fruits which would make emberjs.com more accessible. For developing on this I suggest using the tota11y toolbar to validate fixes.

Frontpage

  • [ ] Missing alt text in MORE PRODUCTIVE OUT OF THE BOX-section (might need role="presentation" instead)

  • [ ] Missing alt text in WHO'S USING EMBER.JS?-section. Should at least name the company shown in the image.

  • [ ] Missing alt text in BUY EMBER.JS GEAR AND SUPPORT DEVELOPMENT-section. Should describe what is shown (e.g "Black Ember.js t-shirt").

Learn

  • [ ] Nonconsecutive heading level used. FREQUENTLY ASKED QUESTIONS (h1) -> HOW DO I FUTURE-PROOF MY EMBER.JS APPLICATION? (h3). Should be h1 -> h2.

  • [ ] Quick start, Tutorial and Guides has an empty link text

  • [ ] DEPRECATION GUIDES has no link text

  • [ ] SUPER RENTALS has no link text

  • [ ] BUILDS has no link text

  • [ ] API DOCS has no link text

Builds

  • [ ] First heading is not an h1. EMBER.JS RELEASE CYCLE is h2, not h1

Footer

  • [ ] Heroku and Fastly links have a description of null. Consider rearranging the tags or including special screen reader text.

kennethlarsen avatar Jul 17 '17 10:07 kennethlarsen

There is a larger effort to address this issue, but if someone wanted to work on this in the meantime, it's great practice!

MelSumner avatar Aug 29 '17 21:08 MelSumner

Can I get any of these items to do? I already did some alt and title items. There are also some points that we can improve on semantics rather than using divs. @kennethlarsen Excellent tool, I did not know.

danilovaz avatar Sep 04 '17 19:09 danilovaz

Just wanted to say that it's kind of a myth that screen readers don't read dynamic JavaScript: http://a11yproject.com/posts/myth-screen-readers-dont-use-javascript/

According to a January 2014 survey conducted by WebAIM, 97.6% of screen reader users have JavaScript enabled.

Obviously the thing to do is to actually try the page on a screen reader, but I'm not sure I agree with @ciolt - screen readers are for more than just blind users, and good accessibility helps everyone, not just the disabled.

FWIW, Mac voiceover can read the content for the /builds page just fine.

localpcguy avatar Sep 12 '17 13:09 localpcguy

Also, aria-live is very helpful for dynamically loaded Javascript https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions

kennethlarsen avatar Sep 12 '17 14:09 kennethlarsen

@MelSumner Did you larger effort address this issue or is it still open for PRs?

kennethlarsen avatar Jan 08 '18 10:01 kennethlarsen

@kennethlarsen a lot of this should be fixed- I will try to make time to go through each one of these (they should be separate issues).

MelSumner avatar Jan 11 '18 17:01 MelSumner