Skip to content
This repository has been archived by the owner on Jan 23, 2019. It is now read-only.

Latest commit

 

History

History
38 lines (22 loc) · 2.11 KB

README.md

File metadata and controls

38 lines (22 loc) · 2.11 KB
Raw

Accessibility Games

Coding challenges to learn about web accessibility.

screenshot of accessibility games landing pagescreenshot of articles about accessible buttons and linksscreenshot of button challengescreenshot of button challenge code

Install and Run

  1. Install Docker or Docker Toolbox

  2. git clone https://github.com/rebeccacremona/a11y-games.git

  3. cd a11y-games

  4. Fire up the web server: make up

  5. Navigate to a11y games:

  6. Hit "Begin"! You'll be presented with a series of challenges. To advance to the next challenge and win the game, fix the broken web elements, making them fully accessible by altering the html, tweaking the css, or adding javascript to the specified source file. (There are guidelines and hints in the code to help you along.)

  7. To rebuild the website and experience your changes: make rebuild, and refresh your browser window.

  8. When you are done playing, to stop the containers: make down

Tips and Hints

Check out the challenge's info page for a more detailed introduction to the accessibility issues it addresses. Each challenge also comes with a sample solution.

For tutorials and code samples, check out the Mozilla Developer Network's spectacular documentation on web accessibility.

Concept by @bensteinberg. Inspired by warc.games