List of Post Ideas

[davatron5000]

Simple, bite-sized snippets of content to teach A11Y in smaller pieces instead of big chunks. We can check them off (using githubs new todo list feature) as we get them finished.

:chart_with_upwards_trend: == A table or chart here would be useful.

Concepts

Basic introductions to various concepts. What is it? Why does it exist?

• [x] ARIA introduction: roles :chart_with_upwards_trend:
• [x] ARIA introduction: states :chart_with_upwards_trend:
• [x] ARIA introduction: properties :chart_with_upwards_trend:
• [x] Basic ARIA roles
• [x] Basic ARIA states
• [x] Basic ARIA properties
• [x] Color blindness
• [x] Color Contrast
• [ ] What is WAI? The Web Accessibility Initiative
• [x] Section 508
• [x] WCAG 2 (38 reqs)

Features

• [x] Accessibility Checklist
• [x] Resource Page

Quick Tips

Quick, tiny, easy improvements for maximum ROI

• [x] Using alt text correctly
• [x] Using title attributes correctly
• [x] Never use maximum-scale=1.0
• [x] Prefer button to div elements https://staging.w15y.com/shortcuts/prefer-button-to-div
• [ ] Avoid -webkit-text-adjust-size: none; http://codepen.io/davatron5000/full/14/7

Quick Tests

• [x] Navigate using your keyboard
• [x] Test contrast on your phone
• [x] Larger Touch Targets
• [x] Accessible Typography (considerations: larger font-size, etc)

HOWTOs

More in-depth, yet simple articles on HOW-TO use/create something.

• [x] HOWTO: Use VoiceOver on iOS
• [x] HOWTO: Use NVDA on Windows
• [ ] HOWTO: Use JAWS on Windows
• [x] HOWTO: Use VoiceOver on Mac
• [ ] HOWTO: Make an accessible <nav> with dropdowns @jimbateson
• [x] HOWTO: Hide content
• [x] HOWTO: Write accessible FORMs
• [x] HOWTO: Make accessible VIDEOs: <track> & HTML5 Video Controls
• [ ] ?? HOWTO: Make accessible CANVAS & SVG ?? (2 posts?) @CBID2
• [ ] HOWTO: Ajax with ARIA-LIVE
• [ ] HOWTO: Make accessible dialogs and modals
• [x] HOWTO: Test text at 200%
• [x] HOWTO: Em-based Media Queries
• [x] HOWTO: Accessible Animations (i.e, they're frustrating)
• [x] HOWTO: Use Access Keys

Myths

• [x] MYTHBUSTED: Accessibility is “blind people”
• [x] MYTHBUSTED: Screen readers don't use Javascript
• [ ] ?? MYTHBUSTED: Accessibility is just turning off CSS ?? @JSmurf

Assistive Technology (AT)

• [x] NVDA: The OpenSource Screen Reader
• [x] High Contrast Mode
• [x] User Zoom
• [x] Dyslexic Fonts

Videos

• [ ] Video: How a non-sighted person uses a screen reader
• [ ] Video: How a partially-sighted person uses High Contrast Mode
• [ ] Video: How a mobility-limited person uses a website

Misc.

• [ ] Firefox & Accessibility (aka, Don’t neglect FF).
• [x] ?? Myths: A11Y and SEO (myth confirmed?) ??
• [ ] SPANS. pause. screen. readers. (aka, "Why Lettering.JS sucks")
• [ ] ?? Cheapest way to get audio/video transcribed ??
• [ ] ?? Making Bootstrap Accessible ??

[thomassjogren]

I've composed a quick tip on maximum-scale, but how do you want it? The gist url or some other way? I'm not sure what workflow you are using for posts. :smile:

Btw. I tried to follow the basic layout of the already existing posts. If you wouldn't mind checking it and report back any issues with it.

https://gist.github.com/4526795

[chriscoyier]

Link dump...

Skip to content links: http://www.nczonline.net/blog/2013/01/15/fixing-skip-to-content-links/

Color contrast: http://leaverou.github.com/contrast-ratio/

Icon fonts: http://symbolset.com/ http://css-tricks.com/html-for-icon-font-usage/

[grayghostvisuals]

@chriscoyier OK so we got Lea in on the checklist page under 'testing' and also listed under 'online tools' on the resources page :metal:

[susanjrobertson]

Another link regarding title attribute usage: http://www.paciellogroup.com/blog/2013/01/using-the-html-title-attribute-updated/

[p4bl1t0]

An idea for a post could be:

HOWTO: Correctly label input types

Including labels, hints (formats or required messages), error message, etc.

[grayghostvisuals]

• [ ] How Screen Readers Handle Text when used with pseudo selectors and data-attributes for fancy overlay effects http://trentwalton.com/2013/11/06/a-better-way-to-layer-type/#comment-55979

[pstonier]

Good resource for ARIA-Live https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions

[chrisdemars]

I can definitely see myself writing some posts. I will come up with some ideas and content.

[RachelRVasquez]

Hmm I think I'm going to give Color Contrast a try!

[bupkes]

Hello. Just wanted to introduce myself, apologies if this is inappropriate. I am very new to Github and so am struggling to work out where/how to help with this project (eg I've never done a pull request or filed an issue and that sort of thing). I have been working for the past few years teaching blind and partially sighted users how to navigate computers and the web with screenreader software, so I'm hopeful that my experience might be useful. Anyway just saying hi. I'm doing a course on Github on Treehouse soon - once I've done that I should have a better idea what to do! Matt.

[joe-watkins]

@bupkes Welcome :) !!! Yes finish that course and report back.. but until you get a grasp of Git you can contribute. Your experience is priceless. Poke around our issues and chime in.. poke around our website and create issues if you find them. You don't have to be expert coder human to make a difference :)

If GitHub is a barrier feel free to email me directly ideas and such: info/at/joe-watkins.io

[jeryj]

Welcome @bupkes! In our redesign of the a11yproject.com site, we were struggling on the best implementation method for accordion-style collapsable content on mobile devices. There were some quirks with implementation that we thought might give screen reader users a worse experience with the site, so we abandoned it. It'd be great to pick your brain on the topic so we could figure out some solid patterns that give screen reader users and non-screen reader users a great experience.

Thanks for getting in touch and offering to help! Cheers, Jerry

[inclusiveThinking]

Recommendation to add the following book to the list:

Digital Outcasts: Moving Technology Forward without Leaving People Behind - Kel Smith

[inclusiveThinking]

Greetings. I would like to take "Accessible Typography". I should have a gist about in about a week.

[RachelRVasquez]

Hiya! 👋 I'd like to tackle an ARIA basics article to write. Question about the ARIA basics for roles, states, and properties - how would these differ from their intros? Would we be diving into specific application with examples? E.g. How to use ARIA landmark roles or How to use ARIA states on XYZ?

[jpdevries]

I think clarifying the difference between roles, states, and properties would be of benefit. People often refer to ARIA as "ARIA roles" when I think they usually mean ARIA in general.

[kendrick]

I'll work on a HOWTO for accessible modals.

[svinkle]

@kendrick Sounds good, go for it!

Please create a new issue when you've got something to show, linking your text in a gist for review.

[digilou]

Has High Contrast Mode under AT been taken yet?

[svinkle]

I don't think so, @digilou. Go for it! 🙂

Please create a new issue when you've got something to show, linking your text in a gist for review.

[Watso196]

Hi all! I work with ARIA during most days of the week and was wondering if the ARIA states article was still up for grabs? I'd love to contribute to a project that myself and my team of developers could use on a regular basis!

[svinkle]

@Watso196 Awesome idea! It's great when you write something then reference later. It could also be a mini series if you're keen; ARIA roles and properties could also use an article.

Either way, I say go for it! 👍

[alexroseb]

@Watso196 Are you still taking the ARIA states/properties? If not, I'd like to write the article about properties at least then potentially expand to articles about states and roles.

[scottaohara]

I think there's enough there that the work could be split up :)

[missmatsuko]

I think some of the unchecked items on the issue are already published.

Basic - Color blindness: https://a11yproject.com/posts/understanding-colourblindness/ Assistive Technology - NVDA: The OpenSource Screen Reader: https://a11yproject.com/posts/getting-started-with-nvda/

[sheribyrne]

If you are still looking for an article on color blindness I published one on Medium a couple of months ago that was picked up by the UX collective and has thousands of reads. https://medium.com/@sheribyrnehaber/color-blindness-considerations-for-designers-and-content-managers-a767ab38a825 I've also done a couple more techy ones on accessibility as measured by 2.1 for toast messages. Haven't done too much on GitHub before, but I will learn

[michaelspellacy]

HOWTO: Implementing Audio Descriptions

[youriwims]

Hi there 👋🏽 I've done a few videos on Firefox + A11Y with the Mozilla Developer YouTube channel. Is it okay to re-share them or would it be best to re-shoot them? Also, would I be responsible for the editing or does the A11Y Project provide support?

[joe-watkins]

@youriwims Those are so well done! I love the tone, pace, and how approachable they are!! Awesome work :) You are a great teacher.

[ericwbailey]

@youriwims We can list the videos on our Resources page. And echoing what Joe said, I love these videos!

Would you like to draft up a PR, or is that something you'd like us to do?