GithubHelp home page GithubHelp logo

cgarate / learnaria Goto Github PK

View Code? Open in Web Editor NEW

This project forked from learnaria/learnaria.github.io

0.0 0.0 0.0 309 KB

This repository contains the course files for the Web Accessibility for Developers MOOC and eBook developed by The Chang School at Ryerson University. Participants should fork this repository, create a clone locally to work from, then fix the accessibility of each widget by applying the strategies outlined in the MOOC or ebook.

Home Page: https://de.ryerson.ca/wa

HTML 19.84% JavaScript 57.64% CSS 22.52%

learnaria's Introduction

LearnAria Course Files

The files in this repository accompany the "Web Accessibility for Developers" course, and eBook, created by The Chang School of Continuing Education at Ryerson University, in Toronto, Canada.

Web Accessibility for Developers

There are 10 widgets included in this repository (plus one example widget), that are purposely inaccessible. As part of the course activities, participants learn about WAI-ARIA, and apply what they learn to fix the accessibility of these widgets.

Widgets include:

  • Toggle Buttons (Example)
  • Progressbar
  • Accordion
  • Carousel
  • Tree Menu
  • Navigation Menu
  • Slider
  • Tooltips
  • Tab Panel
  • AutoComplete Form
  • Sortable List

Using These Files

To use these files, course participants (or anyone interested in creating accessible widgets) should:

  1. Fork this repository into their own GitHub account
  2. Rename the forked repository to [username].github.io in the repo's settings
    1. If you already have a GitHub Pages site, rename the repository to "learnaria" and enable it as a subdirectory under your existing site in the repo's settings.
  3. Test your GitHub Pages site by opening https://[username].github.io. (You may need to wait a few moments for the site to become available)
    1. For those with an existing GitHub Pages site, open https://[username].github.io/learnaria
  4. Take the course to learn how to apply WAI-ARIA to add accessibility to the widgets (or read the eBook).
  5. Apply the WAI-ARIA described for each of the widgets in the course, then commit those changes back to your forked repository.
  6. Test the widgets with ChromeVox (the screen reader used in the course) to ensure it functions as expected.
  7. Submit the URL to the widget in the course assignments for marking (in the course see the Rubric for marking details).

Beyond the Course

The Web Accessibility for Developers course will also be available as an ebook, with a link posted here when it becomes available. Those who are unable to participate in the course, or those who would like a reference based on the course, you are encouraged to download the ebook and work through the exercises on their own.

learnaria's People

Contributors

gregrgay avatar learnaria avatar missmatsuko avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.