Grundlagen für barrierefreie Webseiten

Auch sehr viele Menschen mit körperlichen Einschränkungen sind im WWW unterwegs. Für sie gilt es Webseiten zu erstellen, die sie mit ihren Möglichkeiten lesen und bedienen können. Wir zeigen die wichtigsten Grundlagen für barrierefreie Webseiten auf.

Es sind sehr viel mehr Menschen mit Sehbehinderungen oder anderen Einschränkungen im Internet (hier nur WWW für World Wide Web genannt) unterwegs als Sie denken. Auch Menschen mit motorischen Einschränkungen oder Konzentrationsschwäche und Nicht-Muttersprachler profitieren von einem barrierefreien WWW. Menschen mit Einschränkungen nutzen das Internet meist über­durchschnittlich oft. Viele davon übrigens auch beruflich, wie der Autor weiß! Sie benötigen jedoch einen barrierefreien Zugang. Für sie gilt es Webseiten zu erstellen, auf die sie einen Zugriff haben. Also die Seiten lesen und mit ihnen interaktiv agieren zu können.

Um Websites so zu erstellen, dass Menschen mit Einschränkungen aktiven Zugriff darauf haben, muss man zunächst wissen, welcher Hilfsmittel sie sich bedienen.

Zugang für eingeschränkte Menschen

Selbst ältere Betriebssysteme bringen Voraussetzungen für eine barrierefreie Nutzung des Computers von Haus aus mit. Darunter befindet sich ein sehr häufig benutztes Mittel, um auf Webseiten zugreifen zu können: Bildschirmleser, auch Screenreader genannt. Seit nicht allzu langer Zeit bieten selbst Browser die Möglichkeit, sich eine Webseite vorlesen zu lassen. Sie allein bieten allerdings keine interaktiven Möglichkeiten.

Zusätzlich gibt es auf die Art der Einschränkung spezialisierte Programme zur Installation, die bessere Möglichkeiten der Konfiguration anbieten als das Betriebssystem. Außerdem können die Tastatursteuerung oder gar die Nutzung von Joysticks sowie die Möglichkeit der Ausgabe in Braille-Schrift zur Anwendung kommen.

Die Richtlinien des W3C für barrierefreie Webseiten

Bereits seit 2008 gibt das von Tim Berners-Lee geführte World Wide Web Consortium (W3C) Richtlinien dafür heraus, wie Sie Webseiten so erstellen, dass diese barrierefrei sind. Inzwischen ist ein umfang­reicher Katalog dafür entstanden. Er richtet sich sowohl an Profis als auch an Amateure – sofern sie gut englisch sprechen! Zahlreiche weitere Anleitungen finden Sie im WWW, so beispielsweise auch bei der „Aktion Mensch“. Letztere bietet übrigens auch Tests, mit denen Sie Ihre Seiten auf verschiedene Möglichkeiten des Zugangs prüfen können. (Siehe hierzu den Abschnitt „Verweise“ ganz unten!)

Grundlagen für barrierefreie Webseiten

Wir fassen hier einige der wichtigsten Grundlagen für die Erstellung barrierefreier Webseiten zusammen.

Wahl der Schriften und der Kontrast

Die grundlegendsten Mittel Webseiten barrierefrei zu erstellen, sind die Wahl der verwendeten Schriften und des Kontrastes. Verwenden Sie gut lesbare Schriften nicht zu kleinen Schriftgrads und einen hohen Kontrast zwischen Schrift und Hintergrund! Das Blog „Sackmühle“ zeigt ein gutes Beispiel dafür, wie Schrift durch zu wenig Kontrast unleserlich wird: „Unleserliche Schrift“.

Dies gilt insbesondere auch für die Seitennavigation über Links. Diese sollten sich typografisch deutlich von Nicht-Navigations-Elementen unterscheiden! Verwenden Sie also beispielsweise keine Unterstreichungen im Text, es sie denn, dass sich darunter auch tatsächlich ein Verweis befindet!

Verwendung von Farben

Im Hinblick auf den Kontrast haben wir es bereits angesprochen, dass dieser möglichst hoch sein sollte. Eine schwarze Schrift auf hellem oder gar weißem Grund ist immer noch am besten zu lesen. Das heißt aber nicht, dass Sie auf Farben verzichten müssen. Beachten Sie hierbei jedoch, dass es zwar relativ wenige Menschen mit einer völligen Farbenblindheit gibt, dafür aber relativ viele mit einer Rot-Grün-Sehschwäche bzw. -Blindheit oder einer Gelb-Blau-Sehschwäche bzw. -Blindheit!

Alternativtext bei Bildern und Grafiken

Webseiten kommen heutzutage kaum noch ohne Bilder oder Grafiken aus. Erstellen Sie gleich schon vor dem Hochladen solcher Formate einen Alternativtext, kurz Alt-Text nach dem HTML-Code alt und /alt zum Schließen des tags, jeweils in eckigen Klammern! Ein solcher Alt-Text sollte im besten Fall eine kurze Beschreibung des Inhalts der Medien beinhalten.

Hiervon profitieren übrigens auch nicht-eingeschränkte Nutzer/-innen. Der Alternativtext erscheint nämlich auch schon dann, wenn sich beispielsweise durch eine schlechte Internet­verbindung das Laden der Bilder verzögert!

Kein Text in Bildern!

Ganz wichtig bei der Einbindung von Bildern: Vermeiden Sie Text in Bildern! Bildschirmleser können diese nämlich nicht erkennen und lesen! Die auf vielen Websites oder auch in Netzwerken gesehenen und beliebten Sprüche oder (angeblichen) Zitate bekannter Persön­lichkeiten, die dort mittels eines Bildes eingestellt werden, sind für blinde und sehbehinderte Menschen nicht zu entziffern.

Aufbau und Struktur der Webseite

Weiterhin wichtig sind die Struktur und der Aufbau der Webseite. Gehen Sie beispielsweise in der Reihenfolge der Überschriften in der Reihenfolge von h1, der Hauptüberschrift, über h2 bis hin zu h6 vor. Verschachteln Sie Überschriften also korrekt und überspringen Sie hierbei keine, also etwa von einer h1 gleich auf h3, denn Bildschirmleser geraten so durcheinander!

Navigation innerhalb der Website

Weiterhin wichtig ist eine möglichst gute Trennung zwischen der Navigation und dem eigentlichen Inhalt einer Website! Hierzu gehört auch, dass Link-Texte klar anzeigen, wohin sie führen. Ein solcher wie hier gehts lang ist im Hinblick auf Barrierefreiheit wenig hilfreich! Hingegen stellt, wie auch bei Bildern oder Grafiken, eine klare und eindeutige Namensgebung eine echte Hilfe dar.

Einfache Sprache

Die verwendete Sprache sollte möglichst einfach sein. Dies hat nicht unbedingt etwas mit Leichter oder Einfacher Sprache zu tun, wenn­gleich diese durchaus hilfreich sein können. Kurze Sätze, einfacher Satzbau und ein weitgehender Verzicht auf Fremdwörter bieten auch vielen Nicht-Behinderten einen echten Nutzen!

Einbindung von Formularen

Betreiben Sie eine Website, auf der berufliche Leistungen oder Bestellungen angefordert werden können, oder ein Weblog mit einer Kommentarfunktion, so ist die Einbindung von Formularen unerläss­lich. Achten Sie hierbei darauf, dass die einzelnen Eingabe­felder aussagekräftig benannt sind! Auch dies stellt für Nicht-Behinderte einen Mehrwert dar.

Einbindung vom PDFs

Die Frage, ob die Idee der Einbindung von PDF- oder gar von Office-Dateien eine gute ist, stellt sich nicht nur bei der Gestaltung von barrierefreien Webseiten. Zumal solche Dokumente selbst inhaltlich und strukturell im Hinblick auf Barrierefreiheit geprüft werden müssen! Eine separate Webseite für die Inhalte solcher Dokumente könnte eine geeignetere Wahl sein.

Einbindung von Video- und Audio-Dateien

Neben Bildern und Grafiken finden inzwischen häufig Videos und Audio-Dateien Verwendung. Binden Sie diese so ein, dass Autoplay abgestellt ist, diese also nicht sofort zu spielen beginnen! Browser wie Firefox haben diese Funktion zum Glück zwar seit Kurzem standardmäßig deaktiviert, aber Sie können sich nicht darauf verlassen, dass dieser von allen benutzt wird.

Fazit

Wer diese Grundlagen für barrierefreie Webseiten beherzigt, schließt behinderte Menschen nicht von der Nutzung des WWW aus. Viele dieser Tipps sollten heutzutage allerdings Standard für die Erstellung von Websites allgemein sein!

Haben Sie weitere Vorschläge oder Hinweise, melden Sie sich gern über einen Kommentar!

Weitere Verweise

• Aktion Mensch: Barrierefreiheit für Websites
• Aktion Mensch: Barrierefreiheit Umsetzen – Einfach für Alle
• Dr. Web: Design für Alle: Fünf Richtlinien für barrierearme Websites
• Wikipedia: Barrierefreies Internet
• W3C.org: Web Content Accessibility Guidelines (WCAG) 2.0 (englisch)
• Zur Gechichte des Internets und das ersten Browsers: Ronalds Notizen: Ich bin drin!