Web für alle – ein praktischer Einstieg in Barrierefreiheit


Workshop am 6. Mai 2024, ca. 10 -17 Uhr
In diesem Workshop lernt ihr die Grundlagen barrierefreier Webseiten kennen. Wir starten mit einer Einführung zur Bedeutung von Barrierefreiheit im Web: Warum machen wir das? Für wen machen wir das? Betrifft mich der European Accessibility Act? Welche Accessibility-Richtlinien sollen wir erfüllen?

Wir werden die technische Umsetzung dieser Anforderungen erarbeiten und dabei die Unterschiede von (statischen) Webseiten und Single-Page Applications berücksichtigen.

Wir gehen von einigen (echten) Designs aus und entwickeln gemeinsam barrierefreie Lösungen unter Betrachtung verschiedener Aspekte wie barrierefreies Design, semantisches HTML, Tastatursteuerung und aria-Attributen.

Vorkenntnisse

Unser Workshop ist ideal für Webentwickler:innen aller Erfahrungsstufen, die sich für Barrierefreiheit im Web interessieren.

Ihr solltet Grundkenntnisse in HTML, CSS und JavaScript mitbringen, aber vor allem die Motivation, mehr über Barrierefreiheit zu lernen.

Lernziele

Am Ende des Workshops werdet ihr für die Welt der Web-Accessibility vorbereitet sein.

Für eure zukünftigen Projekte werdet ihr die Gründe, Richtlinien und viele praktische Techniken erlernen, um Designvorgaben in barrierefreie Webseiten zu übersetzen.

Agenda

Diese Agenda ist nur ein grober Rahmen. Im Workshop selbst wollen wir euch die Grundlagen von Barrierefreiheit vermitteln, was je nach Vorwissen unterschiedlich lang dauern kann und unterschiedliche Schwerpunkte haben wird. Auch in den Praxisphasen wollen wir auf eure Fragen, Ideen und Wünsche eingehen. Als Orientierung könnte der Tag aber so ablaufen:

  • ab 09:00 Uhr: Registrierung und Begrüßungskaffee
  • 10:00 Uhr: Gemeinsame Grundlagen schaffen
    • Wieso eigentlich Barrierefreiheit
    • Semantisches HTML
    • ARIA
  • In die Praxis: vom Design zu barrierefreien Komponenten Wir gucken uns zwei Designs an und entwickeln daraus semantisches HTML und verbessern die User-Experience mit ARIA-Attributen
  • 12:30 - 13:30 Uhr: Mittagspause
  • 13:30 - 15:00 Uhr: In die Praxis Teil 2
    • eure eigenen Beispiele
    • oder ein, zwei weitere Designs
  • 15:00 - 15:15 Uhr: Kaffeepause
  • 15:15 - 16:15 Uhr: Spezialfragen
    • zum Beispiel Keyboard-Accessibility
    • eure Fragen
  • 16:15 - 16:30 Uhr: Kaffeepause
  • 16:30 - 17:00 Uhr: Rückblick und Ausblick
    • Was haben wir gelernt?
    • Wie können wir das Wissen vertiefen?
    • Was gibt es noch zu lernen?
    • Eure weiteren Fragen
  • ca. 17:00 Uhr: Ende

 

Technische Anforderungen

Für die Teilnahme an diesem Workshop braucht ihr nicht viel:
  • einen Laptop
  • mit einer IDE eurer Wahl, zum Beispiel VS Code oder Webstorm
  • und einem aktuellen Browser.
  • Wenn möglich, bringt bitte zudem einen Kopfhörer mit. Wir planen, Screenreader auszuprobieren, und dazu ist es sinnvoll, wenn du dich auf die Ausgabe deines Rechners konzentrieren kannst.
Sofern das Wlan stabil ist, reicht auch ein Browser, in dem eine Online-IDE wie codesandbox.io, stackblitz.com oder auch codepen.io läuft.

Speaker

 

Matthias Reuter
Matthias Reuter ist Webentwickler mit dem Fokus auf UX Engineering. Er macht alles, was mit Webfrontend-Entwicklung zu tun hat, von semantischem HTML über wartbares CSS bis zu elegantem JavaScript. Mag sauberen Code und schreibt gerne Tests.

Tanja Ulianova
Tanja Ulianova ist Entwicklerin mit einer Leidenschaft für solide Softwarearchitektur und reibungslose User Experience. Seit 2017 arbeitet sie als überzeugte Befürworterin von a11y daran, das Web zu einer inklusiven Umgebung zu machen. Zurzeit arbeitet sie bei flox, wo sie Entwicklerwerkzeuge für reproduzierbare Entwicklungsumgebungen erstellt.

enterJS-Newsletter

Du möchtest über die enterJS
auf dem Laufenden gehalten werden?

 

Anmelden