Entwickler & KI-Schnittstellen

Barrierefreiheit, nahtlos in Deinen Entwicklungs-Workflow integriert

Automatisierte WCAG-Validierungen direkt in der IDE, für AI Coding Agenten und in der CI/CD Pipeline verankert. Nutze unseren Open-Source-Local-MCP für kostenlose Scans auf localhost, frage Live-Audit-Daten im Editor ab und sichere jedes Release automatisiert ab.

Jetzt kostenlos starten

Model Context Protocol (MCP)

Verbinde Barrierefreiheit direkt mit Deinen KI-Agenten

navable bietet Dir zwei praktische MCP-Server: Validiere lokalen Code direkt während der Entwicklung auf localhost oder frage Live-Audit-Daten ab, ohne Deinen Editor zu verlassen.

Open Source

Local MCP – Localhost im Dev-Workflow validieren

Ermöglicht Deinen KI-Coding-Agenten tiefe Real-Browser-Scans über die axe-core Engine (optional Pa11y/HTMLCS). Der Server liefert WCAG 2.1 A+AA-Verstöße inklusive automatischem EN 301 549-Mapping und strukturiertem Fix-Plan.

Tools: run_accessibility_scan, generate_fix_plan, update_fix_status
Erzeugt eine .navable-plan.json, die Dein KI-Agent autonom abarbeitet

claude mcp add navable -- npx -y @navable/mcp

Pro-Tarif

Hosted MCP – Globale Audit-Daten direkt in der IDE

Verbinde VS Code, Cursor oder Windsurf mit Deinen zentralen Produktions- und Staging-Audits. Frage Deine KI nach aktuellen Scores, Top-Issues und Trends der gesamten Organisation – ganz ohne Kontextwechsel.

Überwachte URL-Sammlungen, Scores und Schweregrade direkt abfragen
Sicherer Endpunkt über mcp.navable.io via x-api-key-Authentifizierung

https://mcp.navable.io/   (Header: x-api-key)

Local MCP einrichten und Prüfgrenzen nachlesen

Open-Source-Agent-Skills

Ein wiederholbarer scan → fix → verify-Workflow

Kombiniere den MCP mit @navable/skills, damit Dein Agent einem konsistenten Prozess folgt statt zu improvisieren — mit detaillierten Fix-Guides für ARIA, Farbe, Formulare, Überschriften, Bilder, Tastatur, Landmarks, Sprache, Navigation und Tabellen.

scan-accessibility

Eine URL scannen, Fix-Plan erstellen, Fixes anwenden und verifizieren.

fix-accessibility

Eine bestehende .navable-plan.json fortsetzen und offene Punkte abarbeiten.

review-component

Den Quellcode einer Komponente auf Barrierefreiheit prüfen — ganz ohne Browser.

audit-page-structure

Landmarks, Überschriften-Hierarchie, Navigation und Dokument-Metadaten prüfen.

In den Skills-Ordner Deines Agenten installieren

cp -r skills/* .github/skills/   # Copilot
cp -r skills/* .claude/skills/   # Claude Code
cp -r skills/* .agents/skills/   # Cursor

CI/CD & DevOps-Automatisierung

Sichere jeden Deploy vollautomatisch auf Barrierefreiheit ab

Integriere WCAG-Checks direkt in Deine bestehende Bereitstellungs-Pipeline. Steuere Audits programmatisch, nutze automatisierte Qualitäts-Gates vor dem Release oder leite Echtzeit-Ergebnisse über Webhooks weiter.

Automatisierte Trigger: Löse tiefe Real-Browser-Audits nach jedem Deploy aus
Dynamisches URL-Management: Füge neue Pfade direkt aus Deinem Code hinzu
Echtzeit-Schnittstellen mit sicherer Header-Authentifizierung.
Webhook-Pipelines: Sende Audit-Events direkt an Deine internen Tools

curl -X POST https://app.navable.io/api/... \
  -H "x-api-key: $navable_API_KEY"

IDE-Fix-Prompts

Jeder Befund kommt mit einem Fix-Prompt

Füge einen fertigen Prompt in Copilot, Cursor oder ChatGPT ein. Das Problem, der betroffene Code und die Fix-Anweisungen sind inklusive. Kein Barrierefreiheits-Wissen nötig.

Klicke hier, um ein echtes Beispiel zu sehen, das navable erzeugt.

Eingebautes Barrierefreiheits-Wissen

Dein Agent erhält Expertenkontext statt Vermutungen

Der Open-Source-MCP stellt kuratierte, WCAG-fundierte Ressourcen bereit, damit Agenten Probleme gleich beim ersten Mal richtig beheben.

WCAG → EN-301-549-Mapping

Erfolgskriterien zu EN 301 549, Testbarkeit und axe-Regeln zugeordnet.

>50 Fix-Patterns

Vorher/Nachher-Code-Patterns pro axe-Regel, die Dein Agent anwenden kann.

WAI-ARIA-APG-Muster

Authoring-Practices-Leitfäden für Dialoge, Comboboxen und mehr.

Semantik-HTML-Guides

Implizite Rollen pro Element und korrekte Nutzung.

BFSG-Rechtskontext

Geltungsbereich, Glossar und Durchsetzungskontext für die deutsche Compliance.

Bringe Barrierefreiheit in Deinen Stack

Kostenlos mit dem Open-Source-MCP starten — oder gehostete Audit-Daten und die API im Pro-Tarif freischalten.

Häufig gestellte Fragen

Ja. Der Local-MCP (@navable/mcp) und die Agent-Skills (@navable/skills) sind Open Source. Du kannst localhost scannen und den Fix-Workflow ganz ohne Konto nutzen. Der gehostete MCP (Live-Audit-Daten) und die REST-API gehören zum Pro-Tarif.

Mit jedem MCP-kompatiblen Client. Beispielsweise VS Code, GitHub Copilot, Cursor, Windsurf und Claude Code. Die Skills installierst Du einfach in .github/skills (Copilot), .claude/skills (Claude Code) oder .agents/skills (Cursor).

Er führt einen echten Browser mit axe-core gegen Deine localhost-Seiten aus und liefert WCAG-2.1-Level-A+AA-Verstöße mit EN-301-549-Mapping. Optional kannst Du eine zweite Engine (Pa11y/HTMLCS) für noch präzisere Ergebnisse aktivieren.

Nutze die REST-API, um nach jedem Deploy ein Audit auszulösen und den Build bei kritischen Problemen fehlschlagen zu lassen. Höhere Tarife bieten Dir zudem Webhook-Integrationen, um Ergebnisse direkt in Deine Tools zu pushen.

Nein. Der Local-MCP scannt Deinen laufenden Dev-Server in Deiner eigenen Umgebung und schreibt den Fix-Plan in Dein Repo. Beim Open-Source-Scan-Workflow wird nichts hochgeladen.