/garbage-pail-components

A talk on garbage UI components and the pain people with disabilities face on a regular basis

Primary LanguageJavaScriptMIT LicenseMIT

Garbage Pail Components

Oh, the horror! Hot garbage has taken over the web. Carousel Cameron, Trappin' Tam, Shallow Dom...the gang's all here.. We'll turn the "bad accessibility" dial up to 11 in order to feel the pain that users with disabilities experience on a regular basis. Some of the patterns in this talk will be directly inspired from real life instances–because we can't even make this stuff up. By talking about the real-life practice of accessible web development, we'll be reborn and better equipped to create truly successful user interfaces.

Workshop slides: https://marcysutton.github.io/garbage-pail-components/

Presenting at:

  • Clarity Conf
  • Gatsby Days London
  • Smashing Conf NYC
  • A11yTO

This is a talk about some of the most frustrating components an accessibility specialist can think of (based on real life experiences). This originally came out of a happy hour discussion with Jesse Beach, Diane Ko, EJ Mason and Marcy Sutton at #CSUNATC19.

Prior art: https://github.com/feross/TheAnnoyingSite.com


This project was started with gatsby-starter-mdx-basic and @mdx-deck/theme.

Note: This repo works best with Node 12+ and npm installed.

  1. Create a new Gatsby site and slide deck using this starter. But it's worth reiterating again: you probably won't want to do that. Check out gatsby-a11y-workshop instead.
git clone https://github.com/marcysutton/garbage-pail-components
  1. Go into the directory, install dependencies, and start the development server
cd garbage-pail-components
npm install
npm start
View in a browser: http://localhost:8000