Barrierefreiheit prüfen: So testen Sie Ihre Website selbst in 15 Minuten

Kollegen kontrollieren Bildschirminhalte im Team – Website selbst auf Barrierefreiheit testen, Schritt für Schritt

Sie müssen kein Experte sein, um die gröbsten Barrieren auf Ihrer Website zu finden. Mit ein paar einfachen Handgriffen, die jeder beherrscht, können Sie selbst die Barrierefreiheit prüfen – ohne teure Software, ohne Spezialwissen, in einer Viertelstunde. Niemand muss erst ein Budget freigeben, um die Barrierefreiheit prüfen zu lassen – der erste Blick gelingt Ihnen sofort und ganz allein. In jedem Audit sehe ich Mängel, die den Betreibern selbst aufgefallen wären, hätten sie nur gewusst, wie sie hinschauen müssen. Genau das zeige ich Ihnen hier: acht konkrete Selbst-Tests, die Sie sofort durchführen können, jeweils mit klarer Anleitung und dem, worauf es ankommt. Ich sage Ihnen ehrlich dazu, was Sie damit finden – und wo die Grenze liegt, an der ein professioneller Test übernehmen muss.

Können Sie Barrierefreiheit prüfen, ohne Experte zu sein?

Ja – zumindest die häufigsten und gröbsten Barrieren lassen sich ohne Fachwissen aufspüren. Viele der wichtigsten Kriterien erfordern keine Technik, sondern nur die richtige Vorgehensweise: die Maus weglegen, die Seite vergrößern, genau hinsehen. Diese Selbstprüfung ersetzt kein vollständiges Audit, aber sie zeigt Ihnen schnell, ob Ihre Website grundlegende Probleme hat, und schärft Ihren Blick für das Thema. Sie müssen also weder Entwickler noch zertifizierter Tester sein, um die Barrierefreiheit prüfen zu können – die meisten der gleich gezeigten Handgriffe verlangen nichts weiter als Ihren Browser und etwas Aufmerksamkeit.

Bevor wir loslegen, eine ehrliche Einordnung: Mit den folgenden Handgriffen finden Sie die offensichtlichen Barrieren – fehlende Tastaturbedienung, schwache Kontraste, fehlende Beschriftungen. Die feineren Kriterien, die echtes Erfahrungswissen verlangen, bleiben dabei außen vor. Nehmen Sie die Selbstprüfung daher als wertvollen ersten Schritt, nicht als Schlusspunkt. Eine strukturierte Checkliste der Anforderungen ergänzt die hier gezeigten Handgriffe gut.

Welche Werkzeuge Sie zum Prüfen brauchen

Die gute Nachricht: Um die Barrierefreiheit prüfen zu können, brauchen Sie fast nichts, was Sie nicht ohnehin haben. Ihr Browser bringt mit den eingebauten Entwicklerwerkzeugen – erreichbar über die rechte Maustaste und „Untersuchen“ – bereits alles mit, um Alt-Texte, Kontraste und die Code-Struktur zu prüfen. Die Tastatur haben Sie ebenfalls, und der Zoom steckt in jedem Browser.

Darüber hinaus helfen wenige kostenlose Ergänzungen: ein Screenreader wie das gratis erhältliche NVDA unter Windows oder das eingebaute VoiceOver auf dem Mac, dazu eine Browser-Erweiterung, die Überschriften-Strukturen sichtbar macht. Mehr ist für die Selbstprüfung nicht nötig. Erst wenn Sie es genauer und vollständiger wissen wollen, kommen professionelle Prüfwerkzeuge ins Spiel, die wir im Vergleich der Test-Tools ausführlich gegenüberstellen.

Test 1: Die Tastatur-Probe

Das ist der wichtigste Selbst-Test überhaupt – und der einfachste. Legen Sie die Maus beiseite und bedienen Sie Ihre Seite ausschließlich mit der Tastatur. Mit der Tab-Taste springen Sie von Element zu Element, mit Umschalt+Tab zurück, mit der Eingabetaste und der Leertaste aktivieren Sie Schaltflächen und Links. Arbeiten Sie sich so durch die gesamte Seite: durch das Menü, die Formulare, den Bestellprozess.

Achten Sie auf drei Dinge. Erstens: Erreichen Sie wirklich jedes Bedienelement, oder bleiben Links und Buttons unerreichbar? Zweitens: Sehen Sie immer deutlich, wo Sie gerade sind – ist der Tastaturfokus also sichtbar (das verlangt Kriterium 2.4.7)? Drittens: Bleiben Sie irgendwo hängen, etwa in einem Pop-up, aus dem Sie per Tastatur nicht mehr herauskommen? Solche Tastaturfallen sind ein gravierender Fehler. Lässt sich Ihre Seite nicht vollständig per Tastatur bedienen, verstößt sie gegen Kriterium 2.1.1 – und schließt damit alle aus, die keine Maus nutzen können. Betroffen sind dabei längst nicht nur blinde Menschen, sondern auch viele mit motorischen Einschränkungen, die auf die Tastatur oder darauf aufbauende Hilfsmittel angewiesen sind.

Aus der Praxis: Ich bitte Kunden im Audit oft, die Maus einfach wegzulegen und ihre eigene Startseite zu bedienen. Der Aha-Moment kommt fast immer: Das schicke Aufklapp-Menü reagiert nicht auf die Tastatur, der Cookie-Banner lässt sich nicht wegklicken, der Fokus ist unsichtbar. Diese eine Übung überzeugt mehr als jede Folie – weil man am eigenen Leib spürt, was es heißt, ausgesperrt zu sein.

Test 2: Der Zoom-Test

Viele Menschen vergrößern Webseiten, um sie lesen zu können. Prüfen Sie deshalb, ob Ihre Seite das aushält: Drücken Sie mehrfach Strg und Plus (am Mac Cmd und Plus), bis Sie bei 200 Prozent Vergrößerung sind. Schauen Sie sich nun genau an, was passiert.

Idealerweise fließt der Inhalt einfach um und bleibt vollständig lesbar, ohne dass Sie horizontal scrollen müssen – das verlangt Kriterium 1.4.10 (Reflow). Typische Fehler, die Sie jetzt sehen: Text wird abgeschnitten, Inhalte überlappen sich, Schaltflächen rutschen aus dem Bild, oder es erscheint ein horizontaler Scrollbalken. Funktioniert das Vergrößern bis 200 Prozent nicht sauber, haben Sie eine häufige und ernste Barriere gefunden, die viele sehbehinderte Menschen direkt betrifft. Und es sind mehr, als man denkt: Mit zunehmendem Alter lässt bei vielen die Sehkraft nach, sodass das Vergrößern von Schrift längst kein Nischenbedürfnis ist, sondern ein alltägliches.

Aus der Praxis: Eine Kundin war überzeugt, ihre Seite sei „responsiv und damit barrierefrei“. Beim Zoom auf 200 Prozent zerfiel das sorgfältig gebaute Layout: Die Navigation verdeckte den Text, der Warenkorb-Button verschwand komplett aus dem sichtbaren Bereich. Responsives Design für kleine Bildschirme und echte Zoom-Fähigkeit sind eben nicht dasselbe – ein Unterschied, den dieser simple Test sofort sichtbar macht.

Test 3: Die Kontrast-Sichtprüfung

Schwache Kontraste sind die häufigste Barriere überhaupt. Einen ersten Eindruck bekommen Sie schon mit bloßem Auge: Wirkt Text hellgrau auf weißem Grund, ist blasse Schrift über einem Farbverlauf oder Foto platziert, kämpfen Sie selbst ein wenig beim Lesen? Jeder dieser Fälle ist ein begründeter Verdacht.

Genauer wird es mit den Entwicklerwerkzeugen Ihres Browsers: Klicken Sie mit der rechten Maustaste auf einen Text, wählen Sie „Untersuchen“, und viele Browser zeigen Ihnen direkt das Kontrastverhältnis an. Der Mindestwert nach Kriterium 1.4.3 liegt bei 4,5:1 für normalen Text. Für eine schnelle, exakte Prüfung einzelner Farbpaare nutzen Sie Access Contrast, unseren Kontrast-Checker – er gleicht Vorder- und Hintergrundfarbe sofort gegen die WCAG-Schwellen ab. Wie Sie Farben von Grund auf barrierefrei wählen, vertieft unser Ratgeber zu barrierefreien Farben. Wenn Sie nur einen einzigen Aspekt der Barrierefreiheit prüfen wollen, fangen Sie hier an: Kontrastfehler sind die häufigste Barriere und zugleich die, die Sie am schnellsten selbst erkennen und beheben lassen können.

Test 4: Der Bilder- und Alt-Text-Check

Blinde Menschen sind darauf angewiesen, dass Bilder eine Textalternative haben, die der Screenreader vorlesen kann. Prüfen Sie das stichprobenartig: Klicken Sie ein Bild mit der rechten Maustaste an, wählen Sie „Untersuchen“ und sehen Sie nach, ob das img-Element ein gefülltes alt-Attribut hat. Fehlt es ganz, ist das Bild für blinde Nutzer unsichtbar – ein Verstoß gegen Kriterium 1.1.1.

Achten Sie auch auf die Qualität: Ein Alt-Text wie „bild123.jpg“ ist so gut wie keiner. Aussagekräftig beschreibt er, was auf dem Bild zu sehen ist und welche Information es transportiert. Rein dekorative Bilder hingegen sollten ein leeres Alt-Attribut tragen, damit der Screenreader sie überspringt. Diese Unterscheidung – informativ versus dekorativ – ist der häufigste Stolperstein beim Thema Alternativtexte. Gehen Sie ruhig mehrere Bilder durch – gerade bei älteren Seiten finden Sie oft ganze Reihen von Bildern ganz ohne Textalternative, die für blinde Nutzer schlicht nicht existieren.

Test 5: Die Überschriften-Struktur

Screenreader-Nutzer springen oft von Überschrift zu Überschrift, um sich auf einer Seite zu orientieren. Dafür muss die Überschriften-Hierarchie logisch sein: genau eine H1, darunter H2 für die Hauptabschnitte, H3 für Unterpunkte – ohne Ebenen zu überspringen. Das verlangt Kriterium 1.3.1, das die korrekte Auszeichnung von Struktur sicherstellt.

Prüfen können Sie das mit einer kostenlosen Browser-Erweiterung, die die Überschriften-Gliederung einer Seite anzeigt. Achten Sie auf zwei typische Fehler: Erstens werden Überschriften oft nur optisch durch große, fette Schrift erzeugt, ohne echtes Überschriften-Element – für den Screenreader sind sie dann gar keine Überschriften. Zweitens springt die Hierarchie, etwa von H2 direkt zu H4, was die Orientierung stört. Beide Fehler sind weit verbreitet und für Screenreader-Nutzer unmittelbar spürbar – und beide finden Sie mit dem Gliederungs-Werkzeug in wenigen Sekunden.

Test 6: Der Screenreader-Schnelltest

Nichts zeigt Barrieren so deutlich wie der Screenreader selbst – und Sie brauchen dafür kein Geld. Unter Windows ist der kostenlose Screenreader NVDA in wenigen Minuten installiert, auf dem Mac ist VoiceOver bereits eingebaut und mit Cmd+F5 startklar. Schalten Sie das Hilfsmittel ein, schließen Sie die Augen und lassen Sie sich Ihre Seite vorlesen.

Achten Sie darauf, ob die Vorlesereihenfolge sinnvoll ist, ob Links und Schaltflächen aussagekräftig angekündigt werden („Link Startseite“ statt „Link, Link, hier klicken“) und ob Sie der Logik der Seite folgen können. Sie müssen kein Profi im Umgang mit dem Screenreader werden – schon die ersten Minuten Zuhören verraten Ihnen, ob die wichtigsten Elemente Ihrer Seite überhaupt sinnvoll ankommen. Wie Screenreader im Detail funktionieren, erklärt unser Ratgeber zu Screenreadern.

Aus der Praxis: Ein Geschäftsführer wollte partout nicht glauben, dass seine Seite ein Problem hat – bis ich ihn bat, selbst NVDA einzuschalten und sich die Startseite vorlesen zu lassen. Der Screenreader las die Hauptnavigation als Folge von zwölf Mal „Link“ vor, ohne ein einziges Ziel zu benennen, weil die Menüpunkte nur aus Symbolen ohne Text bestanden. Nach dreißig Sekunden Zuhören war die Diskussion beendet. Manchmal genügt es, einmal selbst hinzuhören.

Test 7: Die Farbe-allein-Probe

Information darf nie allein über Farbe vermittelt werden, sonst geht sie für farbfehlsichtige Menschen verloren – das verlangt Kriterium 1.4.1. Ein verblüffend einfacher Test deckt Verstöße auf: Betrachten Sie Ihre Seite einmal in Graustufen. Viele Betriebssysteme bieten dafür einen Graustufenmodus in den Einstellungen, oder Sie nutzen eine Browser-Erweiterung. Noch einen Schritt weiter geht ein wenig bekanntes Werkzeug direkt in Chrome: In den Entwicklertools lassen sich unter „Rendering“ über „Emulate vision deficiencies“ gezielt einzelne Farbfehlsichtigkeiten simulieren – Rotblindheit, Grünblindheit, Blaublindheit oder eine getrübte Sicht. So sehen Sie Ihre Seite nicht nur entfärbt, sondern genau so, wie sie ein farbfehlsichtiger Mensch wahrnimmt, und erkennen Probleme, die im reinen Graustufenbild noch unauffällig bleiben.

Ohne Farbe wird sofort sichtbar, wo Sie sich allein auf sie verlassen haben: Sind Links im Fließtext noch als Links erkennbar, oder unterscheiden sie sich nur durch eine Farbe, die nun verschwunden ist? Bleiben Pflichtfelder, Statusanzeigen und Diagramme verständlich? Was in Graustufen unklar wird, braucht ein zweites, farbunabhängiges Signal – eine Unterstreichung, ein Symbol, eine Beschriftung.

Test 8: Der Formular-Check

Formulare sind eine der häufigsten Barrierequellen, und einige Probleme finden Sie schnell selbst. Klicken Sie zuerst auf die Beschriftung eines Eingabefelds – etwa das Wort „E-Mail“ neben dem Feld. Springt der Cursor daraufhin ins Feld, ist das Label korrekt verknüpft (Kriterium 3.3.2); passiert nichts, fehlt die Verbindung, und der Screenreader weiß nicht, was einzugeben ist.

Lösen Sie dann bewusst einen Fehler aus, indem Sie das Formular unvollständig absenden. Achten Sie darauf, ob die Fehlermeldung klar benennt, was falsch ist und wo, oder ob nur ein rotes Feld ohne Erklärung erscheint. Eine verständliche, eindeutig zugeordnete Fehlermeldung ist Pflicht (Kriterium 3.3.1) – wie barrierefreie Formulare im Detail aussehen, zeigt unser Ratgeber zu Formularen. Diese beiden kleinen Handgriffe – das Label anklicken und einen Fehler provozieren – decken einen Großteil der typischen Formular-Barrieren auf, ohne dass Sie eine Sekunde Entwicklerwissen bräuchten.

Selbst-TestSo führen Sie ihn durchWorauf achten
TastaturMaus weglegen, nur Tab/EnterAlles erreichbar, Fokus sichtbar, keine Falle
ZoomStrg/Cmd + Plus bis 200 %Kein Abschneiden, kein horizontales Scrollen
KontrastAugenschein + DevTools „Untersuchen“Mindestens 4,5:1 bei normalem Text
Alt-TexteBild „Untersuchen“, alt-Attribut prüfenVorhanden und aussagekräftig
ÜberschriftenBrowser-Erweiterung für die GliederungEine H1, logische Hierarchie, echte Elemente
ScreenreaderNVDA (Windows) oder VoiceOver (Mac)Sinnvolle Reihenfolge, klare Ansagen
Farbe alleinSeite in Graustufen ansehenLinks, Status, Diagramme weiter erkennbar
FormulareLabel anklicken, Fehler auslösenLabel springt ins Feld, klare Fehlermeldung

Wie oft sollten Sie selbst prüfen?

Die Barrierefreiheit prüfen Sie am besten nicht nur ein einziges Mal. Jede Änderung an Ihrer Website – ein neues Plugin, ein überarbeitetes Layout, frische Inhalte – kann neue Barrieren einführen, ohne dass es jemandem auffällt. Sinnvoll ist es deshalb, die wichtigsten Selbst-Tests zur Routine zu machen: Wer regelmäßig die Barrierefreiheit prüfen geht, fängt Probleme früh ab, bevor sie sich festsetzen und teuer zu beheben sind.

In der Praxis hat sich ein einfacher Rhythmus bewährt. Führen Sie den Tastatur- und den Zoom-Test bei jeder größeren Änderung durch, kontrollieren Sie neue Inhalte direkt beim Einstellen auf Alt-Texte und Überschriften, und nehmen Sie sich einmal im Quartal Zeit für den vollständigen Durchgang aller acht Tests. So bleibt der Aufwand überschaubar und der Nutzen hoch – und Sie bemerken früh, wenn bei der Barrierefreiheit etwas aus dem Ruder läuft. Dieser kleine, regelmäßige Aufwand verhindert die böse Überraschung, dass eine einst saubere Seite nach Monaten voller Änderungen plötzlich voller neuer Barrieren steckt – ein Muster, das ich in Audits immer wieder sehe.

Was Sie mit der Selbstprüfung finden – und was nicht

Wenn Sie diese acht Tests durchgespielt haben, wissen Sie deutlich mehr über Ihre Website als zuvor. Sie haben die häufigsten und gröbsten Barrieren aufgespürt – und das ist eine Menge wert, denn genau diese Fehler betreffen die meisten Menschen. Wer regelmäßig selbst die Barrierefreiheit prüft, entwickelt zudem ein Gespür dafür, das in jede künftige Entscheidung einfließt. Schon die Gewohnheit, immer wieder die Barrierefreiheit prüfen zu wollen, macht Sie zu einem besseren Auftraggeber gegenüber Agenturen und Entwicklern – Sie wissen dann, wonach Sie fragen müssen.

Ebenso ehrlich muss ich die Grenze benennen. Eine Handprüfung erfasst, ähnlich wie ein automatischer Scanner, nur einen Teil der insgesamt rund fünfzig Erfolgskriterien – die offensichtlichen. Viele Kriterien verlangen geschultes Urteilsvermögen und den Test mit echten Nutzern assistiver Technologien, um zuverlässig bewertet zu werden. Ihre Selbstprüfung ist ein hervorragender Anfang, aber sie liefert keinen vollständigen, rechtssicheren Nachweis. Wie eine professionelle Prüfung auf allen Ebenen abläuft, lesen Sie im Ratgeber zum Barrierefreiheit-Test. Wenn Sie also selbst die Barrierefreiheit prüfen, betrachten Sie das Ergebnis als verlässlichen Hinweis, nicht als abschließendes Gutachten – die letzte Sicherheit kommt aus der Kombination von menschlicher Expertise und echten Nutzern.

Barrierefreiheit prüfen lassen: der nächste Schritt

Nach der manuellen Selbstprüfung ist der logische nächste Schritt der automatische Scan – und hier setzt unser kostenloser Access Score an. Er prüft Ihre Website automatisch gegen die WCAG 2.2, findet systematisch die maschinell erkennbaren Fehler über mehrere Seiten hinweg und übersetzt sie in verständliche Sprache. Was Sie von Hand stichprobenartig geprüft haben, erfasst Access Score vollständig und in Minuten – ein idealer zweiter Schritt, der Ihre eigenen Beobachtungen ergänzt und einordnet. Sie können damit die Barrierefreiheit prüfen, so oft Sie wollen, denn der Scan ist kostenlos und in Minuten erledigt, sodass sich der Status jederzeit aktuell halten lässt.

Auch hier bleibe ich ehrlich: Wie Ihre Handprüfung findet auch ein automatischer Scan nur einen Teil aller Kriterien. Den vollständigen, rechtlich belastbaren Nachweis – mit manueller Prüfung und echten Nutzern – liefert erst unser Tiefen-Audit Access Ready. Andere verkaufen Ihnen einen Schnelltest als Komplettlösung; wir begleiten Sie ehrlich vom Selbst-Check über den automatischen Scan bis zum belastbaren Zertifikat.

So gehen Sie vor

Mein Rat: Nehmen Sie sich heute die fünfzehn Minuten und gehen Sie die acht Tests durch – Tastatur, Zoom, Kontrast, Alt-Texte, Überschriften, Screenreader, Farbe und Formulare. Sie werden überrascht sein, wie viel Sie selbst entdecken, und wie sehr sich Ihr Blick auf die eigene Website verändert. Und es lohnt sich doppelt: Wer einmal selbst geprüft hat, versteht die späteren Ergebnisse eines Tiefen-Audits wie Access Ready viel besser und kann gezielter Prioritäten setzen, statt sich von einer langen Mängelliste erschlagen zu fühlen. Der schnellste nächste Schritt danach ist Access Score, unser kostenloser WCAG-Scan – er erfasst über mehrere Seiten hinweg in Minuten, was Ihre Stichprobe nur punktuell zeigen kann.

Wollen Sie es danach genauer wissen, ist ein kostenloser WCAG-Test Ihrer Website der mühelose nächste Schritt. Zeigt sich grundlegender Handlungsbedarf, führt der Weg zur Rechtssicherheit über ein zertifiziertes Tiefen-Audit mit echten Nutzern. Wie all das in den größeren Zusammenhang der digitalen Barrierefreiheit passt, lesen Sie in unserem Überblick. Selbst zu prüfen ist der beste erste Schritt, den Sie sofort und ohne Hürde tun können – den letzten gehen wir dann gemeinsam.

Bild von Lukas Maximilian Langer

Lukas Maximilian Langer

Als Gründer der IFDB GmbH setzt sich Lukas Maximilian Langer dafür ein, digitale Barrierefreiheit vom Pflichtthema zum Selbstverständnis zu machen. Sein Ziel: Websites, Apps und Dokumente, die für alle zugänglich sind – unabhängig von Einschränkungen.

Ihre Anfrage –
wir melden uns zeitnah zurück

Schritt 1 / 2 Anliegen

Worum geht es? Mehrfachauswahl möglich.