ASD

Accessibility Compliance

Implementa interfaces conformes con WCAG 2.2, con accesibilidad móvil, patrones de diseño inclusivo y soporte para tecnologías de asistencia.

Estrellas
38.8k

en todo el repo

Actividad
47

0–100, la ruta de este skill

Actualizado
hace 2 meses

último commit aquí

Commits
1

últimos 90 días

Contexto
601 tok

64 tok en reposo

Paquete
5 archivos

51 KB

Instalar

Funciona con cualquier agente que lea SKILL.md

npx -y skills add wshobson/agents --skill accessibility-compliance --agent claude-code

Se instala solo en este repositorio.

Qué hace

  • Implementa patrones WCAG 2.2 nivel AA/AAA en interfaces web y móviles
  • Añade navegación por teclado, gestión de foco y focus trapping en componentes
  • Crea formularios accesibles con etiquetado correcto y regiones live para anuncios dinámicos
  • Ajusta soporte para prefers-reduced-motion, alto contraste y zoom al 200%
  • Audita accesibilidad y corrige violaciones comunes (alt text, contraste, trampas de foco)

Úsalo cuando

  • Implementar cumplimiento WCAG 2.2 nivel AA o AAA
  • Construir interfaces accesibles para lectores de pantalla
  • Añadir navegación por teclado a componentes interactivos
  • Auditar accesibilidad y corregir violaciones

No lo uses cuando

    Qué lo activa

    Di cualquiera de estas frases y el agente debería cargar este skill.

    • Audita esta página según WCAG 2.2 y dime qué violaciones tiene
    • Añade navegación por teclado y focus trapping a este modal
    • Haz este formulario accesible con etiquetas y regiones live

    SKILL.md

    En inglés

    Accessibility Compliance

    Master accessibility implementation to create inclusive experiences that work for everyone, including users with disabilities.

    When to Use This Skill

    • Implementing WCAG 2.2 Level AA or AAA compliance
    • Building screen reader accessible interfaces
    • Adding keyboard navigation to interactive components
    • Implementing focus management and focus trapping
    • Creating accessible forms with proper labeling
    • Supporting reduced motion and high contrast preferences
    • Building mobile accessibility features (iOS VoiceOver, Android TalkBack)
    • Conducting accessibility audits and fixing violations

    Detailed patterns and worked examples

    Detailed pattern documentation lives in references/details.md. Read that file when the navigation tier above is insufficient.

    Best Practices

    1. Use Semantic HTML: Prefer native elements over ARIA when possible
    2. Test with Real Users: Include people with disabilities in user testing
    3. Keyboard First: Design interactions to work without a mouse
    4. Don't Disable Focus Styles: Style them, don't remove them
    5. Provide Text Alternatives: All non-text content needs descriptions
    6. Support Zoom: Content should work at 200% zoom
    7. Announce Changes: Use live regions for dynamic content
    8. Respect Preferences: Honor prefers-reduced-motion and prefers-contrast

    Common Issues

    • Missing alt text: Images without descriptions
    • Poor color contrast: Text hard to read against background
    • Keyboard traps: Focus stuck in component
    • Missing labels: Form inputs without associated labels
    • Auto-playing media: Content that plays without user initiation
    • Inaccessible custom controls: Recreating native functionality poorly
    • Missing skip links: No way to bypass repetitive content
    • Focus order issues: Tab order doesn't match visual order

    Testing Tools

    • Automated: axe DevTools, WAVE, Lighthouse
    • Manual: VoiceOver (macOS/iOS), NVDA/JAWS (Windows), TalkBack (Android)
    • Simulators: NoCoffee (vision), Silktide (various disabilities)

    Reproducido de wshobson/agents bajo licencia MIT. Leer esta página en markdown.

    Archivos

    5 archivos en el paquete. Solo se lee SKILL.md al activarse — las referencias se cargan si el skill decide que las necesita.

    Detalles

    Creador
    wshobson
    Licencia
    MIT
    Recursos incluidos
    referencias
    Repositorio
    wshobson/agents
    Código fuente
    Ver SKILL.md

    Etiquetas

    Más de wshobson/agents

    Este repo incluye 180 skills. Si instalas uno, normalmente ya tienes los demás.

    Úsalo al seleccionar y colocar iconos, imágenes, SVGs, diagramas o infografías de apoyo aprobados en un PPTX editable.

    Costo de contexto al activarse
    344 tok
    Tamaño del paquete
    2 archivos
    Última actualización
    hace 26 días
    documentos

    Úsalo cuando pidan optimizar un prompt, mejorar su rendimiento, diseñar una plantilla, aplicar chain-of-thought, few-shot prompting o técnicas avanzadas de prompt engineering para producción.

    Costo de contexto al activarse
    1.3k tok
    Tamaño del paquete
    10 archivos
    Última actualización
    el mes pasado
    herramientas desarrollo

    Úsalo al redactar o reparar una especificación JSON con coordenadas explícitas para un PPTX editable.

    Costo de contexto al activarse
    489 tok
    Tamaño del paquete
    2 archivos
    Última actualización
    hace 26 días
    documentos

    Úsalo para validar o reparar un PPTX editable en cuanto a geometría, accesibilidad, editabilidad nativa, linaje de fuente e integridad del paquete OOXML.

    Costo de contexto al activarse
    409 tok
    Tamaño del paquete
    2 archivos
    Última actualización
    hace 26 días
    documentos

    Úsalo para analizar un PPTX de referencia en modo solo lectura: estructura, tema, tipografía, ritmo de layout, diagnósticos, catálogos de plantillas derivados o inspección segura del paquete OOXML.

    Costo de contexto al activarse
    689 tok
    Tamaño del paquete
    8 archivos
    Última actualización
    hace 26 días
    documentos

    Úsalo al preparar la narrativa, las fuentes y el contexto de diseño para un nuevo deck PPTX editable.

    Costo de contexto al activarse
    415 tok
    Tamaño del paquete
    2 archivos
    Última actualización
    hace 26 días
    documentos

    Skills relacionados

    Integra el procesamiento de pagos de PayPal, con soporte para express checkout, suscripciones y gestión de reembolsos en flujos de comercio electrónico.

    Costo de contexto al activarse
    1k tok
    Tamaño del paquete
    2 archivos
    Última actualización
    hace 2 meses
    desarrollo apis

    Construye sistemas RAG (Retrieval-Augmented Generation) para aplicaciones LLM con bases de datos vectoriales y búsqueda semántica, integrando conocimiento externo.

    Costo de contexto al activarse
    1.1k tok
    Tamaño del paquete
    2 archivos
    Última actualización
    el mes pasado
    desarrollo apis

    Construye servicios backend de Node.js listos para producción con Express/Fastify, cubriendo middleware, manejo de errores, autenticación, bases de datos y diseño de APIs.

    Costo de contexto al activarse
    499 tok
    Tamaño del paquete
    3 archivos
    Última actualización
    hace 2 meses
    desarrollo apis