Accessibility and open design

About me

I am not an accessibility expert! I just like making things that everyone can use.

But until 2015, I didn't actually know anything about accessibility.

A sticker that says 'Basically everyone's been winging it since forever, you are not the only one'

Source: Everyone’s Been Winging It Since Forever

Accessibility-related things I have made

  1. Pode is an experimental code editor for newcomers to programming who are visually impaired. Also see my blog post on Pode.
  2. Accessible color palette builder
  3. Animated focus ring is active on this page (try pressing Tab).

Designing for inclusivity

An animated line of icons that represent diverse people welcoming you to Microsoft’s Inclusive Design web page.

Source: Microsoft's Inclusive Design website

Categories of impairment

Temporalities of impairment

Source: Google's Web Accessibility course on Udacity

Learn you an assistive technology (AT) for great good

Accessibility ≠ screen readers! But that said, a screen reader is a freely available AT that offers a great perspective on how some people use the technology we design and build.

  1. Google's Web Accessibility course on Udacity is extremely well-done, and among other things, teaches you how to use a screen reader. (Ignore all the advertising about it being for "advanced developers"—you only need basic HTML and CSS knowledge for most of the class, and the parts that require JavaScript knowledge are easy to skip.)
  2. NVDA is an excellent open-source screen reader for Microsoft Windows. The NVDA tutorial by WebAIM pairs well with it.
  3. VoiceOver is an excellent screen-reader built into MacOS and OS X, and it comes with a great built-in tutorial.
  4. Orca is an open-source screen reader for Linux, although I've never used it myself.

Things to try with a screen reader

I am a fancy but bad button




You should visit here for a neat site about kittens or here for information about cats or here for an article about how your cat is making you crazy.


Inclusivity vs. accessibility


Providing a tabular alternative to a line graph that's only visible to screen-reader users may make that graph accessible, but does it make it inclusive?

Line art of a line graph on the left, and its tabular equivalent on the right

Source: a11yclub with Heydon Pickering (video), describing inclusivedesignprinciples.org


Allowing for customization



  Sometimes it's very hard to deal with every possible impairment.
  For instance, a high contrast ratio can make content more readable for
  most folks with visual impairments, but for individuals with
  Irlen syndrome
  it can do the opposite.




  In this case, try to use open standards that allow users to customize your
  design via third-party tooling.


There are very many varieties in colour preferences, combinations of high contrast or low contrast with a dark or a light background, most tools will not change images but some will give them a tint or invert them

Source: How users change colours on websites from the gov.uk accessibility blog


Other resources


    
  
  1. Accessibility NYC Meetup and Accessibility NYC YouTube videos
    2. 
  
  2. Accessibility weekly newsletter
    3. 
  
  3. Alexa / Snips on Sara Hendren's blog
    4. 



Books


    
  
  1. A Web for Everyone by Sarah Horton and Whitney Quesenbery
    2. 
  
  2. Inclusive Design Patterns by Heydon Pickering
    3. 
  
  3. Adaptive Web Design by Aaron Gustafson (this isn't precisely about accessibility, but it's related)
    4.