Barrierefreiheit

Barrierefreiheit bei Internetseiten
Inhaltsverzeichnis
Barrierefreiheitsstärkungsgesetz………………………………………………………………………………………… 1
Eindeutige Seitentitel………………………………………………………………………………………………………..2
Seiten für Screenreader zugänglich machen………………………………………………………………………… 2
Sinnvolle Textformatierung……………………………………………………………………………………………….2
Verlinkungen……………………………………………………………………………………………………………………2
Einfache Navigation………………………………………………………………………………………………………… 3
Sitemap………………………………………………………………………………………………………………………….. 3
Sackgassen vermeiden……………………………………………………………………………………………………… 3
Verständliche Sprache……………………………………………………………………………………………………….3
Bilder……………………………………………………………………………………………………………………………..3
Design……………………………………………………………………………………………………………………………. 4
Page Speed Insights…………………………………………………………………………………………………………. 4
Barrierefreiheitsstärkungsgesetz
Das Barrierefreiheitsstärkungsgesetz (BFSG) trat am 28.06.2025 in Kraft.
Auf folgender Internetseite werden gesetzlichen Bestimmungen zur Barrierefreiheit, sowie
Hilfen und Erläuterungen veröffentlicht:
https://www.barrierefreiheit-dienstekonsolidierung.bund.de/Webs/PB/DE/gesetze-und-
richtlinien/barrierefreiheitsstaerkungsgesetz/barrierefreiheitsstaerkungsgesetz-node.html
„Das Barrierefreiheitsstärkungsgesetz betrifft Hersteller, Händler und Importeure von
bestimmen Produkten sowie Dienstleistungserbringer.
Kleinstunternehmen (Unternehmen, die weniger als zehn Personen beschäftigen und
entweder einen Jahresumsatz von höchstens 2 Millionen Euro erzielen oder dessen
Jahresbilanzsumme sich auf höchstens 2 Millionen Euro beläuft) sind vom Gesetz
teilweise ausgenommen.“
Damit sind private Webseiten und Webseiten für Kleinunternehmen wie
Handwerksbetriebe, Agenturen, Kursanbieter von der Pflicht zur Barrierefreiheit
ausgenommen. Dennoch sollte das Thema für alle, die Webseiten erstellen, mit
berücksichtigt werden.
Dabei ist der deutsche Begriff Barrierefreiheit leider nicht ganz passend. Er macht das
Wort Freiheit zu einer Negierung und fordert Unmögliches.
Passender wäre ein positiver Begriff wie Zugänglichkeit. Im Englischen heißt es
Accessibility – für uns ein ziemlicher Zungenbrecher. Immerhin trifft das besser und ist
auch positiv.
Barrierefreiheit bei Internetseiten, Carolyn Krüger 2026
1 / 4
Eindeutige Seitentitel
Achte darauf, dass die Titel konkret, eindeutig und einzigartig sind, damit sich die
UserInnen auf der Website gut zurechtfinden.
Seiten für Screenreader zugänglich machen
Menschen mit Sehbehinderung nutzen Webseiten meist über Screenreader. Daher sollten
die Seiten gut für Screenreader lesbar sein. Die Seite soll gut gegliedert sein mit
Überschriften und Textteilen. Überschriften müssen als solche gekennzeichnet sein (und
nicht einfach nur fett geschrieben). Ablenkende Seitenleisten und mehrspaltigen Text
vermeiden. Die Hauptüberschrift (=Seitentitel) soll die HTML-Größe H1 haben. Etwas
kleinere Kapitelüberschriften haben die Größe H2. Die Größen gehen bis hinunter zu H6,
wobei auf eine zu unübersichtliche Verschachtelung verzichtet werden sollte.
Menschen mit Sehbehinderung nutzen meist die Tastatur zur Navigation. Mit der Taste H
springen sie zum Beispiel zur nächsten Überschrift, die Taste F führt sie zum nächsten
Formularelement und die Taste K zum nächsten Link. Auch Menüs und Dropdown-
Funktionen sollten sich über die Tastatur verwenden lassen.
Kostenloser Screenreader NVDA: https://www.nvaccess.org/download/
Die Tastatursteuerung war eine Herausforderung für WordPress. Inzwischen sind die
aktuellen WordPress-Versionen besser an Screenreader angepasst.
Sinnvolle Textformatierung
Je besser ein Text strukturiert ist, desto besser können sich UserInnen darin orientieren
und genau die Inhalte finden, die sie interessieren. Arbeite mit Fettschrift, Kursivschrift,
Anführungszeichen und mit Listen, um für mehr Übersichtlichkeit zu sorgen. Dabei sollte
die Formatierung für die gesamte Website einheitlichen Regeln gehorchen.
Verlinkungen
Links sollen klar und einfach gekennzeichnet sein. Dafür hat HTML die Unterstreichung
und die Farbe blau vorgesehen. Beides ist im Lauf der Jahre schönerem Webdesign zum
Opfer gefallen. Zumindest sollten Links auf der gesamten Webseite eine einheitliche,
kontrastreiche Farbe haben. Links werden automatisch von Screenreadern erkannt und
vorgelesen, aber für Menschen mit Sehbehinderung, Rot-Grün-Schwäche oder mit
Smartphone bei hellem Sonnenschein wird es schwierig. Auch das hübsche Mouseover
bei Links hilft da nicht viel, wenn man bedenkt, dass über 70% der BesucherInnen mit
Mobilgeräten unterwegs sind. Besser ist es also, die Unterstreichung wieder einzuführen.
Wichtig ist es auch, Links nicht einfach kommentarlos hinzusetzen, sondern sie sollten
auch mit passenden Infos versehen sein – warum, wofür, wohin.
Barrierefreiheit bei Internetseiten, Carolyn Krüger 2026
2 / 4
Einfache Navigation
Diese sollte auf jeder Seite ganz oben zur Verfügung stehen und auch auf jeder Seite die
gleichen Punkte enthalten. Wechselt das Menü von Seite zu Seite, kann das verwirren
und überfordern.
Eine Breadcrumb-Navigation verbessert zusätzlich die Übersicht. Dabei wird oben auf
der Seite ein Linkpfad dargestellt, der zeigt, wo genau man sich innerhalb der Website
befindet und auf welcher Ebene. Durch den Klick auf die Elemente des Breadcrumb-
Menüs kann man zu höher gelegenen Ebenen zurückkehren.
Sitemap
Zusätzlich zum Menü ist eine Seite mit gut strukturierter Sitemap hilfreich, um den Aufbau
einer Website zu verstehen, ihre Inhalte zu erfassen und gezielt Content anzusteuern.
Die digitale Sitemap als XML-Datei ist eine wichtige Forderung von Suchmaschinen.
Während die Sitemap-Seite von Hand erstellt werden kann, gibt es in WordPress für die
digitale Erstellung eigene Plugins. Suchmaschinen-Plugins (SEO) erstellen die XML-
Dateien automatisch: Yoast SEO, Rank Math SEO oder All in One SEO.
Rank Math SEO bietet zusätzlich eine eigene Sitemap-Seite an, die bei Änderungen
automatisch aktualisiert wird.
Sackgassen vermeiden
Seiten ohne Menü oder Links können nicht nur für Menschen mit Sehbehinderung zu
Sackgassen werden: Sie können sich nicht mehr weiterbewegen und verlassen die
Website deshalb vielleicht frustriert. Achte darauf, dass es auf jeder Seite in irgendeine
Richtung weitergeht oder Nutzerinnen und Nutzer zumindest zur vorherigen Seite
zurückkehren können, ohne den Backbutton des Browsers benutzen zu müssen.
Verständliche Sprache
Verwende in deinen Texten, Videos und Audios eine klare Sprache. Verzichte auf
Fachbegriffe und unverständliche Kürzel oder erkläre sie vorher. Halte die Sätze kurz,
indem du für jeden Gedanken einen neuen Satz beginnst.
Damit hilfst du Menschen mit kognitiven Einschränkungen, aber auch den
Suchmaschinen, die mit Schachtelsatz deutsch auch nicht viel anfangen können. Daher
bieten SEO-Plugins auch eine Lesbarkeitsanalyse an.
Bilder
Gib jedem Bild eine schriftliche Beschreibung. Entweder als Bildunterschrift oder im
Textabsatz. Zusätzlich sollte den Bildern immer auch ein Alt-Text hinzugefügt werden.
Alt steht für Alternative und erscheint dann, wenn ein Bild auf dem Server aus irgendeinem
Grund verloren gegangen ist. Zum Beispiel, wenn es nachträglich umbenannt oder
versehentlich gelöscht wurde. Der Alt-Text wird auch von Suchmaschinen und
Screenreadern gelesen. Er sollte sich von dem Beschreibungstext unterscheiden.
Andernfalls kann der doppelte Inhalt verwirrend sein.
Barrierefreiheit bei Internetseiten, Carolyn Krüger 2026
3 / 4
Der Beschreibungstext sollte Hinweise auf das Bild enthalten. Etwa in der Art
„Johann Wolfgang von Goethe im Alter von 70 Jahren. Ölgemälde von J. K. Stieler, 1828,
Goethehaus Frankfurt am Main, wikipedia Commons“.
Während der Alt-Text erklärt, was sowieso zu sehen ist, wenn man sehen kann:
„Farbiges Bild eines Gemäldes von J. K. Stieler. Es stellt den 70jährigen Goethe dar, der
auf einem hölzernen Lehnstuhl sitzt und einen handgeschriebenen Brief in der rechten
Hand hält. Goethe schaut nach links aus dem Bild heraus.“
In WordPress kann man für jedes Bild eine Beschreibung und den Alt-Text verwenden.
Es gibt eine Ausnahme, nämlich die Beitragsbilder, die jedem Beitrag zugeordnet werden.
Zu diesem Zweck wird ein Plugin benötigt, zum Beispiel FSM Custom Featured Image
Caption.
Für den Arbeitsablauf ist es sinnvoll, alle Bilder bereits beim Hochladen im
Medienverzeichnis mit Beschreibung und Alt-Text zu versehen. Diese Angaben werden
dann beim Einfügen der Bilder in die Beiträge und Seiten automatisch integriert.
Design
Nach all den vorangegegangen Regeln und Kriterien ergibt sich wohl von selbst, dass
auch das gesamte Design der Website klar und übersichtlich gestaltet sein darf. Das
muss nicht in Langeweile erstarren. Die Kunst im Design besteht gerade darin, Klarheit
und Entschiedenheit mit Spannung zu verbinden. Texte sollen einen gewissen Kontrast
zum Hintergrund haben. WordPress selbst gibt im Editor Hinweise, wenn der Kontrast zu
niedrig ist. Allzu pastellene Farbkombinationen sind zu vermeiden. Letztlich werden
Webseiten heute hauptsächlich mit mobilen Geräten aufgerufen. Auch das bedeutet
bereits eine Reduktion auf das Wesentliche.
Es gibt aber auch die Möglichkeit, das gesamte Design auf besonders starken Schwarz-
Weiß-Kontrast zu reduzieren und dies als Option umschaltbar zu machen. Der
Darkmode kann in Mobilgeräten im System aktiviert werden. Für WordPress gibt es dafür
Plugins.
Page Speed Insights
Dies ist ein wichtiges Google Tool zur Messung von Webseiten. Zunächst die
Ladegeschwindigkeit der Website, getrennt nach Mobilgerät und Desktop.
In den Ergebnissen wird dann die Leistung nach vier Kriterien beurteilt:
Geschwindigkeit, Barrierefreiheit, Best Practises und SEO. Außerdem eine Prüfung
namens Core Web Vitals, die versucht, die Qualität der Benutzererfahrung
nachzuvollziehen. Diese Messungen geben einen Einblick auf eure Website aus Google-
Sicht. Jeder einzelne Punkt wird dazu detailliert erklärt.
https://pagespeed.web.dev
Barrierefreiheit bei Internetseiten, Carolyn Krüger 2026
4 / 4