accessibility-compliance

Descripción general

¿Qué es accessibility-compliance?

accessibility-compliance es una habilidad práctica para desarrolladores frontend que necesitan implementar, auditar o mantener interfaces accesibles. Se centra en las directrices WCAG 2.2, patrones ARIA, navegación por teclado, soporte para lectores de pantalla y accesibilidad móvil. Esta habilidad ayuda a garantizar que tus proyectos web o en React sean utilizables por todas las personas, incluidas aquellas con discapacidades.

¿Quién debería usar esta habilidad?

• Ingenieros frontend que construyen o refactorizan componentes de UI
• Equipos que buscan cumplir con WCAG 2.2 Nivel AA o AAA
• Desarrolladores que añaden roles, estados y propiedades ARIA
• Cualquier persona responsable de auditorías de accesibilidad o diseño inclusivo

Problemas que resuelve

• Garantiza que las interfaces sean perceptibles, operables, comprensibles y robustas
• Proporciona patrones ARIA prácticos y técnicas de accesibilidad móvil
• Te ayuda a construir para usuarios de teclado, lectores de pantalla y táctiles
• Apoya el cumplimiento de normas legales y organizacionales de accesibilidad

Cómo usar

Pasos de instalación

1. Añade la habilidad a tu agente o proyecto con:

   npx skills add https://github.com/wshobson/agents --skill accessibility-compliance
   

2. Comienza con el archivo SKILL.md para obtener una visión general de las características y flujo de trabajo de accessibility-compliance.

3. Revisa los archivos de soporte para detalles de implementación:

   • references/aria-patterns.md: roles, estados y propiedades ARIA con ejemplos en React
   • references/mobile-accessibility.md: tamaño y espaciado de objetivos táctiles móviles y soporte para lectores de pantalla
   • references/wcag-guidelines.md: principios WCAG 2.2, niveles de conformidad y ejemplos de código

Adaptación a tu proyecto

• Usa los patrones proporcionados como referencia, no como solución directa. Adapta ARIA, navegación por teclado y técnicas de accesibilidad móvil a tu base de código y framework de UI.
• Integra las comprobaciones de accesibilidad en tu flujo de desarrollo, especialmente al construir componentes o formularios personalizados.
• Prueba con tecnologías asistivas reales (por ejemplo, VoiceOver, TalkBack, NVDA) y navegación por teclado.

Cuándo usar accessibility-compliance

• Para auditar o corregir problemas de accesibilidad
• Al construir nuevos componentes de UI con diseño inclusivo
• Para asegurar paridad de accesibilidad entre móvil y escritorio
• Para cumplir con requisitos legales u organizacionales de accesibilidad

Preguntas frecuentes

¿Qué cubre accessibility-compliance?

Esta habilidad cubre las directrices WCAG 2.2, patrones ARIA, navegación por teclado, gestión del foco, formularios accesibles, objetivos táctiles móviles y soporte para lectores de pantalla. Proporciona ejemplos de código y buenas prácticas para proyectos web y en React.

¿Por dónde debería empezar?

Comienza con SKILL.md para una visión general, luego explora la carpeta references/ para patrones detallados y ejemplos de código. Los archivos references/aria-patterns.md y references/mobile-accessibility.md son especialmente útiles para la implementación práctica.

¿Esta habilidad es solo para React?

Aunque muchos ejemplos usan React, los principios y patrones aplican a cualquier framework frontend o proyectos con HTML/JS puro.

¿Esta habilidad garantiza el cumplimiento WCAG?

No. accessibility-compliance ofrece orientación y patrones, pero debes adaptarlos y probarlos en tu contexto. Siempre valida con usuarios reales y tecnologías asistivas.

¿Dónde puedo encontrar más recursos?

Consulta la carpeta references/ para guías y ejemplos de código seleccionados. Para ver la lista completa de archivos, abre la pestaña Files en Agent Skills Finder.