Das Schreiben von barrierefreien Inhalten ist gutes Schreiben. Dadurch kann Ihr Inhalt leichter von jedem erfasst werden. Hier sind einige Tipps, wie Sie barrierefreie Inhalte schreiben können.


Einfach schreiben

Eine Dokumentation ist nur so gut, wie die Menge der Inhalte, die die Personen daraus mitnehmen. Wenn das Geschriebene zu kompliziert ist, kann die Dokumentation nicht verwendet werden. Einfache Sprache verbessert die Barrierefreiheit.

Mit diesen Tipps schreiben Sie einfach und präzise:

  • Schreiben Sie kurze Sätze. Sie sollten maximal 20 bis 25 Wörter enthalten.
  • Verwenden Sie einfache Wörter. Verwenden Sie, wenn möglich, Wörter (oder Wortkombinationen) mit 1–2 Silben. Verwenden Sie zum Beispiel „damit“ statt Konstruktionen mit „um zu“.  Auf den folgenden Websites finden Sie Listen mit einfachen Wörtern, die Sie verwenden können:
  • Verwenden Sie Verkürzungen.
  • Verwenden Sie Hilfsmittel wie den Hemingway Editor (Englisch), um die Lesbarkeit Ihres Textes zu bewerten. Zielen Sie zur Erfüllung der Richtlinien für barrierefreie Webinhalte (WCAG) auf einen Lesbarkeitsgrad von 8 oder niedriger ab.

Überschriftenstruktur

Überschriften haben bei der Erstellung zugänglicher Inhalte eine große Bedeutung. Sie bieten Benutzern von Bildschirmlesern die Möglichkeit, direkt zu einem bestimmten Inhalt zu springen, wodurch sie Zeit sparen.

Arbeiten Sie mit dem System, in dem Sie schreiben. Alle gängigen Tools wie Microsoft Word, PowerPoint und Open Office bieten Stil- und Formatierungsoptionen, die Ihnen bei der Erstellung einer ordnungsgemäßen Struktur innerhalb Ihrer Dokumente helfen. Verwenden Sie die Stil- und Formatierungsoptionen Ihres Inhaltseditors.

Beispiel: Überschrift 1 (<h1>)

Die Zahlen im Überschriftenstil erstellen einen strukturellen Kontext für den Bildschirmleser und helfen nicht-visuellen Benutzern, den Inhalt zu verstehen, selbst wenn sie nicht die visuellen Unterbrechungen im Dokument sehen.

Beispiel:

<h1>Barrierefreiheit im Bildungswesen</h1>

<h2>Barrierefreiheit bei Blackboard</h2>

Weitere Informationen zur Entwicklung von barrierefreien Inhalten


Hervorheben von Inhalt

Bildschirmleser erkennen keine Schriftstile einschließlich:

  • Farbe
  • Fett
  • Kursiv
  • Unterstrichen
  • Durchgestrichen

Verwenden Sie diese Stile, um visuelle Unterbrechungen zu erstellen. Verwenden Sie sie nicht als einzige Methode, um die Bedeutung anzugeben oder Informationen zu vermitteln.

Beispiel: Roter Text sieht wie eine Warnung aus. Benutzer von Bildschirmlesern wissen nicht, ob der Text rot ist. Sie achten nicht auf den Hinweis und wissen nicht, dass es eine Warnung ist.

Wenn Sie etwas stark visuell hervorheben möchten, sollten Sie auf eine zugängliche Alternative zurückgreifen. Verwenden Sie ein Ausrufezeichen am Ende Ihres Satzes, wenn dieser wichtig ist. Ausrufe- und Fragezeichen werden von Bildschirmlesern entsprechend intoniert. Das bedeutet nicht, dass das Gerät wörtlich „Fragezeichen“ vorliest. Stattdessen wird ein Frageton verwendet, wenn eine Frage vorgelesen wird.

Beispiel: Wie bereits erwähnt: Nutzen Sie nicht nur Schriftstile, um etwas hervorzuheben.


Bilder

Fragen Sie sich, welchen Zweck das Bild hat. Soll es eine Seite visuell gestalten? Oder gibt es einem sehenden Benutzer eine visuelle Referenz des zu Erwartenden? Müssen alle Benutzer das Bild erfassen, um den Inhalt zu verstehen?

Wenn Sie die Bedeutung oder den Zweck eines Bildes nicht kennen, sollten Sie es nicht verwenden. Dann ist es nämlich überflüssig und überfordert jene mit Lernbehinderung.

Alternativer Text

Wenn Sie ein LMS oder eine Website verwenden, um Informationen zu vermitteln, finden Sie ein Feld für Alternativtext oder alternativen Text, sobald Sie ein Bild hochladen. Lassen Sie das Textfeld für alternativen Text leer, wenn es sich um dekorative Bilder handelt. Der Bildschirmleser ignoriert das Bild in diesem Fall. Ein Bild ist dekorativ, wenn es nicht zu den Informationen auf der Seite beiträgt.

Weitere Informationen über dekorative Bilder finden Sie auf der Website zur Barrierefreiheit im Web

Beispiel: Wenn ein Bild die Tools auf einer Benutzeroberfläche (UI – User Interface) zeigt, beschreiben Sie, wie Sie navigieren und was sich auf der Seite befindet. Siehe Beispiel für die Beschreibung eines Bildes auf der Seite.

Wenn Sie nicht möchten, dass der Bildschirmleser das Bild überspringt, binden Sie Alternativtext in Ihre Bilder ein. Sie müssen nicht „Bild von“ einbinden, da die Hilfslesemittel bereits erkannt haben, dass es sich um ein Bild handelt. Schreiben Sie kurz, prägnant und anschaulich.

Verwenden Sie nicht den gleichen Alternativtext in jedem Bild, wie z. B. „Bild zur Darstellung des dazugehörigen Textes“. Das ist bedeutungslos und trägt zu einem Durcheinander bei.

Halten Sie den Alternativtext für komplexe Bilder kurz; 6 oder 7 Zeichen. Fügen Sie eine Bildunterschrift ein, die für jeden sichtbar ist und eine eindeutige Erklärung liefert.

Infografiken

Infografiken erfordern eine Textalternative. Dabei wird das gleiche in Worten wiedergegeben, was auf dem Bild zu sehen ist. Die Textalternative sollte auf der Seite sofort nach der Infografik stehen. Beziehen Sie einen Anker-Link oben auf der Seite ein, um die Textalternative anzuzeigen.

Hier sehen Sie ein Beispiel einer Infografik mit einer Textalternative.

Text in Bildern

Gemäß den Richtlinien für barrierefreie Webinhalte (WCAG) sollte der Text nicht als Teil eines Bildes erscheinen. Erklären Sie stattdessen das Bild in Textform auf der Seite.


Verknüpfungen

Es ist wichtig, dass Ihre Links aussagekräftig sind. Jeder Link sollte beschreiben, was den Benutzer erwartet, wenn er darauf klickt. Dies ist der Schlüssel für das Tool „Linkliste“, das Bildschirmleser bereitstellen. Dieses Tool führt nur die Links auf einer Seite auf, weiter nichts. Es gibt keinen zusätzlichen Kontext für den Link.

Beispiel: Auf dieser Seite würde die Linkliste Folgendes lesen: „Siehe Beispiel für die Beschreibung eines Bildes auf der Seite“, „Beispiel für eine Infografik mit einem Alternativtext“ usw. Jede Wortgruppe beschreibt, was Sie bei der Auswahl des Links erwarten können.

  • Vermeiden Sie die Verwendung von allgemeinen Phrasen wie „Klicken Sie hier“ oder „Weitere Infos“. Die Linkliste liest den Text des Links genauso, wie er eingegeben wurde. Wenn sich der gleiche Link wiederholt (stellen Sie sich vor, Sie hören mehrmals „Hier klicken, hier klicken, hier klicken“), entsteht Chaos und der Leser ist frustriert. Der Leser muss verstehen, wo der Link hinführt und warum er darauf klicken sollte. Beschreibende Links bieten diesen Kontext.
  • Webadressen oder URLs werden nicht als informativ angesehen und sollten nicht verwendet werden. Der Bildschirmleser liest jeden Buchstaben einzeln. Schreiben Sie stattdessen einen aussagekräftigen Text.
  • Das Öffnen von Links in neuem Fenster kann verwirrend sein. Halten Sie dies daher auf einem Minimum. Teilen Sie Ihren Benutzern mit, wann Sie ein neues Fenster verwenden.

Liste und Tabellen

Lassen Sie die Tools, mit denen Sie Ihren Inhalt erstellen, die Arbeit tun. Verwenden Sie Aufzählungszeichen, nummerierte Listen und Tabellenwerkzeuge im Inhaltseditor. Oder zeigen Sie die Quelle an und verwenden Sie die korrekten HTML-Tags.

Listen

Ordnungsgemäß erstellte Aufzählungslisten (<ul>) informieren den Benutzer eines Bildschirmlesers, wie viele Elemente die Liste enthält.

Ordnungsgemäß erstellte nummerierte Listen (<ol>) informieren den Benutzer eines Bildschirmlesers, wie viele Elemente die Liste enthält und lesen die Nummer für jedes Element vor.

Tabellen

Verwenden Sie nach Möglichkeit lieber Listen als Tabellen. Tabellen können zwar zugänglich gemacht werden, Benutzer von Bildschirmlesern müssen jedoch fortgeschrittene Tastaturbefehle kennen, um sie zu verstehen und darin zu navigieren.

Verwenden Sie Spaltenüberschriften (<th>). So kann der Bildschirmleser die Spaltenüberschrift für jede Zelle erneut ankündigen, während der Benutzer in der Tabelle navigiert. So erhält der Benutzer den Kontext für jeden Zelleninhalt. Überlegen Sie bei der Benennung der Spalten und beim Hinzufügen der Informationen in die Zelle genau, wie jede Zelle gelesen wird.

Verwenden Sie niemals Tabellen, um ein visuelles Layout eines Inhalts zu erstellen.

Ein Beispiel einer barrierefreien Tabelle.


Tastenbefehle

Es gibt globale Standards für Tastenbefehle in Webinhalten. Sie können beispielsweise die Tabulatortaste drücken, um die nächste Schaltfläche aufzurufen. Sie müssen diese nicht beschreiben. Eine Liste der globalen Befehle finden Sie im JAWS Keyboard Commands Quick Reference Guide (nur Englisch, entsprechende deutsche Dokumente sind im Internet zu finden).

Manchmal müssen Entwickler eigene Tastenbefehle für ihr Produkt erstellen. Blackboard Collaborate erstellte z. B. eigene Tastenbefehle, um das Mikrofon ein- und auszuschalten. Dokumentieren Sie diese eigenen Tastenbefehle in Ihren Themen.

Klick- und Tastenbefehlsanweisungen sind zwei separate Themen und sollten nicht im gleichen Absatz stehen. Wenn sich die Mac-Befehle von den PC-Befehlen unterscheiden, verwenden Sie zwei Sätze im Absatz für die Tastenbefehle.

Beispiel 1

Standardmäßig werden Sie nach der Einrichtung ausgeblendet und stummgeschaltet. Klicken Sie auf das Mikrofon- und Kamera-Symbole, um die Teilnahme an der Sitzung vollständig zu aktivieren.

Wenn Sie eine Tastatur verwenden, drücken Sie auf Alt + M, um Ihr Mikrofon ein- und auszuschalten. Drücken Sie auf Alt + C, um die Kamera ein- und auszuschalten.

Beispiel 2

Wenn Sie eine Präsentation freigeben, werden Schaltflächen zum Blättern angezeigt, damit Sie von einer Folie zur nächsten navigieren können.

Drücken Sie auf Alt + Bild-auf auf der Tastatur, um zur nächsten Folie zu gelangen. Drücken „Alt + Bild-ab“, um zurück zu blättern. Drücken Sie auf einem Mac die Tasten „Alt + Fn + Pfeil nach unten“.


Video

Videos müssen Untertitel enthalten. Weitere Informationen finden Sie unter Informationen zur Untertitelung von Videos.