Free
Keine Kreditkarte nötig0 $
Dauerhaft kostenlos
- Inspektor öffnen und navigieren
- Element-Karte
- 25 AI-Element-Fix-Generierungen einmalig
- Vorschau im Browser
- Desktop-Dock und mobiles Bottom-Sheet
Barrierefreiheits-Inspektor für WordPress
Vom Befund direkt zur betroffenen Stelle
Ein Klick im Testergebnis, und der Inspektor markiert das Element auf deiner Website – mit allen Details, die du zum Beheben brauchst.
Kein Suchen im Quelltext mehr: Der Barrierefreiheits-Inspektor zeigt dir jeden Befund dort, wo er entsteht, erklärt das Element und schlägt mit KI eine Lösung vor, die du sofort im Browser ausprobierst.
- Betroffene Elemente direkt auf der Seite markiert
- Element-Karte mit Rolle, Name, Größe und Sichtbarkeit
- AI-Element-Fix mit Vorschau im Browser
So funktioniert es
In vier Schritten vom Testergebnis zur Lösung
Der Inspektor verbindet den Barrierefreiheitstest mit deiner echten Website. Jeder Befund führt dich direkt zum Element, das ihn auslöst – ohne Entwicklerwerkzeuge und ohne Raten.
-
Schritt 1: Befund im Testergebnis öffnen
Jeder Befund im Barrierefreiheitstest listet die betroffenen Elemente. Klicke bei einem Element auf „Im Inspektor anzeigen“.
-
Schritt 2: Zur Stelle springen
Die Seite öffnet sich mit dem Inspektor. Das Element wird markiert, in den sichtbaren Bereich gescrollt und kurz hervorgehoben.
-
Schritt 3: Element und Befund prüfen
Die Element-Karte zeigt Typ, Rolle, Beschreibung, Größe und Sichtbarkeit. Mit „Zurück“ und „Weiter“ gehst du durch alle Fundstellen.
-
Schritt 4: Lösung ausprobieren und übernehmen
AI-Element-Fix schlägt eine Code-Korrektur vor und zeigt sie als Vorschau im Browser. Dauerhaft änderst du die Stelle im Editor oder Theme.
Element-Karte
Alles über das Element auf einen Blick
Die Element-Karte beschreibt das markierte Element so, wie Browser und Hilfstechnologien es sehen. So erkennst du, ob ein Befund am Inhalt, am Markup oder an einer Einstellung des Themes liegt.
-
Symbol, Typ und DOM-Pfad
Das Element wird mit Typ-Symbol, zugänglichem Namen und seinem Pfad im Dokument angezeigt, damit du es auch im Code wiederfindest.
-
Sichtbarkeit und Größe
Du siehst, ob das Element sichtbar oder ausgeblendet ist, welche Abmessungen es hat und ob es im Accessibility-Baum enthalten ist.
-
Rolle und Beschreibung
Rolle, Beschreibung und der zugängliche Name zeigen, was Screenreader für dieses Element ausgeben, ohne dass du die Entwicklerwerkzeuge öffnen musst.
Wenn keine eindeutige Markierung erscheint
Der Inspektor sagt dir, was los ist
Nicht jedes Element lässt sich auf der Seite einrahmen. Statt dich im Unklaren zu lassen, erklärt der Inspektor in jedem Fall, warum keine Markierung möglich ist und was du tun kannst.
KI-Funktion
AI-Element-Fix: Lösung vorschlagen, im Browser ausprobieren
Für das markierte Element erklärt dir die KI, warum der Befund wichtig ist, und schlägt eine konkrete Code-Korrektur vor. Mit einem Klick siehst du die Änderung als Vorschau direkt auf deiner Seite – und entscheidest dann, ob du sie übernimmst.
- Erklärt, warum der Befund wichtig ist
- Liefert Code-Vorschlag und Vorschau direkt im Browser
- Vorschau bleibt temporär und verändert deine Website nicht
- Lesen und Vorschau kostenlos, nur die Generierung zählt
Desktop und Smartphone
Ein Panel, das sich deiner Seite anpasst
Der Inspektor ist ein Werkzeug neben deiner Website, nicht darüber. Er lässt sich andocken, verschieben und ausblenden, damit du die markierte Stelle immer frei siehst – am großen Bildschirm wie auf dem Smartphone.
-
Dock am Desktop
Der Inspektor liegt rechts neben der Seite. Du kannst ihn nach links, oben oder unten verschieben, damit er nichts verdeckt.
-
Bottom-Sheet am Smartphone
Auf kleinen Bildschirmen öffnet sich der Inspektor von unten. Mit einer Wischgeste blendest du ihn aus und holst ihn zurück.
-
Ausblenden, wenn er stört
Ein Klick versteckt den Inspektor. Eine kleine Schaltfläche am Rand bringt ihn jederzeit wieder zurück.
Aus der Praxis
Typische Befunde, die der Inspektor sichtbar macht
Viele Barrieren sind im Backend unsichtbar und auf der Seite sofort klar. Drei Beispiele, bei denen der Sprung zur Stelle den Unterschied macht.
-
Mittel WCAG 1.4.1
Link nur durch Farbe erkennbar
Der Inspektor markiert den Link im Fließtext. AI-Element-Fix schlägt eine Unterstreichung oder ein zusätzliches Merkmal vor.
-
Mittel WCAG 1.3.1
Überschriftenreihenfolge
Eine Ebene wurde übersprungen. Du siehst sofort, welche Überschrift betroffen ist, und korrigierst die Ebene im Editor.
-
Ernsthaft WCAG 4.1.2
Schaltflächenname fehlt
Ein Icon-Button ohne Text. Die Element-Karte zeigt den leeren Namen, der Vorschlag ergänzt ein passendes aria-label.
Pläne & Kontingente
Der Inspektor ist in jedem Plan dabei
Markieren, navigieren und die Element-Karte lesen kannst du in allen Plänen. Nur die Zahl der KI-Generierungen für AI-Element-Fix richtet sich nach deinem Tarif – Vorschau und Lesen bleiben immer kostenlos.
Leistung
Keine Kreditkarte nötig Free
0 $
Basic
94,01 $ / Jahrinkl. 19 % USt.
Unsere Empfehlung Plus
177,31 $ / Jahrinkl. 19 % USt.
Premium
355,81 $ / Jahrinkl. 19 % USt.
Agency
1.069,81 $ / Jahrinkl. 19 % USt.
Inspektor öffnen und navigieren
Ja
Ja
Ja
Ja
Ja
Element-Karte
Ja
Ja
Ja
Ja
Ja
AI-Element-Fix-Generierungen
25 einmalig
50 / Monat
100 / Monat
1.000 / Monat
1.000 / Monat je Website
Vorschau im Browser
Ja
Ja
Ja
Ja
Ja
Desktop-Dock und mobiles Bottom-Sheet
Ja
Ja
Ja
Ja
Ja
Die Plananzeige im Freemius-Checkout ist maßgeblich für deine aktive Lizenz. Lesen und Vorschau bereits erzeugter Vorschläge verbrauchen kein Kontingent, nur die Generierung neuer Vorschläge.
Basic
Solider Einstieg94,01 $ / Jahr
entspricht 7,83 $ / Monat
79,00 $ netto + 15,01 $ USt. (19 %)
- Inspektor öffnen und navigieren
- Element-Karte
- 50 AI-Element-Fix-Generierungen / Monat
- Vorschau im Browser
- Desktop-Dock und mobiles Bottom-Sheet
Plus
Unsere Empfehlung177,31 $ / Jahr
entspricht 14,78 $ / Monat
149,00 $ netto + 28,31 $ USt. (19 %)
- Inspektor öffnen und navigieren
- Element-Karte
- 100 AI-Element-Fix-Generierungen / Monat
- Vorschau im Browser
- Desktop-Dock und mobiles Bottom-Sheet
Premium
Für größere Websites355,81 $ / Jahr
entspricht 29,65 $ / Monat
299,00 $ netto + 56,81 $ USt. (19 %)
- Inspektor öffnen und navigieren
- Element-Karte
- 1.000 AI-Element-Fix-Generierungen / Monat
- Vorschau im Browser
- Desktop-Dock und mobiles Bottom-Sheet
Agency
Für mehrere Websites1.069,81 $ / Jahr
entspricht 89,15 $ / Monat
899,00 $ netto + 170,81 $ USt. (19 %)
- Inspektor öffnen und navigieren
- Element-Karte
- 1.000 AI-Element-Fix-Generierungen / Monat je Website
- Vorschau im Browser
- Desktop-Dock und mobiles Bottom-Sheet
Die Plananzeige im Freemius-Checkout ist maßgeblich für deine aktive Lizenz. Lesen und Vorschau bereits erzeugter Vorschläge verbrauchen kein Kontingent, nur die Generierung neuer Vorschläge.
Gut zu wissen
Fragen zum Barrierefreiheits-Inspektor?
Was der Inspektor darf, was er nicht verändert und wie die KI-Kontingente funktionieren.
1. Welche Pläne enthalten den Barrierefreiheits-Inspektor?
Alle. Der Inspektor gehört zum Barrierefreiheitstest und steht von Free bis Agency zur Verfügung. Unterschiede gibt es nur beim Kontingent für AI-Element-Fix-Generierungen.
2. Verändert der Inspektor meine Website?
Nein. Der Inspektor liest die Seite nur und markiert Elemente im Browser. Auch die Vorschau von AI-Element-Fix ist temporär: Sobald du die Seite neu lädst, ist sie weg. Dauerhafte Änderungen nimmst du wie gewohnt im Editor, im Theme oder in deinem Page Builder vor.
3. Sehen Besucher meiner Website den Inspektor?
Nein. Der Inspektor öffnet sich nur für angemeldete Nutzer mit Testrechten über einen gesicherten, zeitlich begrenzten Aufruf aus dem Testergebnis. Besucher sehen weder Markierungen noch das Panel.
4. Warum zeigt der Inspektor „Element nicht gefunden“?
Der Befund stammt aus einem gespeicherten Testergebnis. Wenn sich die Seite seither geändert hat, etwa durch Inhaltsänderungen, Caching oder dynamische Inhalte, passt der gespeicherte Selektor nicht mehr. Starte den Test erneut und öffne den Inspektor aus dem neuen Ergebnis.
5. Was zählt bei AI-Element-Fix gegen mein Kontingent?
Nur das Generieren eines neuen Vorschlags. Einen bereits erzeugten Vorschlag kannst du beliebig oft lesen, als Vorschau anwenden und zurücknehmen, ohne dass das Kontingent sinkt. Im Free-Plan stehen 25 Generierungen einmalig zur Verfügung, in den bezahlten Plänen ein monatliches Kontingent je Website.
6. Was bedeutet „Accessibility-Baum“ in der Element-Karte?
Der Accessibility-Baum ist die Struktur, die der Browser Hilfstechnologien wie Screenreadern bereitstellt. Die Element-Karte zeigt, ob das Element darin enthalten ist. „Ausgeschlossen“ heißt, dass ein Screenreader es nicht ausgibt – bei dekorativen Elementen gewollt, bei Bedienelementen ein Problem. Die Angabe wird bestmöglich aus dem Markup ermittelt und ersetzt keinen Test mit echter Hilfstechnologie.
Starte jetzt
Bereit, Befunde dort zu sehen, wo sie entstehen?
Teste deine Seite, spring per Klick zur betroffenen Stelle und probiere die Lösung aus, bevor du sie übernimmst.
Barrierefreiheits-Inspektor für WordPress – Befunde auf der Seite sehen
Der Barrierefreiheits-Inspektor von EZZE WCAG Pro schließt die Lücke zwischen Testergebnis und Website. Jeder Befund aus dem Barrierefreiheitstest lässt sich mit einem Klick auf der echten Seite öffnen: Das betroffene Element wird markiert, in den sichtbaren Bereich gescrollt und in einer Element-Karte mit Typ, Rolle, zugänglichem Namen, Größe, Sichtbarkeit und DOM-Pfad beschrieben. So verstehst du Accessibility-Probleme ohne Entwicklerwerkzeuge und ohne Suchen im Quelltext.
Mit „Zurück“ und „Weiter“ gehst du durch alle Fundstellen eines Befunds. Lässt sich ein Element nicht eindeutig markieren, etwa weil es unsichtbar ist, mehrfach vorkommt oder die Seite sich seit dem Test verändert hat, erklärt der Inspektor den Grund und den nächsten Schritt.
AI-Element-Fix: WCAG-Lösungen vorschlagen und im Browser prüfen
Für jedes markierte Element kann AI-Element-Fix eine Erklärung und einen konkreten Code-Vorschlag erzeugen, zum Beispiel ein fehlendes aria-label, eine korrigierte Überschriftenebene oder eine erkennbare Linkgestaltung. Die Vorschau wendet den Vorschlag nur temporär im Browser an, deine Website bleibt unverändert, bis du die Änderung im Editor, im Theme oder im Page Builder übernimmst. Lesen und Vorschau kosten kein Kontingent, nur die Generierung neuer Vorschläge.
Der Inspektor ist Teil des Barrierefreiheitstests und in allen Plänen von EZZE WCAG Pro enthalten. Als Dock am Desktop oder Bottom-Sheet am Smartphone passt er sich deiner Seite an – ein praktisches Werkzeug, um WCAG, BITV und BFSG nicht nur zu prüfen, sondern Barrieren dort zu beheben, wo sie entstehen.