Web Accessibility Fundamentals

The web is awesome and everyone should be able to enjoy it.

Work in progress 🚧 🚧 🚧

Hi there! Polishing is still being done. Please pull/get the latest version a few minutes before the workshop starts.

Exercises

  1. #0 Accessibility Overview

    Myths, disabilities spectrum, guidelines

    #1.1Presentation (Slides)

  2. #1 Accessible by default

    1. 1.1

      Appearance

      #1.1Briefing #1.1Exercise #1.1Solution
    2. 1.2

      Semantic HTML

      #1.2Briefing #1.2Exercise #1.2Solution
    3. 1.3

      Meaningful images

      #1.3Briefing #1.3Exercise #1.3Solution

  3. #2 Keyboard navigation

    1. 2.1

      Interactive elements

      #2.1Briefing #2.1Exercise #2.1Solution
    2. 2.2

      Hidden elements

      #2.2Briefing #2.2Exercise #2.2Solution
    3. 2.3

      Navigation shortcuts

      #2.3Briefing #2.3Exercise #2.3Solution

  4. #3 Screen Readers

    1. 3.1

      Meaningful content

      #3.1Briefing #3.1Exercise #3.1Solution
    2. 3.2

      Page Landmarks

      #3.2Briefing #3.2Exercise #3.2Solution
    3. 3.3

      Accessible forms

      #3.3Briefing #3.3Exercise #3.3Solution

  5. #4 More UI patterns

    1. 4.1

      Loading states

      #4.1Briefing #4.1Exercise #4.1Solution
    2. 4.2

      On-demand changes

      #4.2Briefing #4.2Exercise #4.2Solution
    3. 4.3

      Custom UI components

      #4.3Components collection