Save 37% off PRO during our Black Friday Sale! »

Inclusion & Accessibility on the Web: Harnessing Dev Power for Good

Inclusion & Accessibility on the Web: Harnessing Dev Power for Good

When writing code it’s very easy to lose sight of how much power we have as developers to do good - or cause harm - in the world.

This talk focuses on considerations for inclusivity and the technical options available to support them. The talk assumes an existing understanding of how removing biased assumptions from user experiences benefits all application stakeholders. Multiple solutions to each issue will be evaluated along with a presentation of suggested evaluation criteria for which option to chose given various contexts.

Across organizational verticals the scenarios discussed will include:
* Gender, sex, and sexual orientation topics
* Blindness, including colorblindness
* Holidays across faiths
* Language translation



May 20, 2016


  1. Inclusion & Accessibility on the Web: Harnessing Dev Power for

    Good Alison Stanton she/her/hers @alison985 #SelfCon 2016 Talk Specific Hashtag: #Code4Access
  2. Agenda • You Should Know • Jargon & Foundational Concepts

    • Accessibility Areas ◦ Sex/Gender/Sexual Orientation ◦ Blindness ◦ Holidays ◦ Language • Other Accessibility Areas • Ways Things Change • Contextual Accessibility Framework • Q&A 1. Understand It 2. Tech Ways to Fight It
  3. For This Talk You Should Know

  4. Talk Trigger Warnings Swearing Talking Fast Words on Anatomy and

    Sex re: Sex/Gender/Sexual Orientation for precision purposes (but no pictures, representations, or icons)
  5. • Color choices for these slides was an accessibility decision.

    • I wrote the talk description months ago. • Please hold questions until the end.
  6. Who is Alison? • HTML -> Perl -> PHP/mySQL ->

    Python -> Redshift & LookML -> Rails -> Postgres • Fun fact: I elected a President. • Volunteer: Chicago Tech Diversity Initiative outreach, Write/Speak/Code, Chicago Women Developers, Pride Action Tank
  7. What are Alison’s assumptions about who you are? • You

    have at some point prior to now written code. You’ve probably written code on a regular basis. You probably have code incorporated into your profession. • You are a human being AKA homosapien. • You’re aware of the talk title. You’ve probably read the talk description. • You believe in inclusivity. You have some history of dealing with diversity and inclusion issues and the challenges they present. You are constantly learning about new diversity and inclusion issues and working on your personal unconscious biases.
  8. Coders have power

  9. Jargon & Foundational Concepts

  10. Jargon • 508 Compliance • Web Content Accessibility Guidelines (WCAG)

    2.0 • a11y • Tags ◦ ALT attributes ◦ ARIA tags
  11. Foundational Concept: Universal Design

  12. None
  13. Foundational Concept: Coders Already Have The Toolset for Accessibility •

    Problem Solving • Abstraction • Precision • Iteration • Communication • Design/UX • Oddballs/Weird/Unique • Interdisciplinarity
  14. None
  15. Accessibility Area: Sex/Gender/Sexual Orientation

  16. Understanding Gender and/or Sex Gender as social construction Male Female

    Male Female Trans Male Female Genderqueer Sex as physical characteristics Male Female Male Female Intersex Gender “State” Cis Trans
  17. Understanding Sexual Orientation Straight Straight Gay/Lesbian Straight Gay/Lesbian Bi Straight

    Gay/Lesbian Bi Hetero-flexible/Homo-flexible Straight Gay/Lesbian Bi Pansexual Asexual Queer Questioning ????
  18. Understanding Sexual Orientation: Identity v Behavior v Orientation Not all

    men who have gay sex identify as gay. CDC invented MSM. Who you are romantically and/or sexually attracted to. Who you have romantic or sexual interactions with. Who you have had romantic or sexual interactions with. Who you identify as.
  19. Polyamory!

  20. Tech Solutions: Sex/Gender/Sexual Orientation • Be aware of assumptions ◦

    Example: Dr. & Dr. • Form Etiquette ◦ Ask only the relevant question ▪ Generally: pronouns ◦ Ask precise questions worded to be inclusive and acknowledging • Y2Gay • Trans implications in software • Forms and DB schemas ◦ Free-text form fields over multiple-choice ◦ Avoid booleans. • Build to adapt and remove cultural assumptions ◦ Generally: many to many relationships
  21. Accessibility Area: Blindness Blindness Low Vision Colorblindness

  22. Understanding Colorblindness • Color Vision Deficiency (CVD)

  23. Tech Solutions: Colorblindness • Test for it. Automated or actual

    person. • Pick accessible color pallette. ◦ High contrast ◦ Existing and tested pallette • Don’t associate color with feedback. Tools • (OS wide) • color-blindness-simulator/ (picture testing) • Colour Contrast Checker • In CS5 it is under View > Proof Setup > Color Blindness • On OSX -> Universal Access Control Panel • Google Chrome Extensions ◦ Spectrum ◦ Chrome Daltonize
  24. Understanding Low Vision • People with low vision might not

    stand out. (i.e. you probably won’t know)
  25. Tech Solutions: Low Vision Tools • Magnifier • Default keyboard

    shortcuts (i.e. + Cmd) • Relative design ( % over pixels) • Physical distance • Assistive devices
  26. Understanding Blindness • Email is easy. • Facebook is hard.

    I do it on the phone with Martha.
  27. Tech Solutions: Blindness • Braille • Screen Reader • Tags

    ◦ Demarcation • Implications of media and javascript
  28. Accessibility Area: Holidays

  29. Understanding Holidays • Government Holidays ◦ President’s Day ◦ Memorial

    Day ◦ Veterans Day • Religious Holidays ◦ Judeo-Christian tradition ▪ Easter ▪ Christmas ◦ Jewish ▪ Rosh Hashanah ▪ Yom Kippur ▪ Chanukkah
  30. Tech Solutions: Holidays Tools • Don’t hard-code. • Don’t assume.

    • Google Calendar
  31. Accessibility Area: Language

  32. Understanding Language

  33. Tech Solutions: Language • Awareness Tools • Slackbot • Find/replace

    • Auto-correct • “Add to Dictionary” • Tumblr • Archive Of Our Own • Philosophy of Precision
  34. Other Accessibility Areas Neurodiversity Mental Illness Trauma Physicality

  35. Ways Things Change Speed Versioned V Non-Versioned

  36. UX is Accessibility

  37. Documentation is Accessibility

  38. Contextual Accessibility Framework

  39. Contextual Accessibility Framework Why?

  40. Q&A @alison985 #Code4Access