DE
Menü öffnen

Barrierefreiheit

Stand: 12.12.2025

Tipps für Redakteurinnen und Redakteure zur Barrierefreiheit

Die TU Hamburg ist gesetzlich verpflichtet, ihre Website barrierefrei zu gestalten. Das bedeutet, dass die Inhalte auch bei eingeschränkter Wahrnehmungsfähigkeit zugänglich sein müssen. Die technischen Voraussetzungen dafür stellen wir für alle Webauftritte, die mit TYPO3 im neuen Webdesign der TU erstellt werden, sicher (für Webauftritte außerhalb des zentralen TUHH-TYPO3-Systems sind die Organisationseinheiten, die den Webauftritt betreiben, selbst für das Thema Barrierefreiheit verantwortlich). Darum müssen Sie sich nicht kümmern. Aber auch die Redakteurinnen und Redakteure, die mit TYPO3 arbeiten, können (und müssen) ihren Beitrag leisten für eine barrierefreie Website.

Überschriften mit Headlines auszeichnen

Überschriften strukturieren die Texte optisch und erleichtern auch Screenreadern die Navigation durch den Text. Daher sollten alle Überschriften entsprechend markiert werden: Die erste Überschrift muss Heading 1 sein. Danach verwenden Sie hierarchisch die weiteren Überschriftentypen - beachten Sie dazu auch unsere Hinweise zu Textformatierungen.

Eindeutige Absätze verwenden

Um Hilfsprogramme wie beispielsweise einen Screenreader sinnvoll einsetzen zu können, muss der Text sauber ausgezeichnet sein, nicht nur mit Headlines, sondern auch mit „paragraphs“ (<p>): Bitte achten Sie darauf, keine leeren Absätze einzufügen, um Abstände zu vergrößern. Verwenden Sie generell lieber kurze Absätze.

Text mit Aufzählungen strukturieren

Lockern Sie den Text gern mit Listen oder Aufzählungspunkten auf. Verwenden Sie dafür immer die entsprechende Formatierung im Editor (wie z.B. „Bullet lists“) und arbeiten Sie nicht mit Bindestrichen o.Ä. So können Sie sichergehen, dass der HTML-Code gut erkennbar und die Darstellung einheitlich ist.

Aussagekräftige Linktexte formulieren

Der Linktext sollte immer das Ziel des Links beschreiben, damit gleich erkennbar ist, wohin der Link führt. Wenn auf ein Dateiformat verlinkt wird, das keine HTML-Seite ist, sollte im Linktext auch das Dateiformat genannt werden. Also zum Beispiel Pressemitteilung als PDF. Wenig hilfreich sind allgemeine Formulierungen wie Mehr, Weiterlesen oder Weitere Informationen finden Sie hier.

Bitte beachten Sie auch unsere Hinweise zum Erstellen von Links.

Tabellen sinnvoll und übersichtlich verwenden

Nutzen Sie Tabellen nur für echte tabellarische Daten, nicht für das Layout. Versehen Sie Tabellen mit Spalten- und/oder Zeilenüberschriften.

Sprache korrekt verwenden

Die Sprache, in der ein Screenreader die Webseiteninhalte vorliest, wird nicht automatisch erkannt, sondern durch die Sprachangabe der Website bestimmt. Wenn Sie also Texte in englischer Sprache auf die deutsche Sprachversionen Ihrer Website stellen, werden diese Texte vom Screenreader nach deutschen Ausspracheregeln vorgelesen.

Stellen Sie also die deutschen und englischen Texte korrekt auf der jeweiligen Sprachversionen Ihrer Webseite ein. Löschen oder deaktivieren Sie die alternative Sprachversion, wenn diese nicht befüllt ist. Beachten Sie für die korrekte Umsetzung unsere Hinweise zur Mehrsprachigkeit.

Bildern einen ALT-Text geben

Wenn ein Bild z.B. aus technischen Gründen nicht geladen werden kann, wird als Alternative der ALT-Text angezeigt. Auch ein Screenreader liest diese Information vor. Daher sollte das Bild sinnvoll beschrieben werden, und zwar so, dass ein Nicht-Sehender weiß, was auf dem Bild zu sehen ist.

Der Alternativtext sollte nicht zu lang und nicht zu kurz sein: Der Text sollte ausreichende Informationen geben, um das Bild korrekt zu beschreiben, ohne zu viele Details zu nennen. 

Kein Alternativtext ist notwendig bei rein dekorativen Bildern, z.B. bei grafischen Gestaltungselementen, Hintergrundbildern oder Schmuckbildern, die keine Informationen vermitteln.

Sonderfall animierte Bilder

Animierte Bilder (z.B. GIFs) sind im TU-TYPO3 nur eingeschränkt barrierefrei einsetzbar. Damit Animationen/GIFs barrierefrei sind,

  • müssen sie einen sehr guten Alt-Text enthalten,
  • dürfen sie nicht zu schnell blinken (max. 3 Blitze/Sekunde) und
  • müssen sie nach 5 Sekunden stoppen oder pausierbar sein. Einen Pause-Button können wir aktuell technisch nicht umsetzen - daher müssen Sie die Datei so gestalten, dass die Animation max. 5 Sekunden lang ist und nach einer Wiederholung stoppt - einen erneuten Start-Button gibt es dann aber auch nicht.

Verzichten Sie daher wann immer möglich auf Animationen und setzen Sie besser auf Bilder oder auf Videos.

Auf nicht barrierefreie Animationen muss in der Erklärung zur Barrierefreiheit hingewiesen werden. Sie müssen in diesem Fall die allgemeine Erklärung der TU Hamburg für Ihren Webauftritt erweitern.

Keine Texte in Bildern

Verwenden Sie keine Texte in Bildern. Diese sind für Screenreader nicht zugänglich. 

Multimedia-Inhalte zugänglich gestalten

Für Videos sollten Sie Untertitel und Transkripte bereitstellen. Fügen Sie eine Audiodeskription hinzu wenn möglich.

Ein Transkript ist eine schriftliche Niederschrift des gesprochenen Textes oder der Audioinhalte eines Videos. Es enthält den gesamten gesprochenen Inhalt wortwörtlich oder in zusammengefasster Form. Zusätzlich können auch wichtige Musik-, Geräusch- oder Stimmungsinformationen mit angegeben werden (z. B. „Hintergrundmusik spielt leise“, „Person lacht“).

Eine Audiodeskription (auch: Hörbeschreibung) ist eine zusätzliche Tonspur oder ein separater Kommentar, der visuelle Inhalte eines Videos beschreibt.

Diese Maßnahmen sind aktuell technisch nicht immer möglich im Video-Inhaltselement. Wir arbeiten an einer Lösung. Denke Sie diese Anforderungen jedoch bei der Erstellung oder Beauftragung neuer Videos bereits jetzt mit.

Barrierefreie Dokumente

Die Richtlinien zur Barrierefreiheit gelten auch für Dokumente, die auf Webseiten eingestellt werden. Damit Menschen mit Behinderungen Word-Dateien oder PDF-Dokumente gut nutzen können, müssen diese Dokumente bestimmte Kriterien erfüllen. Zum Beispiel müssen Menschen mit Sehbehinderungen das Dokument auch ohne Maus einfach bedienen können. Dafür ist insbesondere die Strukturierung bzw. Formatierung des Dokuments entscheidend. Außerdem müssen auch alle Bilder im Dokument mit einem Alternativtext versehen sein.

Die Dokumente müssen bereits durch die Person, die sie erstellt, barrierefrei gestaltet werden. Dies kann nicht nachträglich durch die Webredaktion erfolgen.

Weitere Informationen und Anleitungen für diejenigen, die Dokumente für Webseiten erstellen, finden Sie z.B. auf der Webseite der Bundesfachstelle Barrierefreiheit. Die Technische Universität Dresden stellt auf ihrer Webseite Anleitungen zur Erstellung barrierefreier Dokumente zu Verfügung. Schulungen zum Thema bietet die Digital Academy des Hamburger Landesbetrieb Zentrum für Aus- und Fortbildung (ZAF) an.

Erklärung zur Barrierefreiheit sowie Informationen in Leichter Sprache und Deutscher Gebärdensprache

Wenn Sie einen eigenen Webauftritt betreuen, z.B. die Website Ihres Instituts oder Ihrer Arbeitsgruppe, müssen Sie im Footer einen Link zur Erklärung zur Barrierefreiheit der TU Hamburg setzen. Sie müssen keine eigene Erklärung verfassen. Für mehrsprachige Webauftritte muss der Link in beiden Sprachversionen gesetzt sein.

Die Informationen in Leichter Sprache und Deutscher Gebärdensprache, die mit Icons in der Servicenavigation der zentralen TU-Homepage verlinkt werden, müssen Sie auf Ihrem eigenen Webauftritt nicht einbinden oder verlinken.

Individuelle Lösungen mit HTML

Wenn Sie auf Ihrer Website das HTML-Inhaltselement einsetzen, sind Sie für diesen Bereich Ihrer Website selbst für die Einhaltung aller geltenden Richtlinien zur Barrrierefreiheit verantwortlich. Sind die dargestellten Inhalte nicht barrierefrei zugänglich, müssen Sie dies in einer eigenen Erklärung zur Barrierefreiheit erläutern.

Weitere Informationen