[Random 7] Barrierefrei(er) bloggen

In letzter Zeit habe ich ja gelegentlich das Thema digitale Barrierefreiheit angesprochen. Ich muss zugeben, mir bis Anfang des Jahres herzlich wenig Gedanken darum gemacht zu haben. Erst über ein Webinar und die nachfolgenden Versuche, die E-Learning-Angebote auf der Arbeit barriereärmer zu gestalten, habe ich mir langsam ein Grundwissen bzw. überhaupt eine Sensibilisierung für das Thema angeeignet. Das Ding ist: Mir fehlt es immer noch viel an Detailwissen, und gerade wenn es an Webdesign im Sinne von HTML und Co. geht, bin ich ziemlich überfordert.

Aber mir sind auch einige Aspekte begegnet, die sich leicht umsetzen lassen und den Blog in technischer Hinsicht schon einmal deutlich barriereärmer machen – wenn man denn daran denkt bzw. ihre Funktion kennt. Ein paar dieser Punkte stelle ich im Folgenden vor. Sie sind nur ein Anfang, und wenn jemand ergänzen oder korrigieren möchte (hmm, Blogparade?) – sehr gern.

Als Quellen dienen mir im Wesentlichen die Web Content Accessibility Guidelines (WCAG 2.0) und die daran angelehnte Barrierefreie Informationstechnik-Verordnung (BITV 2.0). Fundierte Anlaufstellen für das Thema sind zudem die Websites Barrierefreies-Webdesign und Einfach für alle von Aktion Mensch.

(1) Formatvorlagen nutzen

Eine Überschrift z. B. durch Fettschrift oder eine höhere Schriftgröße zu kennzeichnen, ist beliebt und eröffnet einem mehr Gestaltungsmöglichkeiten. Allerdings wird eine Überschrift dann als solche nicht von Screenreadern erkannt – ebenso wenig wie Links oder Aufzählungen, die nicht entsprechend gekennzeichnet sind oder Zitate, die z. B. lediglich kursiv gesetzt sind. Besser ist es deshalb, wenn die vorhandenen Formatvorlagen zu nutzen oder Überschriften und Co. manuell via HTML zu definieren.

(2) Alternativtexte und Audiotranskriptionen

Die allermeisten Programme bieten inzwischen Funktionen, um Bilder oder andere Grafiken mit Alternativtexten zu hinterlegen. Hier gebt ihr nach dem Grundsatz „so wenig wie möglich, so viel wie nötig“, die Informationen und Inhalte des jeweiligen Elements wieder. Dabei ist es nicht nötig, jeden Baum zu beschreiben, es sollte aber umrissen werden, was grundsätzlich zu sehen oder zu lesen ist. Diese Alternativtexte können von Screenreadern ausgelesen werden – anders als beispielsweise Text auf Bildelementen wie eingescannten Flyern oder Screenshots.

Mit Alternativtexten können also Menschen mit Sehbehinderung die jeweiligen Informationen aus den visuellen Medien via Screenreader erhalten. Ebenso braucht es bei Audio-Medien eine Alternative für Menschen mit Hörbehinderung. Wenn ihr auf eurem Blog beispielsweise Audio-Interviews nutzt, ladet am besten auch eine Audio-Transkription, also eine Textvariante des Interviews hoch. Es gibt einige Tools, die die Transkription vereinfachen, beispielsweise die „Automatische Transkription“ von Google. Allerdings sollte bei der Nutzung ggf. der Datenschutz beachtet werden nach der Transkription noch einmal drüber korrigiert werden. Für Videos kann man ebenfalls Transkriptionen bereitstellen oder sie untertiteln. Automatisch geht das beispielsweise mithilfe von YouTube, aber auch hier – hinterher noch mal drüber korrigieren und den Datenschutz beachten. Ideal ist es, wenn ihr die Untertitel-Richtlinien beachtet, die unter Untertitelrichtlinien.de gesammelt sind (allerdings ist die letzte Aktualisierung dort sechs Jahre alt und selbst Netflix und Co. orientieren sich glaube ich nicht daran …).

Übrigens sind Alternativtexte und Audio-Transkriptionen auch dann nützlich, wenn bei einem User die Bandbreite nicht mitspielt, ein Player das Interview nicht abspielt oder jemand einfach lieber Interviews liest anstatt sie zu hören. Alternativangebote sind also generell eine sinnvolle Sache. ;-)

(3) Kontrastreiche und simple Farbwahl

Auf meinem vorherigen Blog hatte ich einen giftgrünen Hintergrund. Fand ich damals stylisch, viele Leser empfanden es aber als unangenehm. Barriereärmer sind simple Töne mit hohem Kontrast. Ideal ist ganz klassisch: Schwarzer Text auf weißem Hintergrund. Wilde Farbwechsel, beispielsweise auch in GIFs, sollten komplett vermieden werden.

Rot-Grün-Kombinationen sollten ebenso vermieden werden, sofern die Farbwahl für das Verständnis essentiell ist.

(4) Textausrichtung

Persönlich habe ich eine ästhetische Schwäche für Blocksatz, allerdings gilt dieser bei Online-Medien – anders als im Print – als barriereärmer gegenüber dem linksbündigem Flattersatz. Mir fällt auch selbst beim Lesen auf, dass mir gerade bei längeren Absätzen die Orientierung leichter fällt, wenn Flattersatz verwendet wurde.

(5) Schriftart

Unterschiedliche Auffassungen bestehen bei der Frage, welche Schriftart online am geeignetsten ist. Allerdings hat sich wohl die Meinung durchgesetzt, dass serifenfreie Schriften leichter lesbar sind. Der Deutsche Blinden- und Sehbehindertenverband e. V. (DSBV) empfiehlt in der hier verlinkten PDF-Broschüre humanistische Groteskschriften wie Calibri oder Verdana.

Linksbündiges Blindtext-Textbeispiel mit Verdana
Linksbündig und Verdana gelten als barrierearme Alternativen zu Blocksatz und z. B. Serifenschriften

(6) Links aussagekräftig setzen

Verlinkungen sollten kontextsensitiv gesetzt werden, das heißt, es sollte auch ohne ein Darüberfahren mit der Maus ersichtlich sein, wohin ein Link führt. Ebenso sollte durch den Text deutlich werden, ob zu einem Dateiformat wie einer PDF mit Direktdownload verlinkt wird.

Direkte Verlinkungen sind tendenziell barriereärmer als Linklisten am Ende eines Texts. Zumindest gilt das, falls der direkte Kontext eines Links im Text bereits gegeben ist.

(7) Die Sache mit dem Gendern

Gendergerechte Sprache und Barrierefreiheit sind leider nur bedingt miteinander in Einklang zu bringen, sobald es an die Verwendung von Sonderzeichen wie dem Sternchen * geht. Denn entweder wird dieses vom Screenreader immer als Zeichen ausgelesen, was etwas anstrengend ist. Oder diese Funktion wird ausgestellt, wodurch aber beispielsweise auch Kennzeichnungen für Anmerkungen (ähem) verloren gehen.

Angenehmer für das Auslesen via Screenreader ist beispielsweise die Verwendung eines Doppelpunktes, da dieser im Wort als Pause gelesen wird. Allerdings ist das wiederum problematisch, wenn der Doppelpunkt am Ende eines Wortes verwendet werden soll, um auf nicht-binäre Personen zu verweisen – als Beispiel geisterte z. B. kürzlich Arzt/Ärztin* durch Twitter. Mit dem Doppelpunkt entstände hier halt nur eine uneindeutige Pause.

Insgesamt wird z. B. auf Netz Barrierefrei eher dazu geraten, das Sternchen zu verwenden, da am Wichtigsten ist, dass sich eine Variante durchsetzt und das Sternchen derzeit nun mal am Prominentesten ist. Nur so können Irritationen vermieden werden. Und am besten ist es natürlich, wo immer möglich, genderneutrale Begriffe ganz ohne Sonderzeichen zu verwenden. Eine Auswahl an Begriffen stellt Geschickt gendern bereit.

***

So viel als ersten, sehr kurzen Abriss zu diesem Thema. Wie gesagt, ich habe die Weisheit nicht mit Löffeln gefressen und bin bei den meisten dieser Aspekte auch nicht persönlich betroffen. Insofern alle Angaben ohne Gewähr und Ergänzungen bzw. Verbesserungen sind gerne gesehen. Ausführlichere Informationen erhaltet ihr über die oben genannten Webseiten.

Übrigens: Jepp, ich befolge selbst nicht immer alle der oben genannten Schritte. Teilweise, weil ich sie noch nicht verinnerlicht habe (z. B. die Sache mit den sprechenden Verlinkungen), zum Teil auch, weil ich über WordPress.com z. B. bei der Schrift nur bedingte Möglichkeiten habe, sie selbst anzupassen. Aber nun … ich hoffe, das alles früher oder später angehen zu können.

Ob eure Webseite oder euer Blog Probleme aufweist, könnt ihr übrigens mit Tools wie WAVE testen. Außerdem haben die meisten Laptops und Smartphones eingebaute Screenreader, die nicht immer optimal funktionieren, aber ein erster Anlaufpunkt zum Selbsttest sind. Auf die Art habe ich z. B. festgestellt, dass meine Textboxen in Word keine Alternative zu den 1×1-Tabellen sind, da die Boxen schlicht vom Screenreader übersprungen werden …

Allgemein Outside Tellerrand

Kommentar verfassen; bitte beachte, dass die IP-Adresse gespeichert wird, wenn du einen Kommentar verfasst; siehe dazu die Datenschutzerklärung

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden /  Ändern )

Google Foto

Du kommentierst mit Deinem Google-Konto. Abmelden /  Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden /  Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden /  Ändern )

Verbinde mit %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.