Barrierefreie Inhalte – was müssen Content Creator:innen wissen?

Content für alle zugänglich machen – das ist eines der Ziele des Barrierefreiheitsstärkungsgesetzes (BFSG), das am 28. Juni 2025 in Kraft tritt. Als Content Creator:in trägst du entscheidend zu Umsetzung bei. Was musst du wissen? Hier kommt deine Übersicht!

Barrierefreie Inhalte? Mann schaut durch riesiges Schlüsselloch in die Welt.
Bild: © textbest GmbH / Canva Pro

WCAG-Kriterien: Text, Bild, Audio und Video barrierefrei gestalten

Die Kreation von barrierefreien Inhalten dient nicht nur der gesetzlichen Konformität. Ist Content für möglichst viele Menschen zugänglich, sorgt das ebenfalls für eine positive Content Experience, steigert die Interaktion mit einer Website und hat so einen erheblichen Einfluss auf relevante Marketing-KPI. Was genau du bei der Umsetzung beachten musst, folgt aus den international gültigen Web Content Accessibility Guidelines (WCAG) 2.2. Diese sind in die vier Prinzipien unterteilt:

  • Wahrnehmbar
  • Bedienbar
  • Verständlich
  • Robust

Unter die vier Prinzipien fallen 13 Richtlinien und insgesamt 86 Erfolgskriterien. Doch welche sind für barrierefreie Inhalte wirklich relevant? Damit beschäftigen wir uns im Folgenden.

Bitte beachte: Es handelt sich um eine stark verkürzte Zusammenfassung, die dir als Content Creator:in im Bereich Text und Grafik einen Überblick verschaffen und einen thematischen Einstieg ermöglichen soll. Es werden nicht alle Kriterien der jeweiligen Richtlinien aufgeführt.

WCAG 2.2 Richtlinie 1.1: Textalternativen

„Stellen Sie Textalternativen für alle Nicht-Text-Inhalte zur Verfügung, sodass diese in andere vom Benutzer benötigte Formen geändert werden können, wie zum Beispiel Großschrift, Braille, Symbole oder einfachere Sprache.“

zitiert aus der Übersetzung der Aktion Mensch vom 15.06.2022

Stell dir vor, ein Mensch mit einer Sehbehinderung oder einer Lese-Rechtschreibstörung (LRS) besucht deine Website. Dafür nutzt er einen Screenreader. Ein Bild auf der Seite enthält wichtige Informationen, doch es ist kein Alternativtext hinterlegt. Der Screenreader kann die Information nicht wiedergeben.

Die Richtlinie 1.1 gehört zum Prinzip der Wahrnehmbarkeit, nach dem Informationen und Bestandteile von Benutzerschnittstellen so präsentiert werden müssen, dass User:innen sie wahrnehmen können. Der Titel der Richtlinie 1.1 „Textalternativen“ ist zunächst ein wenig missverständlich. Es geht bei dieser Regelung nicht um Alternativen zu Texten, sondern um textliche Alternativen zu Bildern, Grafiken und weiteren nicht-textuellen Inhalten wie Bedienelementen oder Tests.

Das Wichtigste in Kürze:

  • Es gilt, alle visuell dargestellten Informationen über den Quelltext zugänglich zu machen, damit sie von Screenreadern korrekt wiedergegeben werden können. Das bedeutet, dass du für jedes Bild auf einer Seite eine angemessene Textalternative (in der Regel lautet die Bezeichnung ALT-Tag oder ALT-Attribut) erstellen solltest, die den Inhalt des Bildes wiedergibt.
  • Komplexe Grafiken benötigen gegebenenfalls eine ausführliche Beschreibung außerhalb des Bildelements. Diese kannst du zum Beispiel unter dem Bild platzieren oder verlinken.

Ist dein Content barrierefrei? Nutze für die Überprüfung das Zwei-Sinne-Prinzip aus der analogen Barrierefreiheit: Information dürfen nicht einem einzelnen Sinneskanal vorbehalten sein.

WCAG 2.2 Richtlinie 1.2: Zeitbasierte Medien

„Stellen Sie Alternativen für zeitbasierte Medien zur Verfügung.“

zitiert aus der Übersetzung der Aktion Mensch vom 15.06.2022

Kann eine gehörlose Person deinen Podcast konsumieren oder alle Informationen aus deinem Video erfassen?

Die Richtlinie 1.2 stellt Anforderungen an zeitbasierte Medien wie Audio, Video und Kombinationen davon. Hierbei wird eine Unterscheidung zwischen aufgezeichneten und Live-Medien getroffen.

Das Wichtigste in Kürze:

  • Biete User:innen für reine Audio- oder Videoinhalte eine Alternative, die äquivalente Informationen liefert, beispielsweise ein Transkript.
  • Stelle Untertitel für aufgezeichnete und Live-Videos bereit.
  • Verfasse für aufgezeichnete Videos ein Transkript oder eine Audiodeskription, die eine detaillierte Beschreibung der wichtigsten visuellen Elemente enthält, wobei eine Audiodeskription dem höheren Barrierefreiheitsstandard entspricht.

Was ist der Unterschied zwischen einem Transkript und einer Audiodeskription?

Eine Transkription ist die Umwandlung von gesprochenem Wort in Text. Eine Audiodeskription ist eine verbale Beschreibung des zu Sehenden, also beispielsweise auch eine Beschreibung von Personen und Handlungen, die zum Gesamtverständnis des Inhalts beitragen.

WCAG 2.2 Richtlinie 1.3: Anpassbar

„Erstellen Sie Inhalte, die auf verschiedene Arten dargestellt werden können (z. B. einfacheres Layout), ohne dass Informationen oder Struktur verloren gehen.“

zitiert aus der Übersetzung der Aktion Mensch vom 15.06.2022

Lassen sich alle Elemente einer Webseite logisch über einen Screenreader erfassen?

Bei der WCAG-Richtlinie 1.3 geht es um Strukturen und semantische Informationen, die explizit im Markup codiert sein müssen, also im Normalfall HTML.

Das Wichtigste in Kürze:

  • Sorge dafür, dass alle visuell dargestellten Komponenten auf der Strukturebene nachvollzogen werden können. Hierzu zählt die korrekte Auszeichnung von Überschriften, aber ebenso müssen Listen, Absätze, Tabellen und gruppierende Elemente nach Spezifikation im Code repräsentiert werden.
  • Achte bei der Texterstellung darauf, im Artikel eine korrekte Überschriftenarchitektur anzulegen und diese mit den H1- bis maximal H6-Tags zu versehen.

Überschriften-Hierarchie: Jede Seite muss eine H1 haben, also eine Hauptüberschrift. Der H1-Tag kann nur einmal vergeben werden. Werden Unterüberschriften gesetzt (H2), müssen es mindestens zwei sein, ansonsten wäre eine Untergliederung nicht sinnvoll. Soll eines der Unterthemen weiter untergliedert werden, wird der H3-Tag genutzt usw.

Die korrekte HTML-Auszeichnung von Elementen ist nicht nur für die Nutzer:innen von Screenreadern relevant. Auch für Algorithmen ist sie grundlegend – also für SEO und GEO (Generative Engine Optimization).

WCAG 2.2 Richtlinie 1.4: Unterscheidbar

„Machen Sie es Benutzern leichter, Inhalt zu sehen und zu hören einschließlich der Trennung von Vorder- und Hintergrund.“

zitiert aus der Übersetzung der Aktion Mensch vom 15.06.2022

Du hast eine Grafik zu wichtigen Produkt-Features erstellt und hierbei mit hellen Farben und erläuternden Icons gearbeitet. Stellenweise befindet sich ein hellgraues Symbol auf weißem Hintergrund. Nutzer:innen mit Sehschwäche oder schlechter Bildschirmqualität können diesen Text kaum erkennen. Ihnen bleiben wichtige Produktinformationen vorenthalten.

Oder du hast einen Podcast aufgenommen, in dem du ein Interview mit einer Person führst, die sich in einer lauten Umgebung befindet. Die Hintergrundgeräusche können dazu führen, dass Menschen mit einem eingeschränkten Hörvermögen oder kognitiven Behinderungen dem Inhalt nicht folgen können.

Die Richtlinie 1.4 befasst sich mit visuellen und auditiven Inhalten, bei denen der Vorder- und Hintergrund klar voneinander getrennt sein müssen. Das ist unter anderem wichtig für User:innen mit Seh- oder Hörbehinderung, ebenso für die Nutzung einer Website in einer bestimmten Situation, etwa bei Sonneneinstrahlung oder in einer lauten Umgebung.

Das Wichtigste in Kürze:

  • Nutze Farbe nicht als einziges Mittel, um Informationen zu vermitteln oder Handlungen zu kennzeichnen („Klicke das rote Kästchen, um …“).
  • Ermögliche bei automatisch startenden Audioinhalten, die länger als drei Sekunden sind, ein Pausieren oder Stoppen oder eine eigene Lautstärkenregulierung.
  • Achte bei einer visuellen Darstellung von Text und Bildern von Text auf ein Kontrastverhältnis von mindestens 4,5:1 (Minimum) beziehungsweise für den höchsten Barrierefreiheitsstandard mindestens 7:1 (erhöht). Ausnahmen sind beispielsweise Wortbildmarken, also Logos.
  • Nutzen Bilder eines Textes (also ein Bild, auf dem Text steht) nur dekorativ, es sei denn, es handelt sich um eine Wortbildmarke.
  • Garantiere für die visuelle Präsentation von grafischen Objekten ein Kontrastverhältnis von mindestens 3:1, sofern die grafischen Objekte zum Verständnis von Inhalten wichtig sind.
  • Sorge dafür, dass reiner Audioinhalt keine Hintergrundgeräusche hat beziehungsweise nur sehr leise (etwa viermal so leise wie der Sprachinhalt) oder, dass diese abschaltbar sind.
  • Weitere Kriterien der umfangreichen Richtlinie 1.4 betreffen unter anderem die Darstellung von Text und Textblöcken.

WCAG 2.2 Richtlinie 3.1: Lesbar

„Machen Sie Inhalt lesbar und verständlich.“

zitiert aus der Übersetzung der Aktion Mensch vom 15.06.2022

Ein Mensch mit Lese-Rechtschreibstörung (LRS) möchte sich über ein Online-Angebot informieren. Der Text ist für ihn jedoch nicht verständlich. Er bricht die Recherche ab und nimmt das Angebot nicht in Anspruch. Oder noch schlimmer: Er trifft eine falsche Kaufentscheidung, weil er den Inhalt missverstanden hat.

Mehr als 3,5 Millionen Menschen in Deutschland sind von LRS betroffen. Die Richtlinie 3.1 betrifft außerdem Menschen mit anderen kognitiven Einschränkungen, ebenso Personen, die Texte in einer fremden Sprache lesen oder solche, die aufgrund einer Sehbehinderung eine starke Vergrößerung brauchen und infolgedessen beim Lesen häufig den Zusammenhang verlieren.

Das Wichtigste in Kürze:

  • Stelle die korrekte Spracheinstellung einer Website sicher, um eine korrekte und angenehme Audio-Wiedergabe zu gewährleisten.
  • Auch Teile von Webseiten, die in einer anderen Sprache geschrieben sind (etwa englischsprachige Zitate), solltest du entsprechend kennzeichnen.
  • Erkläre ungewöhnliche Wörter, Abkürzungen oder eine besondere Aussprache, um hohen Anforderungen an barrierefreie Inhalte zu genügen. Das kannst du beispielsweise direkt im Text oder in einem Glossar machen.
  • Achte darauf, dass das Sprachniveau deines Textes das Niveau von Siebt- bis Neuntklässler:innen nicht übersteigt. Anderenfalls sollte eine alternative Version des Textes in Leichter Sprache angeboten werden.

Textniveau: Wie gut ein Text lesbar ist, kannst du beispielsweise mit dem Flesch-Lesbarkeitsindex ermitteln.

BFSG-Umsetzung für Content Creator:innen

Barrierefreie Inhalte machen Web-Angebote einer großen Anzahl von Menschen zugänglich. Damit ist das BFSG ist für dich nicht nur eine Verpflichtung, sondern eine Chance, unterschiedlichsten Zielgruppen näher zu kommen, die Sichtbarkeit der Website zu verbessern und an Markenimage zu gewinnen. Das Internet liefert Informationen zu jeder Zeit und an jedem Ort. Lass uns Content erstellen, der tatsächlich jeden Menschen erreichen kann!

Du möchtest mehr über das Thema Digitale Barrierefreiheit erfahren? In unserem Whitepaper „Barrierefreiheitsgesetz: Das müssen Unternehmen schon jetzt wissen“ haben die Expert:innen von SKW Schwarz die wichtigsten Aspekte für Unternehmen zusammengetragen.