Accessibility

Wenn jemand eine Website als "zugänglich" beschreibt, bedeutet das, dass jeder Benutzer alle Funktionen und Inhalte nutzen kann, unabhängig davon, wie er auf das Internet zugreift – einschließlich und insbesondere Benutzer mit körperlichen oder geistigen Beeinträchtigungen.

• Webseiten sollten für Tastatur-, Maus- und Touchscreen-Nutzer sowie jede andere Weise, wie Benutzer auf das Internet zugreifen, einschließlich Screenreadern und Sprachassistenten wie Alexa und Google Home, zugänglich sein.
• Anwendungen sollten verständlich und nutzbar für Menschen unabhängig von auditiven, visuellen, physischen oder kognitiven Fähigkeiten sein.
• Webseiten sollten auch keinen Schaden verursachen: Web-Funktionen wie Bewegung können Migräne oder epileptische Anfälle auslösen.

HTML ist standardmäßig zugänglich, wenn es korrekt verwendet wird. Web-Barrierefreiheit bedeutet, dass sichergestellt wird, dass Inhalte zugänglich bleiben, unabhängig davon, wer und wie auf das Web zugegriffen wird.

Der Firefox Accessibility Inspector ist ein sehr nützliches Tool, um Barrierefreiheitsprobleme auf Webseiten zu überprüfen. Das folgende Video bietet eine schöne Einführung dazu:

Um das Beste aus diesem Modul herauszuholen, wäre es vorteilhaft, entweder mindestens die ersten beiden Module der HTML, CSS und JavaScript Themen zu bearbeiten oder, noch besser, die relevanten Teile des Barrierefreiheitsmoduls durchzuarbeiten, während Sie die dazugehörigen Technologie-Themen durchgehen.

Was ist Barrierefreiheit?

Dieser Artikel beginnt das Modul mit einem guten Einblick, was Barrierefreiheit ist — dazu gehört, welche Personengruppen wir berücksichtigen müssen und warum, welche Werkzeuge verschiedene Menschen nutzen, um mit dem Web zu interagieren, und wie wir Barrierefreiheit in unseren Webentwicklungsworkflow integrieren können.

HTML: Eine gute Grundlage für Barrierefreiheit

Ein Großteil der Webinhalte kann barrierefrei gemacht werden, indem einfach sichergestellt wird, dass die richtigen HTML-Elemente immer für den richtigen Zweck verwendet werden. Dieser Artikel betrachtet im Detail, wie HTML eingesetzt werden kann, um maximale Barrierefreiheit zu gewährleisten.

CSS- und JavaScript-Barrierefreiheitsbest Practices

CSS und JavaScript können, wenn sie richtig eingesetzt werden, auch dazu beitragen, barrierefreie Web-Erlebnisse zu ermöglichen, aber wenn sie missbraucht werden, können sie die Barrierefreiheit erheblich beeinträchtigen. In diesem Artikel werden einige CSS- und JavaScript-Best-Practices beschrieben, die berücksichtigt werden sollten, um sicherzustellen, dass auch komplexe Inhalte so barrierefrei wie möglich sind.

WAI-ARIA-Grundlagen

Aufbauend auf dem vorherigen Artikel kann es manchmal schwierig sein, komplexe UI-Steuerelemente zu erstellen, die unsemantisches HTML und dynamische JavaScript-aktualisierte Inhalte beinhalten. WAI-ARIA ist eine Technologie, die bei solchen Problemen helfen kann, indem es zusätzliche Semantik hinzufügt, die Browser und unterstützende Technologien erkennen und nutzen können, um Benutzer wissen zu lassen, was vor sich geht. Hier zeigen wir, wie es auf einem grundlegenden Niveau verwendet werden kann, um die Barrierefreiheit zu verbessern.

Barrierefreies Multimedia

Eine weitere Kategorie von Inhalten, die Barrierefreiheitsprobleme verursachen kann, ist Multimedia — Video-, Audio- und Bildinhalte müssen mit richtigen Textalternativen versehen werden, sodass sie von unterstützenden Technologien und ihren Nutzern verstanden werden können. Dieser Artikel zeigt, wie das geht.

Mobile Barrierefreiheit

Da der Zugriff auf das Internet über mobile Geräte so populär ist und beliebte Plattformen wie iOS und Android vollwertige Barrierefreiheitswerkzeuge besitzen, ist es wichtig, die Barrierefreiheit Ihrer Webinhalte auf diesen Plattformen zu berücksichtigen. Dieser Artikel betrachtet mobile-spezifische Barrierefreiheitsüberlegungen.

Behebung von Barrierefreiheitsproblemen

In der Bewertung für dieses Modul präsentieren wir Ihnen eine einfache Website mit mehreren Barrierefreiheitsproblemen, die Sie diagnostizieren und beheben müssen.

Lernen Sie zugängliches Webdesign ^{MDN Curriculum Partner}

Scrimbas Kurs Lernen Sie zugängliches Webdesign lehrt Ihnen, wie Sie zugängliches HTML schreiben, indem Sie interaktive Coding-Herausforderungen lösen und eine reale Website reparieren.

Beginnen Sie heute mit dem Aufbau barrierefreier Webanwendungen

Eine hervorragende Videotutorial-Serie von Marcy Sutton.

Deque University Ressourcen

Beinhaltet Code-Beispiele, Screenreader-Referenzen und andere nützliche Ressourcen.

WebAIM Ressourcen

Beinhaltet Leitfäden, Checklisten, Werkzeuge und mehr.

Liste der Werkzeuge zur Bewertung der Web-Barrierefreiheit

Beinhaltet eine Liste von Werkzeugen zur Bewertung der Web-Barrierefreiheit.