Im Rahmen unserers Themenschwerpunkts widmen wir uns in diesem Bericht der Barrierefreiheit im Webportal. Zum Einstieg stellen wir uns folgende Frage:
Warum ist Barrierefreiheit überhaupt erstrebenswert?
Über eine Millionen Menschen in Deutschland sind aktuell aufgrund einer Einschränkung nicht in der Lage, Inhalte im Internet auf die übliche Art und Weise zu benutzen. Die Art der Einschränkung kann dabei ganz unterschiedlich sein:
- Einschränkung des Sehens (z. B. Blindheit, Sehschwäche, Farbsehschwächen)
- Einschränkung des Hörens (z. B. Taubheit)
- Einschränkung im Verständnis (z. B. geringe Kompetenz in der deutschen Sprache)
- Einschränkungen in der Motorik (z. B. fehlende Gliedmaßen, körperliche Beeinträchtigungen)
- Technische Einschränkungen (z. B. Mobile Endgeräte, langsame Internetverbindung, starke Reflektionen durch Sonnenlicht)
Diese Einschränkungen können dauerhaft sein, aber auch temporär wie bei gebrochenen Gliedmaßen oder Infektionen, die das Wahrnehmungsvermögen beeinträchtigen. Manche entwickeln sich auch im Laufe der Zeit. Von diesen sind vor allem Senioren betroffen.
Barrierefreiheit macht Webanwendungen für Menschen mit Beeinträchtigungen zugänglich. Aber darüber hinaus kann sie die Benutzererfahrung für alle Nutzer erheblich verbessern. Durch leicht verständliche Inhalte und Benutzerführung werden mehr Menschen angesprochen. So profitiert auch der Betreiber der Webanwendung durch eine höhere Reichweite. Es wird zudem soziale Verantwortung gezeigt, was zu einem positiveren Markenimage führt. Auch die Gefahr von Beschwerden oder Klagen ist geringer.
Das Thema Barrierefreiheit ist also für alle Teilnehmer des World Wide Web relevant. Der demographische Wandel wird in den kommenden Jahren voraussichtlich noch mehr dafür sorgen, dass es gilt, diese zu berücksichtigen.
Für einige Anbieter ist die Einhaltung von Barrierefreiheit sogar verpflichtend. Dies betrifft vor allem den öffentlichen Sektor, aber auch Organisationen, die Aufgaben im Allgemeininteresse durchführen wie staatlich geförderte Kulturanbieter oder Krankenkassen. Gemäß EU-Richtlinie 2016/2102 mussten alle Webseiten, mobile Applikationen, Dateien und offizielle Onlinedokumente des öffentlichen Sektors spätestens seit September 2020 barrierefrei sein.
Wie wird der eigene Webinhalt barrierefrei?
Bei dieser Frage geht es generell um zwei Aspekte: Zum einen sollten die vorhandenen Anwendungen, Funktionen und Anlaufpunkte möglichst einfach erreicht und genutzt werden können. Für Nutzerinnen und Nutzer ist es wünschenswert, dass leicht zu verstehen ist, was zur Verfügung steht und vor allem wie es genutzt wird und wofür. Zum anderen wird die darunter liegende Anwendung und damit einhergehende Funktionen im Allgemeinen anhand von den folgenden vier Prinzipien betrachtet:
Wahrnehmbar: Jedes Element jeder Webanwendung sollte von jedem Besucher wahrgenommen werden können. Das bedeutet, dass der Inhalt in verschiedenen Formaten zur Verfügung stehen sollte wie Untertitel für Videos oder Beschreibungen von Bildern. Alle Medien sollten durch Alternativtexte repräsentiert werden können.
Bedienbar: Dem Nutzer sollte genügend Zeit gegeben werden, den Inhalt zu lesen oder damit zu interagieren. Blitzlichter und Bewegungselemente sollten so eingesetzt werden, dass sie nicht ablenken oder sogar dem Nutzer schaden.
Verständlich: Textinhalte sollten leicht verständlich und lesbar sein. Inhalte und Komponenten sollten vorhersehbar funktionieren und die Navigation konsistent sein.
Robust: Die Webanwendung sollte kompatibel mit den verschiedensten Browsern sein. Der Inhalt sollte unabhängig von der verwendeten Technologie – Maus, Tastatur, Joystick, Touch, Spracheingabe etc. – nutzbar sein.
Welche Standards gibt es und wie erfolgt die Überprüfung?
Sollten Sie zur Barrierefreiheit verpflichtet sein, so gelten für Sie weiterführende Anforderungen. Der Gesetzgeber stellt hierfür keinen konkreten Standard zur Verfügung. Er stützt sich vielmehr in der „Barrierefreien Informationstechnik-Verordnung“ (BITV und BITV2.0) auf die „Web Content Accessibility Guideline“ (WCAG). Dieser weltweite Standard gilt für alle auf der Entwicklerseite beteiligten Interessengruppen. Die WCAG-Richtlinien sind in drei Kategorien eingeteilt:
- A: deckt grundlegende Anforderungen ab (verpflichtend für den öffentlichen Sektor)
- AA: größte Zugangsbarrieren sind beseitigt (verpflichtend für den öffentlichen Sektor)
- AAA: ohne Einschränkung barrierefrei (nicht verpflichtend für den öffentlichen Sektor)
Verschiedene Tools geben Auskunft darüber, wie die eigene Webanwendung im Hinblick auf Barrierefreiheit aufgestellt ist, z. B.
- Wave – ein Online Evaluationstool, das bei Eingabe der URL visuelles Feedback gibt,
- Lighthouse – ist fester Bestandteil des Google Chrome Browser und ermöglicht einen „Accessibility“ Test,
- die BITV Checkliste – wurde vom Bundesministerium für Arbeit und Soziales entwickelt und dient als Selbsttest (erfordert für die Überprüfung technisches Knowhow)
- der Color-Contrast-Analyzer – überprüft eine Webanwendung auf Farbkontrastprobleme.
Was muss bei der Umsetzung von Barrierefreiheit beachtet werden?
Bei der Umsetzung von Barrierefreiheit sind zwei Aspekte zu berücksichtigen:
1. der reine Inhalt des Webportals
2. die technische Aufbereitung und Darstellung der Inhalte.
Beim Inhalt Ihrer Webanwendung sollten Sie darauf achten, dass diese für jeden zugänglich gemacht wird. Das bedeutet, der Inhalt sollte klar verständlich sein. Wenn möglich sollte es nicht zu viele Fachausdrücke geben. Auf Abkürzungen und komplizierte Satzstellungen sollte verzichtet werden. Nutzen Sie Überschriften und Absätze, um den Inhalt zu gliedern. Auch das Bereitstellen von Medienalternativen gehört zu den inhaltlichen Aufgaben.
Für die technische Aufbereitung ist Expertenwissen aus den Bereich Entwicklung notwendig. Hier sind bestimmte Anforderungen zu beachten, damit die Anwendung für jeden nutzbar ist. Dazu zählt beispielsweise, dass sie nicht nur per Maus, sondern auch über die Tastatur bedienbar ist.
Screenreader müssen in der Lage sein, Seiteninhalte und Komponenten für die akustische oder taktile Ausgabe richtig zu interpretieren. Die Interpretation einer Webseite erfolgt dabei aufgrund der Seitenstruktur, nicht anhand der visuellen Repräsentation. Daher sollte sie sowohl visuell wie auch strukturell die gleiche Lesereihenfolge aufweisen. Auch die Beschriftung von Komponenten durch Bezeichner (Label) und das Zuweisen von Rollen ist wichtig. So kann der Nutzer von Screenreadern die Funktionalität der einzelnen Seitenkomponenten erkennen. Als „good practice“ wird möglichst auf die nativen HTML Elemente zurückgegriffen. Diese sichern Tastaturbedienbarkeit bereits zu und bringen assoziierte Label oder Rollen mit sich.
Oft werden jedoch sehr individuelle Lösungen benötigt. Für solche Fälle hat eine Arbeitsgruppe des World Wide Web Consortium spezielle Produkte, die WAI-ARIA-Attribute, entwickelt. WAI-ARIA (oft kurz ARIA) enthält Attribute, mit denen die Semantik von HTML ergänzt werden kann. So ist es mithilfe von ARIA-Attributen möglich, Rollen zuzuweisen, Elemente vor einem Screenreader zu verstecken, Statusmeldungen zu koordinieren oder Zustände zu übermitteln.
Unterstützung durch grafische Bibliotheken?
Allen Anforderungen gerecht zu werden, das erfordert Expertenwissen und manchmal auch viel manuelle Arbeit. Die gute Nachricht: Durch grafische Bibliotheken – sogenannte UI Frameworks – kann der Aufwand für die Programmierung der grafischen Benutzeroberfläche (GUI) reduziert werden. Sie decken bereits einige der Anforderungen an Barrierefreiheit ab. Daher ist es inzwischen gängige Praxis, bei der Entwicklung einer Webanwendung auf fertige Komponenten und Funktionalitäten dieser Bibliotheken zurückzugreifen.
Im Rahmen der Studie „The WebAIM Million“ wurde die Barrierefreiheit von einer Millionen Webseiten getestet. 98,1 % dieser Seiten hatten große Zugänglichkeitsprobleme. Es gibt jedoch auch Frameworks, die weniger Zugänglichkeitsprobleme aufweisen als der Durchschnitt. Hierzu gehört u. a. Angular. Angular ist eines der beliebtesten JavaScript Frameworks. Es wird – neben anderen Technologien – auch bei OVSoftware in vielen Projekten eingesetzt.
Um herauszufinden, wie weit die Abdeckung der Barrierefreiheit mit Hilfe von Bibliotheken geleistet werden kann, haben wir bei OVSoftware aufgrund dessen Bibliotheken verschiedener Anbieter untersucht, die sich für Projekte mit Angular eignen. Getestet im Hinblick auf Barrierefreiheit wurden gut bekannte Bibliotheken wie Angular Material und Angular Bootstrap, aber auch solche, die speziell mit Barrierefreiheit werben, wie Clarity, Carbon Design System oder PrimeNG.
Das Ergebnis: Keine der genannten Bibliotheken bietet Barrierefreiheit ohne Einschränkungen. Aber es hat sich gezeigt, dass es dennoch lohnend sein kann, auf diese zurückzugreifen. Einige Komponenten konnten als barrierefrei klassifiziert werden. Zudem bieten die Frameworks teilweise auch Funktionalitäten, die dem Entwickler die Umsetzung von Barrierefreiheit erleichtern. So werden Farbpaletten angeboten, die bereits auf ausreichende Kontraste geprüft wurden, oder ein anpassbares Fokusmanagement.
Angular kann als Bestandteil des Webportals für die Entwicklung genutzt werden. Aufgrund der individuellen Anforderungen ist jedoch davon auszugehen, dass theoretisch eine Vielzahl an Lösungsansätzen in Betracht gezogen werden könnten.
Abschließend lässt sich festhalten, dass es bei der Umsetzung von Barrierefreiheit viel zu beachten gilt. Egal ob verpflichtend oder nicht: Barrierefreiheit umzusetzen lohnt sich. Sie erhöht die Reichweite und die Bedürfnisse vieler Nutzer werden berücksichtigt.
Abschließend lässt sich festhalten, dass es bei der Umsetzung von Barrierefreiheit viel zu beachten gilt. Egal ob verpflichtend oder nicht: Barrierefreiheit umzusetzen lohnt sich. Sie erhöht die Reichweite und die Bedürfnisse vieler Nutzer werden berücksichtigt.
| OVFOKUS |
Webportal Entwicklung
Weitere Beiträge aus dieser Reihe:
Teil 1: Ein Überblick
Die Beiträge in dieser OVFOKUS Reihe widmen sich dem Thema Webportal Entwicklung: Was muss ich beachten? Welche Aspekte sind wichtig? Dieser erste Teil liefert einen Überblick – von Hosting über Zugang bis zu Sicherheit und Intergration.
Teil 3: Webportal-Hosting
Cloud oder On-Premises? Virtual Machines, Container oder Bare Metal? Cluster oder Single Node? Welche Hosting-Option passt zu mir? Antworten auf diese Fragen finden Sie hier.
Teil 4: Usability
Effektivität, Effizienz, Zufriedenheit – daran wird Usability gemessen. Aber wie wird mein Webportal „gebrauchstauglich“? Hier erfahren Sie mehr zu Standards, Methoden und Tests.
Teil 5: Prozesse – Analyse und Optimierung
Prozesse analysieren und optimieren, das ist der Weg zu einem effizienten, prozessbasierten Webportal. Aber – Anwendernutzen nicht vergessen! Mehr dazu in diesem Beitrag.
Teil 6: Identity and Access Management – IAM
Welche Funktionen braucht mein IAM? Muss ich für eine sichere Lösung Security Experte sein? Was leisten externe Lösungen? Mehr zur Identititäts- und Zugriffsverwaltung erfahren Sie hier!
Haben Sie Anmerkungen, IDEEN oder Fragen zu diesem Thema? Oder möchten Sie sich einfach und unverbindlich mit uns austauschen?
Sprechen Sie uns an! Wir unterstützen Sie gern auf dem Weg zur Barrierefreiheit.