Zum Inhalt springenZur Suche springen

HHU Intern Detail

Tipps für barrierearme Webseiten und Dokumente
Licht im Dunkeln

Spät abends, das Licht im Treppenhaus ist kaputt, die Stufen sind unterschiedlich breit und hoch: Wer sich hier zurechtfinden möchte, braucht nützliche Werkzeuge, am besten eine Taschenlampe. Barrierearme Webseiten und Dokumente funktionieren ähnlich; sie erleichtern die Nutzung nicht nur für Menschen mit visuellen Einschränkungen. Auch Ältere und weniger erfahrene User finden so alle Informationen, die sie brauchen. Einige Tipps.

Blick auf eine schwarze Tastatur mit Brailleschrift Zoom

Menschen mit Seheinschränkungen hilft es sehr, wenn Webseiten und Dokumente barrierearm gestaltet sind.

Bei Webseiten sollten Farben und Schriften so gewählt werden, dass sie einen guten Kontrast ermöglichen, da manche Menschen Farben nicht oder anders wahrnehmen. Alle Bilder, Grafiken und Tabellen bekommen einen Alternativtext, der beschreibt, was sie zeigen – dieser wird von speziellen Programmen vorgelesen. Multimedia-Elemente, also Videos und Audios, erhalten immer eine zusätzliche Inhaltsbeschreibung sowie Untertitel: So haben auch Seh- oder Hörbeeinträchtigte etwas davon. Weiterführende Links lassen sich aussagekräftig gestalten, also „Link zur Anmeldung“ anstelle von „hier“.

Auch die verlinkten Dateien für Word, PowerPoint oder PDF-Programme sollten barrierefrei sein, z.B. mit Kapitelüberschriften, die für die Sprachausgabe lesbar sind. Verschiedene Werkzeuge, etwa von Adobe oder Microsoft Word, machen das Erstellen solcher Dateien leicht.

Checkliste für Webseiten
•    Worum geht es? Titel und Bezeichnungen, auch von Unterseiten, kurz und klar formulieren und leicht erkennbar machen.
•    Wie ist die Seite aufgebaut? Eine deutliche Struktur hilft: Im Contentmanagementsystem Überschrift, Vorspann, Absatz, Liste oder Tabelle immer eindeutig anlegen und die Überschriftenhierarchien (H1, H2, H3 usw.) beachten. 
•    Wo findet sich was? Inhalte sollten leicht zu finden sein. Es hilft, die Seite logisch und möglichst übersichtlich aufzubauen, so kann man auch bei Vergrößerung den Überblick behalten. Zudem ein einheitliches Menü, das auf jeder Seite gleich ist.
•    Womit wird gesurft? Responsives Design ist der Standard, das heißt, das Layout passt sich verschiedenen Endgeräten an. Auch sollte die Website mit der Maus und ebenso mit der Tastatur bedienbar sein.
•    Was ist wesentlich? Weniger Text, kurze Seiten sind das Credo – dann wird auch mehr davon wahrgenommen.
•    Was ist gemeint? Einfache Sprache macht die Inhalte verständlicher. Fachbegriffe und Abkürzungen sollten erklärt werden.
•    Wo erfährt man mehr? Kontaktpersonen, das Impressum oder der Weg zurück zur Hauptseite gehören an zentrale Stellen.

Tipps für barrierearme PDFs
Am wichtigsten ist, dass bei beim Portable Document Format (PDF) alle Inhalte korrekt ausgezeichnet sind – insbesondere Überschriften, Auflistungen, Absätze, Tabellen. So wird der Titel des Dokuments in der Titelleiste des Adobe Reader angezeigt, nicht der Dateiname, der aber auch selbsterklärend sein sollte. Auch Grafiken bekommen eine alternative Beschreibung. Zu nicht-inhaltstragenden Elementen werden beispielsweise Kopf- oder Fußzeilen gezählt. Sie sind als Artefakt gekennzeichnet und somit für die Auslesetechnik unsichtbar. Beim Erstellen ist generell darauf zu achten, dass der Zugriff durch assistive Technologien sowie das Kopieren von Text erlaubt wird.

In den Dokumenteigenschaften sind Metadaten hinterlegt, auch die Dokumentensprache(n). Alle Elemente erscheinen in einer logischen Lese-Reihenfolge. Links und Überschriften sind erklärend, also allein aus dem Überschriftentext bzw. der verlinkten Stelle sind Schlüsse auf den folgenden Inhalt bzw. die verlinkte Stelle möglich. Bei längeren Dokumenten helfen Lesezeichen oder ein verlinktes Inhaltsverzeichnis.

Ist ein Text kleiner als 18 pt oder 14 pt fett hat er idealerweise einen Mindestkontrast von 4,5:1. Größerer Text sowie grafische Bedienelemente haben einen Kontrast von 3:1. Informationen – etwa in Diagrammen – werden nicht ausschließlich über Farbe oder farbliche Veränderung kommuniziert.

Hinweise für Formulare
Formulare haben beschriftete Elemente und sind einfach am Monitor auszufüllen: vollständig, in einer logischen Reihenfolge und über die Tastatur – insbesondere über die Tabtaste. Pflichtfelder und fehlerhafte Einträge sind eindeutig erkennbar.

Zusätzlich zu diesen Rahmenbedingungen gibt es natürlich noch weitere Feinheiten. Es ist bedeutsam, sich die Thematik bewusst zu machen und sie Schritt für Schritt im Arbeitsalltag umzusetzen. Einige Instrumente helfe dabei, Dokumente auf ihre barrierearmen Eigenschaften zu testen, etwa der PDF Accessibility Checker (PAC).

Ein Hinweis zu Filmen und Serien: Für Einstellungen, bei denen gerade niemand spricht, gibt es die Audiodeskription, eine akustische Bildbeschreibung. Sie läuft auf einer zweiten Tonspur, wo eine Stimme erklärt, was gerade zu sehen ist.

Unterstützung bieten u.a. die Beratungsstelle für Studierende mit Behinderung oder chronischer Erkrankung (BBST), E-Mail: oder die Schwerbehindertenvertretung (SBV), E-Mail: .

Lehrende können das Service-Center für gutes Lehren und Lernen (SeLL) ansprechen, das einen Guide für barrierearme Webseiten veröffentlicht hat. 

Weitere Informationen

Autor/in: Redaktion/KK
Kategorie/n: INTRANET News, hhu-intern, Barrierefreiheit
Verantwortlichkeit: