Barrierefreiheit im Web
Der Zugang zu Webinhalten wie öffentliche Dienste, Bildung, E-Commerce-Seiten und Unterhaltung ist ein Menschenrecht. Niemand sollte aufgrund von Behinderung, Rasse, geografischer Lage oder anderen menschlichen Eigenschaften ausgeschlossen werden. Dieses Modul behandelt die besten Praktiken und Techniken, die Sie erlernen sollten, um Ihre Websites so barrierefrei wie möglich zu gestalten.
Voraussetzungen
Sie sollten mit HTML, CSS und JavaScript vertraut sein, bevor Sie mit diesem Modul beginnen.
Tutorials und Herausforderungen
- Was ist Barrierefreiheit?
-
Dieser Artikel startet das Modul mit einem guten Überblick darüber, was Barrierefreiheit ist — dazu gehört, welche Personengruppen wir berücksichtigen müssen und warum, welche Tools verschiedene Personen verwenden, um mit dem Web zu interagieren, und wie wir Barrierefreiheit in unseren Webentwicklungsworkflow integrieren können.
- Barrierefreiheits-Tools und unterstützende Technologien
-
Als Nächstes richten wir unsere Aufmerksamkeit auf Barrierefreiheits-Tools und informieren über die Arten von Tools, die Sie verwenden können, um Barrierefreiheitsprobleme zu lösen, und die unterstützenden Technologien, die Menschen mit Behinderungen beim Surfen im Web verwenden. Diese Tools werden Sie in den folgenden Artikeln nutzen.
- HTML: Eine gute Grundlage für Barrierefreiheit
-
Ein Großteil der Webinhalte kann zugänglich gemacht werden, indem sichergestellt wird, dass die richtigen HTML-Elemente stets für den richtigen Zweck verwendet werden. Dieser Artikel erläutert im Detail, wie HTML genutzt werden kann, um maximale Barrierefreiheit zu gewährleisten.
- Barrierefreiheit: Best Practices für CSS und JavaScript
-
CSS und JavaScript haben bei sachgemäßer Nutzung das Potenzial, barrierefreie Web-Erlebnisse zu ermöglichen, können aber bei unsachgemäßer Verwendung die Barrierefreiheit erheblich beeinträchtigen. Dieser Artikel skizziert einige Best Practices für CSS und JavaScript, die berücksichtigt werden sollten, um sicherzustellen, dass selbst komplexe Inhalte so zugänglich wie möglich sind.
- WAI-ARIA-Grundlagen
-
Im Anschluss an den vorherigen Artikel kann es schwierig sein, komplexe UI-Steuerelemente zu erstellen, die aus unsemantischem HTML bestehen und dynamische, mit JavaScript aktualisierte Inhalte beinhalten. WAI-ARIA ist eine Technologie, die bei solchen Problemen helfen kann, indem sie weitere Semantiken hinzufügt, die von Browsern und unterstützenden Technologien erkannt werden können, um den Benutzern mitzuteilen, was vor sich geht. Hier zeigen wir, wie es auf grundlegender Ebene verwendet werden kann, um die Barrierefreiheit zu verbessern.
- Barrierefreie Multimedia-Inhalte
-
Eine weitere Kategorie von Inhalten, die Barrierefreiheitsprobleme verursachen können, sind Multimedia-Inhalte — Video-, Audio- und Bildinhalte müssen mit geeigneten Textalternativen versehen werden, damit sie von unterstützenden Technologien und deren Nutzern verstanden werden können. Dieser Artikel zeigt, wie.
- Mobile Barrierefreiheit
-
Mit der Popularität des Webzugangs auf mobilen Geräten und populären Plattformen wie iOS und Android, die vollwertige Barrierefreiheits-Tools bieten, ist es wichtig, die Barrierefreiheit Ihrer Webinhalte auf diesen Plattformen zu berücksichtigen. Dieser Artikel betrachtet mobil-spezifische Überlegungen zur Barrierefreiheit.
- Fehlerbehebung bei der Barrierefreiheit Herausforderung
-
In dieser Herausforderung präsentieren wir Ihnen eine einfache Website mit mehreren Barrierefreiheitsproblemen, die Sie diagnostizieren und beheben müssen.
Testen Sie Ihre Fähigkeiten
Zwischen den Tutorial-Artikeln finden Sie "Testen Sie Ihre Fähigkeiten", um zu überprüfen, ob Sie die wichtigsten Informationen behalten haben, bevor Sie weitermachen. Wenn Sie all diese Artikel zusammen erkunden möchten, finden Sie sie unter Testen Sie Ihre Fähigkeiten: Barrierefreiheit.
Siehe auch
- Starten Sie noch heute mit dem Aufbau barrierefreier Webanwendungen
-
Eine ausgezeichnete Reihe von Video-Tutorials von Marcy Sutton.
- Deque University Ressourcen
-
Beinhaltet Code-Beispiele, Bildschirmleser-Referenzen und andere nützliche Ressourcen.
- WebAIM Ressourcen
-
Beinhaltet Leitfäden, Checklisten, Tools und mehr.
- Liste der Werkzeuge zur Bewertung der Web-Barrierefreiheit
-
Beinhaltet eine Liste von Tools zur Bewertung der Barrierefreiheit des Webs.
- Lernen Sie barrierefreies Webdesign MDN Lernpartner
-
Der Kurs Learn Accessible Web Design von Scrimba lehrt, wie man zugängliches HTML durch das Lösen interaktiver Programmierherausforderungen und das Beheben einer realen Website schreibt.