Schulungsübersicht
Rechtlicher Kontext & Grundlagen der Barrierefreiheit
Modul 1: Einführung in das Barrierefreiheitsgesetz und seine Bedeutung
- Überblick über das neue Barrierefreiheitsgesetz (ab 28. Juni wirksam)
- Rechtliche Anforderungen und Fristen
- Auswirkungen auf den öffentlichen Sektor, private Unternehmen und Entwickler
- Warum Barrierefreiheit wichtig ist: soziale, ethische und geschäftliche Perspektiven
- Sanktionen bei Nichtkonformität
- Überblick über Barrierefreiheitsstandards (WCAG 2.1/2.2, ARIA)
- Kategorien von Behinderungen
Modul 2: Prinzipien & Richtlinien der Barrierefreiheit
- POUR-Prinzipien (Perzeption, Bedienbarkeit, Verständlichkeit, Robustheit)
- Einführung in die WCAG-Richtlinien
- ARIA-Rollen, -Zustände und -Eigenschaften
- Semantisches HTML und seine Rolle für Barrierefreiheit
Modul 3: Einrichtung einer barrierefreien Entwicklungsumgebung
- Tools: Browser-Entwicklerwerkzeuge, Screenreader (NVDA, VoiceOver), Barrierefreiheitserweiterungen
- Einrichtung von Lintern und automatisierten Barrierefreiheitstesttools
- Überblick über gängige Barrierefreiheitstesttools
- Einrichtung von Barrierefreiheitstests in mobilen Simulatoren und echten Geräten (mit VoiceOver/TalkBack, Android Accessibility Scanner, Xcode Accessibility Inspector).
Modul 4: Praktische Codierung – Semantisches HTML & Tastaturnavigation
- Erstellung semantischer Markups für Barrierefreiheit
- Sicherstellen der vollständigen Tastaturnavigierbarkeit
- Fokusmanagement-Techniken
- Barrierefreie Behandlung von Formularen und interaktiven Elementen
Barrierefreiheit in nativen mobilen Anwendungen (optionaler zusätzlicher Modul für 1,5 Stunden)
- Schlüsselplattformrichtlinien (Google Material, Apple Human Interface)
- Barrierefreie Navigation, Buttons und Formulare in mobilen Anwendungen
- Gängige mobile Barrierefreiheitsprobleme und Lösungen
- Praktische Tests mit VoiceOver und TalkBack
Fortgeschrittene Codierung & Assistive Technologien
Modul 5: Barrierefreies CSS und visuelles Design
- Best Practices für Farbkontrast und Schriftgröße
- Fokusstile und sichtbare Fokusindikatoren
- Responsive-Design-Betrachtungen für Barrierefreiheit
- Vermeidung von Barrierefreiheitsfallstricken in Animationen und Übergängen
- Farbkontrast- und Größenrichtlinien für mobile Bildschirme.
Modul 6: ARIA für dynamischen Inhalt & Rich Internet Applications
- Wann und wie man ARIA-Attribute verwendet
- Verwaltung von Live-Regionen für Screenreader
- Erstellung barrierefreier Widgets und benutzerdefinierter Komponenten
- Rolle von ARIA in SPA (Single Page Applications)
- Für mobile Anwendungen: Diskussion über Barrierefreiheitsrollen und -labels auf nativen Plattformen (z.B. contentDescription in Android, accessibilityLabel in iOS).
Modul 7: Praktische Codierungslab: Erstellung von barrierefreien Komponenten
- Erstellen von barrierefreien Buttons, Modals, Dropdowns und Tabs
- Implementierung von barrierefreier Formularvalidierung und Fehlerbehandlung
- Verwendung von ARIA und semantischem HTML für realistische UI-Elemente
Testing, Konformität und kontinuierliche Barrierefreiheit
Modul 8: Barrierefreiheitstesting & Auditing
- Manuelle Testtechniken mit Screenreadern und nur Tastatur
- Automatisiertes Testing mit Tools wie axe, Lighthouse, pa11y
- Erstellen von Barrierefreiheitstests für QA-Teams
- Integration von Barrierefreiheitstests in CI/CD-Pipelines
- Durchführung von Barrierefreiheitsaudits auf nativen mobilen Anwendungen (manuelle Tests, automatisierte Tools wie Accessibility Scanner, Espresso für Android, XCTest für iOS)
Modul 9: Sanierung & kontinuierliche Barrierefreiheit
- Gängige Barrierefreiheitsprobleme und deren Behebung
- Verwaltung von Barrierefreiheit in Legacy-Codebasen
- Wartung der Barrierefreiheit bei Feature-Upgrades und Refactoring
- Barrierefreiheit in multi-platform-Anwendungen (mobile, Desktop, Web)
Modul 10: Abschlusspraktische Übung und Zusammenfassung
- Erstellen oder Refactoring eines kleinen Apps/Moduls, um Barrierefreiheitsstandards zu erfüllen
- Peer-Review und Gruppensitzung
- Q&A- und Feedback-Sitzung
- Ressourcen für weiterführende Lernmaterialien und Konformitätsaktualisierungen
Voraussetzungen
- Grund- bis fortgeschrittene Kenntnisse in HTML, CSS, JavaScript
- Grund- bis fortgeschrittene Kenntnisse in mobilen App-Techniken (Android, iOS)
- Kenntnisse von Frontend-Frameworks (React, Angular, Vue usw.) sind ein Plus
- Kenntnisse in mobiler App-Entwicklung sind ein Plus
- Grundverständnis des Web-/Mobile-Entwicklungslebenszyklus
- Laptop mit eingerichteter Entwicklungsumgebung (Code-Editor, Browser-Entwicklerwerkzeuge)
Zielgruppe
- Frontend-/Backend-/Mobile-Entwickler
- UI/UX-Designer mit Kenntnissen der Codierung
- QA-Ingenieure, die sich auf Barrierefreiheitstests konzentrieren
- Produktbesitzer und Projektmanager, die in Barrierefreiheitskonformität involviert sind
Erfahrungsberichte (5)
„Ich habe die Echtzeitmethode des Trainers sehr geschätzt, mit der er gezeigt hat, wie unser Team Human-Centered Design (HCD) in unserem Projekt anwenden kann. Es war auch großartig, dass der Trainer sich Zeit genommen hat, um unser Projekt auf hohem Niveau zu verstehen, was klar und praxisorientierte Anleitungen dazu ermöglichte, wie wir den UX- und UI-Aspekten besser begegnen können.“
Nichole Bryant Joven - Grundfos
Kurs - Human-Centered Design (HCD)
Maschinelle Übersetzung
Die Tatsache, dass es praktische Beispiele zum Inhalt gab
Smita Hanuman - Standard Bank of SA Ltd
Kurs - Basel III – Certified Basel Professional
Maschinelle Übersetzung
Ich habe geschätzt, wie der Dozent sich mit Figma sehr kenntnisreich zeigte.
January Oliva - Eko Health
Kurs - User Experience Design with Figma
Maschinelle Übersetzung
- Übungen sind praktisch - Der Trainer ist hilfreich bei der Beantwortung unserer spezifischen Fragen
Germaine Choi - The Hong Kong Jockey Club
Kurs - User Experience (UX) Design
Maschinelle Übersetzung
Atmosphäre, Vorgehen bei den Übungen und Kommentare zu den Aufgaben. Es war eine so angenehme und entspannte Art, das Wissen weiterzugeben.
Elzbieta Moc-Kilanska - EY GDS
Kurs - User Experience UX Design Fundamentals
Maschinelle Übersetzung