Barrierefreiheit beginnt bei Deinen Inhalten

Bunt besprühte Backsteinwand mit Schild auf dem "Accessible Entry" steht

Barrierefreiheit endet nicht mit der Technik – sie beginnt bei Deinen Inhalten. Wenn Template, Code und Komponenten barrierefrei umgesetzt sind, entscheidest Du im Redaktionsalltag, ob Seiten wirklich für alle zugänglich sind. Dieser Leitfaden zeigt Dir konkret, worauf Du beim Erstellen und Pflegen von Inhalten in TYPO3 achten solltest, damit Deine Website für alle Nutzer:innen gut funktioniert.

Was Barrierefreiheit für Dich bedeutet

  • Orientierung: Inhalte sind logisch strukturiert und schnell erfassbar – auch mit Screenreader oder Tastatur.

  • Verständlichkeit: Klare Sprache, aussagekräftige Überschriften und Linktexte helfen allen, Informationen schneller zu finden.

  • Medienzugang: Bilder, PDFs, Audio und Video sind so aufbereitet, dass niemand ausgeschlossen wird.

Deine 10 wichtigsten Aufgaben im TYPO3‑Backend

1. Überschriften und Struktur

  • Nutze eine saubere Hierarchie: H1 kommt aus dem Template, Du strukturierst mit H2/H3 inhaltlich sinnvoll.
  • Verwende echte Listen und Zitate im RTE (Texteditor) statt „fett“ oder manueller Einrückungen.

2. Bilder richtig beschreiben

  • Vergib präzise Alt‑Texte für inhaltstragende Bilder; dekorative Bilder bekommen einen leeren Alt‑Text.
  • Pflege Bild‑Metadaten in der Dateiliste (Alt‑Text, Titel, Beschreibung), damit Wiederverwendungen automatisch korrekt sind.

3. Verständliche Linktexte

  • Beschreibe das Ziel des Links eindeutig: „Jahresbericht 2025 (PDF, 2 MB)“ statt „hier klicken“.

  • Verwende gleiche Linktexte nur, wenn das Ziel identisch ist; vermeide „Mehr“, „Hier“, „Weiterlesen“ ohne Kontext.

4. Tabellen nur für Daten

  • Setze Tabellen ausschließlich für Daten ein, nicht fürs Layout.

  • Markiere Kopfzeilen (th) und achte auf eine verständliche Beschriftung/Einleitung zur Tabelle.

5. PDFs und Downloads

  • Bevorzuge HTML‑Seiten, wenn möglich. Wenn PDF nötig ist,: barrierefrei erzeugen (Tags, Lesereihenfolge, Lesezeichen).

  • Nenne Dateityp und ‑größe im Linktext, damit Nutzer:innen die Entscheidung kennen.

6. Audio/Video zugänglich machen

  • Stelle Untertitel für Videos und Transkripte für Audio bereit; bei komplexen Szenen ggf. Audiodeskription.

  • Vermeide Autoplay und sorge für bedienbare Player‑Kontrollen per Tastatur.

7. Formulare verständlich beschriften

  • Achte auf klare Labels, Beispieltexte und hilfreiche Fehlermeldungen in einfacher Sprache.

  • Prüfe im Frontend kurz mit der Tastatur: Tab‑Reihenfolge logisch, Fokus sichtbar, Buttons eindeutig.

8. Sprache und Lesbarkeit

  • Schreibe klar und direkt, erkläre Abkürzungen beim ersten Auftreten, vermeide Fachjargon oder erkläre ihn.

  • Setze die korrekte Inhaltssprache im System, halte Übersetzungen konsistent und nutzerorientiert.

9. RTE (Texteditor) richtig einsetzen

  • Nutze semantische Funktionen (Überschrift, Liste, Zitat, Tabelle) – keine Farbe/Größe als Bedeutungsträger.

  • Vermeide Text‑im‑Bild. Wenn eine Grafik Text enthält, sorge für denselben Inhalt im Fließtext.

10. Kurzer Selbsttest vor der Freigabe

  • Tastaturtest: Mit Tab durch die Seite gehen – ist alles erreichbar und der Fokus sichtbar?

  • Screenreader‑Schnellcheck: Stimmt die Überschriftenstruktur, sind Links und Bilder verständlich?

Praktische Mini‑Checkliste pro Seite

  1. Struktur: H2/H3 logisch, keine „fett“ simulierten Überschriften.

  2. Bilder: Alt‑Texte sinnvoll, Deko‑Bilder leer.

  3. Links: Ziel klar, bei Downloads Dateityp/Größe genannt.

  4. Tabellen: Nur für Daten, mit Kopfzeilen.

  5. Medien: Untertitel/Transkript vorhanden, kein Autoplay.

  6. Formulare: Labels klar, Fehlermeldungen verständlich.

  7. Sprache: Kurz, aktiv, ohne unnötigen Jargon; korrekte Inhaltssprache gesetzt.

  8. Tastatur: Alles erreichbar, Fokus ersichtlich.

­

Hol Dir die Mini-Checkliste als PDF

Tipps für Dein Redaktions‑Team

  • Gemeinsamer Stilguide: Definiere Beispiele für gute Alt‑Texte, Linktexte, Überschriften‑Muster und Tabellen.

  • Vorlagen nutzen: In TYPO3 Content‑Elemente und RTE‑Konfiguration so nutzen, wie vorgesehen – das sichert Semantik.

  • Qualität sichern: Verankere die Mini‑Checkliste als Freigabeschritt; stichprobenartig mit Screenreader prüfen.

Was wir als Agentur technisch (und für Dich) übernehmen

  • Technische Basis: Barrierefreie Templates, sinnvolle Semantik, Kontraste, Fokus‑Stile, Tastaturbedienbarkeit, ARIA nur wo nötig.

  • Komponenten & Formulare: Zugängliche UI‑Bausteine, valide Formulare mit klaren Fehlermeldungen, Medien‑Player.

  • Redaktions‑Support: Schulung, individuelle Checkliste in TYPO3, sinnvolle Voreinstellungen und Hinweise im Backend.


Du willst sicherstellen, dass Deine Inhalte barrierefrei sind – und dass die technische Basis wirklich passt? Melde Dich gern: Wir prüfen Deine bestehende TYPO3‑Installation auf Barrierefreiheit, unterstützen Dich bei Redaktion und Schulung und setzen alle technischen Maßnahmen für Dich um. Schreib uns einfach, wenn Du eine kurze Ersteinschätzung oder einen konkreten Maßnahmen‑Plan wünschst. Wir freuen uns auf Dich!

Telefon: +49 (0)721 35456-62   |   Mail: info(at)werkraum(dot)net

­

Erfahre mehr über digitale Barrierefreiheit

Kategorien

Allgemeine News TYPO3

Hat Dir der Artikel gefallen?

werkraum News