Bei der digitalen Barrierefreiheit, allgemein abgekürzt a11y, geht es darum, Websites und Webanwendungen zu entwerfen und zu erstellen, mit denen Menschen mit Behinderung auf sinnvolle und gleichwertige Weise interagieren können.
Dieser Kurs richtet sich an Anfänger und fortgeschrittene Webentwickler. Sie können die Reihe von Anfang bis Ende durchgehen, um einen allgemeinen Überblick über Praktiken und Tests zur Barrierefreiheit zu erhalten, oder Sie können sie als Referenz für bestimmte Themen verwenden. Wenn Sie einen unbekannten Begriff lesen, ziehen Sie unser Glossar zurate. Wenn Sie noch keine Erfahrung mit der Webentwicklung haben, sehen Sie sich die HTML-Kurse „Grundlagen mit Markup“ und die „CSS lernen“-Kurse zu den Grundlagen des Gestaltens von Stilen an.
Dies ist keine vollständige Referenz. Jeder Abschnitt stellt eine Einführung in das Thema des Bereichs sowie Kontext und Beispiele bereit. Es wird Links zu Themenreferenzen wie MDN- und WCAG-Spezifikationen sowie andere web.dev-Artikel geben. Jeder Abschnitt enthält einen kurzen Test, um zu prüfen, ob alles verstanden wurde.
Einige Best Practices für die Barrierefreiheit unterscheiden sich je nach der Beeinträchtigung, um die es geht. Es ist wichtig, die Nutzenden zu verstehen und Menschen mit Beeinträchtigungen zuzuhören, wenn sie Ihnen sagen, was sie brauchen.
Wir freuen uns immer über Feedback. Melden Sie ein GitHub-Problem und geben Sie so viele Informationen wie möglich an, damit wir Ihnen weiterhelfen können.
Die Themen:
Was ist digitale Barrierefreiheit und warum ist sie wichtig?
Sie können Websites und Webanwendungen entwerfen und erstellen, mit denen Menschen mit Behinderung auf sinnvolle und gleichwertige Weise interagieren können. Informieren Sie sich über die geschäftlichen und rechtlichen Auswirkungen dieser Entscheidungen.
ARIA und HTML
Wann sollte ich ARIA und HTML verwenden?
Inhaltsstruktur
Verwenden Sie semantisches HTML, Orientierungspunkte und Tabellen für barrierefreie Inhalte.
Das Dokument
Zusätzliche HTML-Elemente, die beim Erstellen barrierefreier Websites und Web-Apps berücksichtigt werden sollten.
Tastaturfokus
Reihenfolge und Stil der Tastaturnavigation verstehen und optimieren
JavaScript
Schreiben Sie barrierefreie Trigger-Ereignisse, Seitentitel, dynamische Inhalte und mehr.
Bilder
Barrierefreie Images erstellen
Farbe und Kontrast
Erstellen Sie barrierefreie Farbvorlagen mit geeigneten Kontrasten.
Animation und Bewegung
Unterstützen Sie Menschen mit allen Arten von bewegungsgesteuerten Störungen.
Typografie
Wählen Sie die richtigen Schriftarten und Schriftgrößen aus und strukturieren Sie Ihren Text mit einem barrierefreien Layout.
Video und Audio
Alternative Medientypen, die deine Video- und Audioinhalte barrierefrei gestalten.
Google Formulare
Barrierefreie Formulare erstellen
Design und Nutzererfahrung
Erstellen Sie barrierefreie Designs und bewerten Sie die User Experience.
Automatisierte Tests zur Barrierefreiheit
Automatisierte Tests für Barrierefreiheit durchführen.
Manuelle Tests auf Bedienungshilfen
Manuell auf Barrierefreiheit testen
Testen von Hilfstechnologien
Anleitung zum Testen mit Hilfstechnologien (AT).
Fazit und nächste Schritte
Weitere Ressourcen, die Ihnen bei den nächsten Schritten helfen.
Glossar
Sie lernen gängige Begriffe und Konzepte zur Barrierefreiheit kennen.
Bist du bereit, mehr über Barrierefreiheit zu lernen? Los gehts.