accessibility-check
Verificar conformidade de acessibilidade
Esta habilidade avalia componentes e páginas de UI em relação às diretrizes WCAG 2.1. Ela identifica problemas de acessibilidade e fornece correções específicas. Use-a para garantir que suas interfaces sejam utilizáveis por pessoas com deficiência.
スキルZIPをダウンロード
Claudeでアップロード
設定 → 機能 → スキル → スキルをアップロードへ移動
オンにして利用開始
テストする
「accessibility-check」を使用しています。 Check accessibility of this button: <button class="btn">Click me</button>
期待される結果:
- Problemas encontrados: Nome acessível ausente, sem estilos de foco visíveis
- Correção: Adicionar aria-label ou conteúdo de texto, garantir indicador de foco visível com contorno de 2px
- Critérios WCAG: 2.4.7 Focus Visible, 4.1.2 Name Role Value
- Exemplo de código: <button class="btn" aria-label="Submit form">Click me</button>
「accessibility-check」を使用しています。 Audit this form for WCAG compliance: <input type="email" placeholder="Email" />
期待される結果:
- Problemas: Elemento label explícito ausente, placeholder não é nome acessível
- Correção: Adicionar elemento <label> com htmlFor correspondendo ao id do input
- Critérios WCAG: 1.3.1 Info and Relationships, 3.3.2 Labels or Instructions
- Passa no teste de navegação por teclado
「accessibility-check」を使用しています。 Check color contrast of text with #999 color on #fff background
期待される結果:
- Taxa de contraste: 2.5:1 (falha no WCAG AA)
- WCAG 1.4.3 exige mínimo de 4.5:1 para texto normal
- Correção: Alterar a cor do texto para #595959 para obter proporção de 7:1
- Use a ferramenta de verificação de contraste de cores para validar
セキュリティ監査
安全This is a pure documentation skill containing WCAG 2.1 guidelines and accessibility audit templates. No executable code, network calls, filesystem access, or external commands are present. The skill operates solely through prompt-based content delivery. All 42 static findings are false positives from the scanner misinterpreting markdown formatting and documentation content as security threats.
リスク要因
🌐 ネットワークアクセス (2)
📁 ファイルシステムへのアクセス (1)
品質スコア
作れるもの
Revisão de acessibilidade de código
Revisar componentes React quanto à conformidade com WCAG antes de mesclar pull requests
Auditoria de design system
Auditar bibliotecas de componentes quanto a lacunas de acessibilidade e problemas de design inclusivo
Verificação de conformidade
Verificar se produtos atendem aos requisitos de acessibilidade para conformidade legal
これらのプロンプトを試す
Check accessibility of this button component. Is it keyboard accessible? Does it have proper focus states?
Audit this form for accessibility issues. Check labels, error messages, and keyboard navigation.
Perform a WCAG 2.1 AA accessibility audit of this page. Check perceivable, operable, understandable, and robust criteria.
Run both the accessibility check and UX audit on this dashboard. Focus on contrast, navigation, and ARIA usage.
ベストプラクティス
- Executar verificações de acessibilidade antes de cada release de recurso
- Combinar ferramentas de testes automatizados com testes manuais de teclado
- Incluir pessoas com deficiência nos testes de usuário quando possível
回避
- Usar texto de placeholder em vez de rótulos adequados de formulário
- Confiar apenas na cor para transmitir informações
- Adiar testes de acessibilidade até o fim do desenvolvimento