Anleitung "Digitale Barrierefreiheit"

Klare und einfache Navigation
Eine klare und einfache Navigation ist essenziell für barrierefreies Webdesign. Nutzen Sie beschreibende Bezeichnungen und vermeiden Sie verschachtelte Menüs.

Alternative Texte für Bilder
Bilder sind ein wichtiger Bestandteil jeder Website. Um diese barrierefrei zu gestalten, sollten Sie alternative Texte (Alt-Texte) verwenden.

Kontraste und Farben
Ein hoher Kontrast zwischen Text und Hintergrund erleichtert das Lesen. Verwenden Sie Farben, die sich gut voneinander abheben, und achten Sie darauf, dass Ihre Website auch ohne Farben verständlich ist.

Skalierbare Schriftgrößen
Stellen Sie sicher, dass Ihre Texte skalierbar sind und bei Bedarf vergrößert werden können.

Anleitung Homepage - Typo3

Digitale Barrierefreiheit bedeutet, dass alle Menschen Ihre Inhalte uneingeschränkt wahrnehmen, verstehen und unter anderem mit Screenreadern bedienen können.

Achten Sie auf folgende Punkte bei der Inhaltserstellung:

Überschriftenstruktur: Strukturieren Sie die Inhalte unter dem Seitentitel (H1) logisch mit H2-Überschriften für Hauptabschnitte und H3 (bzw. H4) für untergeordnete Inhalte.
Sprache: Inhalte müssen mit der korrekten Sprache ausgezeichnet sein. Verwenden Sie für jede Sprachversion die entsprechende Seitensprache und mischen Sie keine Sprachen innerhalb einer Seite. Das ist wichtig für Screenreader, da diese die Inhalte sonst falsch vorlesen.
Links: Sprechende Linktexte verwenden („Zur Anmeldung“ statt „Hier klicken“).
Downloads: Verwenden Sie möglichst HTML-Seiten statt herunterladbarer Dateien. Falls Dateien (z. B. PDF, DOCX oder XLSX) notwendig sind, müssen diese digital barrierefrei sein. Kennzeichnen Sie im Linktext den Dateityp (z. B. „Leitfaden (PDF)“). Ist ein Dokument noch nicht barrierefrei, muss dies ebenfalls im Linktext angegeben werden (z. B. „Leitfaden (PDF – nicht barrierefrei)“). Diese Kennzeichnung ist nur eine Zwischenlösung: Nicht barrierefreie Dokumente müssen nach und nach barrierefrei aufbereitet oder durch barrierefreie HTML-Inhalte ersetzt werden.
Bilder: Versehen Sie Bilder mit einem aussagekräftigen Alternativtext, wenn sie für das Verständnis der Seite erforderlich sind. Rein dekorative Bilder (z. B. Fotos von Studierenden oder Gebäuden) benötigen keinen Alternativtext.
Videos: Videos mit Untertiteln und Kurzbeschreibung einbinden.
Kontrast bei Bild und Text: Prüfen Sie bei Elementen mit Text über Bildern immer, ob der Kontrast ausreichend ist. Texte müssen klar lesbar bleiben.
Tabellen: Nur für Daten verwenden, nicht für Layout.