check-accessibility

Skill do Claude'a, który przeanalizuje Twoje komponenty UI pod kątem dostępności. Sprawdza semantykę HTML, atrybuty ARIA, nawigację klawiaturą, kontrast kolorów, rozmiary obszarów klikania i wsparcie dla czytników ekranu. Porównuje kod z najnowszymi standardami WCAG 2.2 i WAI-ARIA, identyfikuje problemy z podziałem na poziomy ważności (krytyczne, wysokie, średnie, niskie) i wskazuje konkretne kryteria sukcesu do naprawy.

1. Zainstaluj skill w swoim projekcie Claude'a, umieszczając pliki z repozytorium AgnosticUI w katalogu .claude/skills/check-accessibility.

2. Upewnij się, że w Twoim projekcie istnieje plik .claude/PROJECT_CONTEXT.md zawierający informacje o strukturze projektu i zasadach dostępności — skill będzie go czytać na początku analizy.

3. Wpisz komendę /check-accessibility wraz z nazwą komponentu, który chcesz sprawdzić. Możesz podać nazwę komponentu (np. button, alert), ścieżkę do pliku (np. v2/lib/src/components/Button.ts) lub wzorzec pasujący do wielu plików.

4. Skill automatycznie wyszuka najnowsze standardy WCAG 2.2 i WAI-ARIA dla Twojego typu komponentu, pobierze dokumentację W3C w razie potrzeby, zlokalizuje pliki komponentu w projekcie i przeanalizuje kod.

5. Analiza obejmie sprawdzenie semantyki HTML, poprawności atrybutów ARIA, obsługi nawigacji klawiaturą, widoczności fokusa, wsparcia dla czytników ekranu, kontrastu kolorów (minimum 4.5:1 dla tekstu, 3:1 dla UI), rozmiarów obszarów interaktywnych (minimum 44x44 piksele) oraz obsługi prefers-reduced-motion.

6. Otrzymasz raport z listą znalezionych problemów, pogrupowanych według ważności, z odwołaniami do konkretnych kryteriów sukcesu WCAG 2.2.