Accesibilidad
Solidiom está construido sobre el principio de que el software accesible no es opcional. Cada primitivo, componente y plantilla está diseñado y probado contra WCAG 2.2 Nivel AA y los patrones de la Guía de Prácticas de Autoría WAI-ARIA (APG).
Nuestro Compromiso
- Cada primitivo interactivo implementa el patrón APG correspondiente de teclado y ARIA
- Cada primitivo incluye evidencia de accesibilidad comprometida (
evidence.json) - Cada preset de tema cumple los mínimos de contraste AA tanto en modo claro como oscuro
- Los escaneos automatizados de axe-core se ejecutan en cada build para los 52 primitivos
- La navegación por teclado está documentada y probada para cada elemento interactivo
Evidencia
Nuestra evidencia de accesibilidad es verificada por máquina y comprometida en el repositorio:
Pruebas Automatizadas
| Capa | Cobertura | Herramienta | Evidencia |
|---|---|---|---|
| Primitivos (52) | 100% | axe-core 4.10.2 | docs/axe-scan-results.md |
| Navegación por teclado | 100% | Auditoría manual | docs/keyboard-audit-results.md |
| Contraste de color | Todos los presets | Auditoría de tema | pnpm run audit:preset-themes |
| Gestión del foco | Todos los overlays | Vitest browser | Evidencia por primitivo |
Evidencia por Primitivo
Cada uno de los 52 primitivos tiene un archivo packages/<name>/docs/accessibility/evidence.json comprometido que contiene:
- Resultados del escaneo axe-core (violaciones, passes, incompletos)
- Contrato de navegación por teclado
- Atributos y roles ARIA utilizados
- Expectativas de comportamiento del lector de pantalla
Pruebas con Lector de Pantalla
| Tecnología de Asistencia | Estado | Plataforma |
|---|---|---|
| VoiceOver | Documentado | macOS/iOS |
| NVDA | Planificado (Fase 4) | Windows |
| JAWS | Planificado (Fase 4) | Windows |
| TalkBack | Planificado (Fase 4) | Android |
Cumplimiento WCAG 2.2 AA
Todos los primitivos y componentes cumplen con WCAG 2.2 Nivel AA. Nuestra auditoría completa está documentada en docs/qa/wcag-2.2-aa-audit.md y cubre:
- Perceptible — HTML semántico, roles ARIA, contraste de texto 4.5:1+, tipografía en
rem - Operable — navegación completa por teclado, sin trampas, foco visible, objetivos táctiles de 24px+
- Comprensible — atributos
lang, sin cambios inesperados, inputs etiquetados - Robusto — ARIA válido, regiones en vivo para contenido dinámico
Cumplimiento de Patrones APG
Los primitivos interactivos implementan patrones de WAI-ARIA Authoring Practices:
| Patrón | Primitivos |
|---|---|
| Accordion | accordion |
| Dialog (Modal) | dialog, alert-dialog |
| Menu/Menubar | menu, context-menu, dropdown-menu |
| Tabs | tabs |
| Combobox | combobox, select |
| Listbox | listbox, select |
| Tooltip | tooltip |
| Switch | switch |
| Slider | slider |
| Tree View | tree |
| Alert | alert, toast |
Reportar Problemas
Si encuentras una barrera de accesibilidad en Solidiom:
- Abre un issue en GitHub con la etiqueta
accessibility - Incluye el primitivo/componente afectado
- Describe la barrera y la tecnología de asistencia utilizada
- Priorizamos los problemas de accesibilidad como bugs críticos
Recursos
Resumen de Evidencia
Las 52 primitivas analizadas superaron con cero infracciones.
Evidencia por Primitiva
| Primitiva | Superadas | Infracciones | Incompletas | Resultado |
|---|---|---|---|---|
| accordion | 8 | 0 | 0 | pass |
| alert | 9 | 0 | 1 | pass |
| alert-dialog | 16 | 0 | 0 | pass |
| avatar | 1 | 0 | 0 | pass |
| badge | 1 | 0 | 0 | pass |
| breadcrumb | 12 | 0 | 0 | pass |
| button | 3 | 0 | 0 | pass |
| calendar | 20 | 0 | 1 | pass |
| card | 3 | 0 | 0 | pass |
| carousel | 13 | 0 | 0 | pass |
| checkbox | 12 | 0 | 0 | pass |
| collapsible | 8 | 0 | 0 | pass |
| combobox | 13 | 0 | 0 | pass |
| command-palette | 3 | 0 | 0 | pass |
| context-menu | 1 | 0 | 0 | pass |
| data-table | 5 | 0 | 0 | pass |
| date-picker | 1 | 0 | 0 | pass |
| dialog | 15 | 0 | 0 | pass |
| drawer | 14 | 0 | 1 | pass |
| empty-state | 7 | 0 | 0 | pass |
| field | 9 | 0 | 1 | pass |
| hover-card | 1 | 0 | 0 | pass |
| input | 5 | 0 | 0 | pass |
| input-otp | 10 | 0 | 0 | pass |
| kbd | 1 | 0 | 0 | pass |
| label | 1 | 0 | 0 | pass |
| listbox | 16 | 0 | 0 | pass |
| menu | 8 | 0 | 0 | pass |
| meter | 1 | 0 | 0 | pass |
| navigation-menu | 18 | 0 | 1 | pass |
| pagination | 6 | 0 | 0 | pass |
| popover | 8 | 0 | 0 | pass |
| progress | 11 | 0 | 0 | pass |
| radio-group | 13 | 0 | 0 | pass |
| resizable-panels | 13 | 0 | 0 | pass |
| scroll-area | 2 | 0 | 0 | pass |
| select | 10 | 0 | 1 | pass |
| separator | 10 | 0 | 0 | pass |
| sheet | 16 | 0 | 0 | pass |
| skeleton | 1 | 0 | 0 | pass |
| slider | 9 | 0 | 0 | pass |
| spinner | 9 | 0 | 0 | pass |
| switch | 12 | 0 | 0 | pass |
| tabs | 16 | 0 | 0 | pass |
| toast | 10 | 0 | 0 | pass |
| toggle | 8 | 0 | 0 | pass |
| toggle-group | 12 | 0 | 0 | pass |
| toolbar | 12 | 0 | 0 | pass |
| tooltip | 1 | 0 | 0 | pass |
| tree | 14 | 0 | 0 | pass |
| virtual-list | 9 | 0 | 0 | pass |
| visually-hidden | 4 | 0 | 0 | pass |