Die wesentlichen Konzepte der Barrierefreiheit im Web

Ich erkläre Ihnen vorab ein paar wichtige Punkte.

Nummer 1: Gesetze

Barrierefreiheit ist in den meisten Ländern gesetzlich vorgeschrieben. Sie müssen es tun. Ich könnte noch mehr über die rechtliche Lage sagen. Aber Sie wollen wissen, was Sie tun müssen und wie Sie es tun können. Daher fahre ich fort.

Nummer 2: Richtlinien.

Was zu tun ist, steht in den WCAG(öffnet in einem neuem Fenster) . Manchmal wird WCAG auch “wacag” ausgesprochen. Sie müssen die WCAG Level AA einhalten, sofern Ihnen niemand etwas anderes sagt. Dies ist die mittlere Ebene in den Richtlinien. Es gibt drei Stufen: einfach, AA und AAA.

Nummer 3: ARIA

Das steht für Accessible Rich Internet Applications(öffnet in einem neuem Fenster) . Für dynamische Inhalte und benutzerdefinierte UI-Komponenten brauchen Sie Techniken aus einer anderen Spezifikation, die ARIA heißt. ARIA ist wichtig für Dialoge, Navigationsmenüs und alles, was wie eine Anwendung aussieht. Im Gegensatz zu allem, was wie ein Dokument aussieht.

Nummer 4: Barrierefreiheit sollte von Anfang an mitgedacht werden, nicht erst, wenn alles fertig ist.

Wenn man erst am Ende die Barrierefreiheit testet, ist es zu spät. Man kann es zwar noch reparieren, aber es kostet Zeit.

Nummer 5: Verwenden Sie Tools, mit denen Sie die Barrierefreiheit prüfen können.

Dazu gehört auch die Axe-Werkzeugfamilie von Deque, zum Beispiel die Axe Dev Tools Browsererweiterung. Sie sollten diese Tools auf jeden Fall verwenden. Sie sparen Zeit und Mühe und lernen etwas über Barrierefreiheit. Und Sie können die empfohlenen Korrekturen für die Probleme, die von diesen Tools gefunden werden, umsetzen.

Nummer 6: Auch wenn ich gerade gesagt habe, dass Sie automatisierte Werkzeuge verwenden sollten, müssen Sie wissen, dass das nicht genug ist.

Automatisierte Tools finden nicht alle Probleme. Jemand, der sich mit Barrierefreiheit auskennt, muss das Ganze noch einmal überprüfen, auch wenn die Tools keine Fehler anzeigen.

Nummer 7: Tastatur

Die Tastatur muss einwandfrei funktionieren. Viele Menschen mit Behinderung nutzen eine Tastatur. Sie können keine Maus verwenden. Es gibt auch andere Gründe, warum sie eine Tastatur nutzen. Die Umsetzung der Tastaturzugänglichkeit ist einfach. Bei dynamischen Inhalten und benutzerdefinierten UI-Komponenten kann es kniffliger werden.

Nummer 8: Textalternativen

Jede Information, die man sehen kann, muss auch in Textform vorhanden sein. So können auch Menschen, die nicht sehen können, diese Informationen verstehen.

Nummer 9: Untertitel und Transkripte

Alle wichtigen Teile des Audiomaterials wie zum Beispiel Dialoge oder Geräusche müssen in Textform erklärt werden. Das kann man mit Untertiteln oder mit Transkripten machen.

Nummer 10: Screenreader

Testen Sie die Webseite mit einem Screenreader. Wenn ein echter Nutzer eines Screenreaders es testet, ist das super. Mach das. Entwickler sollten aber nicht alle Tests anderen überlassen. Je öfter ein Entwickler einen Screenreader verwendet, desto besser. Screenreader sind Softwareprogramme, die Text in Sprache umwandeln. Sie sagen dem Benutzer auch, welche Elemente auf einer Webseite gemeint sind. Zum Beispiel “Grafik”, “Tabelle” oder “Überschrift”. Oder “Link”. Screenreader haben viele Funktionen. Sie haben Tastenkombinationen, mit denen man sich durch Webinhalte klicken kann. Man kann auch durch Überschriften oder Datentabellen navigieren.

Nummer 11: Der Zugänglichkeitsbaum

Browser haben einen Zugänglichkeitsbaum. Sie tun das, ohne dass Sie es wissen. Assistive Technologien können viel. Sie können zum Beispiel nur Text vermitteln. Der Barrierefreiheitsbaum ermöglicht es, mit Screenreadern zu arbeiten. Auch andere Programme können damit arbeiten. Sie können dann zum Beispiel Überschriften, Orientierungspunkte, Bilder und Links anzeigen. Wenn ein Screenreader eingeschaltet ist, können Nutzer nach diesen Elementen navigieren. Der Zugänglichkeitsbaum lässt sich ganz einfach in den Entwicklertools des Firefox-Browsers anzeigen. Wenn Sie eine Maus verwenden, können Sie mit einem Rechtsklick das Element auswählen und dann auf “Barrierefreiheitseigenschaften prüfen” klicken. Oder drücken Sie auf einer Mac-Tastatur die Tasten “Option + Befehl + I” und gehen Sie dann zur Registerkarte “Barrierefreiheit”. Bei Windows geht das auch mit Strg + Shift + I und der gleichen Registerkarte. Im Barrierefreiheitsbaum sehen Sie zum Beispiel den Namen und den Wert des Elements. Das sind die Dinge, die für Screenreader und andere Hilfsmittel zugänglich gemacht werden können.

Nummer 12: Mobile Bildschirmlesegeräte

Screenreader auf mobilen Geräten sind ähnlich, aber nicht gleich. Es lohnt sich, sie auf Desktop- oder Laptop-Geräten zu testen. Auch auf mobilen Geräten kann mit einem eingeschalteten Screenreader gearbeitet werden.

Nummer 13: Farbkontrast

Wählen Sie Farben für Text und UI aus. Die Farben sollten sich vom Hintergrund abheben.

Nummer 14: Techniken zur Barrierefreiheit.

Die kann man schnell lernen. Das ist das Ziel dieses Kurses.

Nummer 15: Barrierefreiheit ist nicht einfach.

Barrierefreiheit muss man lernen. Das dauert Jahre. Auch wenn die Grundlagen einfach sind, denken Sie daran: Es ist nicht einfach, Barrierefreiheit umzusetzen.

Nummer 16: Barrierefreiheit ist wichtig für alle Menschen.

Wir betreiben Barrierefreiheit, damit niemand ausgeschlossen wird und alle alltägliche Aufgaben im Web erledigen können. Das sind die wichtigsten Punkte. Ist das schon alles? Es gibt noch viel mehr, aber wenn Sie diese Dinge im Hinterkopf behalten, sind Sie auf dem besten Weg, Barrierefreiheit zu einem wichtigen Teil der Entwicklung zu machen.