fixing-accessibility: Agent-Skill für Barrierefreiheit im Frontend

LinkibelickTool

ibelick stellt mit fixing-accessibility einen Skill für KI-Coding-Assistenten bereit, der HTML- und UI-Code systematisch auf Barrierefreiheit prüft und minimal-invasive Korrekturen vorschlägt. Die Richtlinie deckt ARIA-Attribute, Tastaturbedienung, Fokus-Handling, Formularvalidierung und Farbkontraste anhand einer festen Prioritätenliste ab.

Das Wichtigste

  1. Installation über den Befehl npx skills add https://github.com/ibelick/ui-skills --skill fixing-accessibility für unterstützte Entwicklungsumgebungen.
  2. Strukturierte Überprüfung anhand von Prioritäten: Zugängliche Namen (Accessible Names), Tastaturzugriff und Fokus-Handling werden als kritisch eingestuft.
  3. Pragmatischer Ansatz: Der Assistent soll exakte Codezeilen zitieren, Fehler kurz begründen und minimale, zielgerichtete Fixes vorschlagen, statt Komponenten neu zu schreiben.
  4. Native HTML-Elemente wie <button> oder <input> werden explizit gegenüber ARIA-Rollen-Hacks bevorzugt.
  5. Klare Leitlinien für Dialoge und Formulare: Fokus-Fallen in Modals, Fehlermeldungen via aria-describedby und aria-invalid sowie Verzicht auf reine Placeholder-Labels.

Warum das relevant ist

KI-generierter Frontend-Code leidet häufig unter Barrierefreiheitsmängeln wie rein dekorativen Klick-Divs oder fehlenden Formularbeschriftungen. Spezialisierte Skills lenken Sprachmodelle an, WCAG-Standards systematisch zu beachten, ohne ungefragt Refactorings im gesamten Projekt auszulösen.

Einordnung

Das Tool fungiert als präzises Regelwerk (System-Prompt/Skill) für Coding-Agents. Statt allgemeiner Ratschläge liefert es klare 'Before/After'-Muster und Handlungsbeschränkungen ('Tool Boundaries'). Die Anweisung, nativen Elementen Vorrang vor komplexen ARIA-Konstrukten zu geben und bestehende UI-Bibliotheken nicht eigenmächtig auszutauschen, verhindert typische Fehlentscheidungen von KI-Assistenten im Entwicklungsalltag.

Erwähnte Links

Gefunden in

Zusammenfassung von KI erstellt (Gemini 3.8 Flash, 27. September 2026). Sie kann Fehler enthalten – maßgeblich ist die Originalquelle.

Ähnliche Einträge

Inhaltlich ähnlich, ermittelt über die KI-Suche.

  • Link:Jakub Krehel

    Skills: Agenten-Toolkit zur Optimierung von UI und UX

    Jakub Krehel stellt eine Sammlung spezialisierter Agent Skills vor, die Frontend-Teams bei Interface-Details wie Typografie, OKLCH-Farben, Barrierefreiheit, Layouts und Microcopy unterstützen.

    KI & AI· Tool

  • Repository:vercel-labs/agent-skills

    Vercel Labs Agent Skills: Regelwerke und Prüfroutinen für KI-Coding-Agents

    Vercel Labs stellt mit Agent Skills eine standardisierte Sammlung von Instruktionen und Skripten für KI-Coding-Agents bereit. Das Repository bündelt Best Practices für Vercel-Optimierung, React- und Next.js-Performance, UI-Design sowie Dokumentation.

    31.253SterneJavaScript

    KI & AI· Sammlung

  • Repository:jakubkrehel/skills

    jakubkrehel/skills: Agent-Skills für UI- und Design-Engineering

    jakubkrehel/skills ist eine kuratierte Sammlung modularer Agent-Skills, die KI-Assistenten wie Claude Code fundiertes Wissen über Interface-Design, Typografie, Barrierefreiheit und UI-Engineering bereitstellen.

    5773SterneMarkdown

    KI & AI· Tool

  • X-Post:Adham Dannaway

    Agent Design Skills: UI-Feinschliff und Barrierefreiheit für KI-Agenten

    Designer Adham Dannaway empfiehlt eine Sammlung spezialisierter Agent-Skills von Jakub Krehel. Das Paket erweitert KI-Agenten um konkretes Fachwissen in den Bereichen UI-Design, Typografie, OKLCH-Farben, Barrierefreiheit, Layout und Product Writing.

    492Lesezeichen28.585Aufrufe

    KI & AI· Sammlung

  • Link:Tailwind Labs

    ui.sh: KI-Agenten-Fähigkeiten für Interface-Entwickler

    Die Macher von Tailwind CSS und Refactoring UI haben mit ui.sh eine Sammlung aufgabenorientierter Prompts und Workflows für KI-Agenten vorgestellt. Das Toolkit soll Entwicklern helfen, hochwertige Benutzeroberflächen zu erstellen.

    KI & AI· Tool

Zurück zur Wissensbasis

Lassen Sie uns über Ihr Projekt sprechen

Kontakt aufnehmen

Standorte

  • Mattersburg
    Johann Nepomuk Bergerstraße 7/2/14
    7210 Mattersburg, Austria
  • Wien
    Ungargasse 64-66/3/404
    1030 Wien, Austria

Dieser Inhalt wurde teilweise mithilfe von KI erstellt.