search

atom / atom.io

🌐 A place for feedback on the atom.io website and package API
161 stars 98 forks source link

Accessibility Improvements #92

Closed johnfrenchxyz closed 7 years ago

johnfrenchxyz commented 7 years ago

Hey, everyone. Love the site. The team did an amazing job. I noticed some accessibility issues that could potentially help make the design a little more inclusive. Nothing drastic, but these could be things to think about. I looked over existing issues, but didn't see anything. Forgive me if I missed an existing issue.

"Controls and media elements should have labels" The video play button on the homepage is missing a label, I believe. For the sake of the design, you might consider having a label, but making it only read by screen readers. On my screen reader test, when you focus on that element, it simply says "button" but it doesn't give you any context. You can read about content designed for screen readers here.

"Text elements should have a reasonable contrast ratio" Some of the text on the homepage doesn't meet the recommended contrast ratio set by the WCAG standards. Some of the elements that fail the contrast check are .subtitle below the atom logo, and some of the links further down the page. From the same website as above, here is a contrast checker that has been helpful for me.

"The web page should have the content’s human language indicated in the markup" This one may seem petty, but I've read it can affect braille readers and is probably just a good idea to have in general. Just add this to the html tag: <html lang="en">

None of these are "deal breakers," mostly just things to think about. Love your work. Love Atom. Keep it up!

jasonrudolph commented 7 years ago

@johnfrenchxyz: Thanks for opening this issue. We've deployed some updates today to address two of the three items you described:

"Controls and media elements should have labels" The video play button on the homepage is missing a label, I believe. For the sake of the design, you might consider having a label, but making it only read by screen readers. On my screen reader test, when you focus on that element, it simply says "button" but it doesn't give you any context.

"The web page should have the content’s human language indicated in the markup" This one may seem petty, but I've read it can affect braille readers and is probably just a good idea to have in general. Just add this to the html tag: <html lang="en">

I'll keep this issue open until we can resolve the one remaining item:

"Text elements should have a reasonable contrast ratio" Some of the text on the homepage doesn't meet the recommended contrast ratio set by the WCAG standards. Some of the elements that fail the contrast check are .subtitle below the atom logo, and some of the links further down the page.

If you observe any other accessibility concerns, please let us know.

simurai commented 7 years ago

Color contrast got improved a bit. Still fails in some places though. Latest when a redesign comes around, color contrast should be part of the requirements.

PS. more accessibility improvements other than color contrast are still to come.