Saltar al contenido principal
Somos Capaces

Accesibilidad

Accesibilidad integrada desde el diseño

Diseñamos Somos Capaces para reducir barreras desde el inicio — desde navegación y formularios hasta procesos de aplicación y experiencia móvil.

La accesibilidad no es una capa adicional. Es parte central de cómo construimos la plataforma.

Última actualización: 19 de mayo de 2026

Nuestro compromiso

WCAG 2.1 nivel AA como referencia

En Somos Capaces creemos que un portal de empleo para personas con discapacidad debe ser, ante todo, accesible. Trabajamos para cumplir con las pautas WCAG 2.1 nivel AA en todas las secciones del sitio. La accesibilidad no es un agregado — es parte central del diseño y desarrollo de la plataforma.

Implementado

Qué hemos implementado

Estas funcionalidades están activas en la versión actual del portal.

  • Navegación por teclado

    Todas las páginas se pueden navegar completamente con teclado, incluyendo enlace de salto al contenido.

    Tab→Shift+Tab→Enter

  • Contraste accesible

    Texto e íconos interactivos con contraste suficiente según WCAG 2.1 nivel AA.

    Aa7.1:1
    Aa4.8:1
    AA

  • Estructura semántica

    Encabezados jerárquicos, landmarks y roles ARIA para compatibilidad con tecnologías de asistencia.

    <main>landmark
    <h1>heading level 1
    <nav>aria-label

  • Textos alternativos

    Imágenes decorativas ocultas para lectores de pantalla. Imágenes informativas con alt descriptivo.

    alt="Candidato completando perfil"

  • Formularios descriptivos

    Campos con etiquetas visibles, mensajes de error claros y estados de foco visibles.

    Correo electrónico
    tu@correo.com
    Estado de foco visible

  • Diseño responsive

    Interfaz adaptada a cualquier tamaño de pantalla, desde móvil hasta escritorio.

  • Lectores de pantalla

    Probado para compatibilidad básica con NVDA, VoiceOver y otros lectores de pantalla comunes.

    NVDAVoiceOverJAWS

Implementación técnica

Cómo funciona la accesibilidad en la plataforma

Detalles de infraestructura accesible para usuarios técnicos, auditores y equipos de producto.

Gestión de foco

Foco programático en modales, drawers y flujos multi-paso. Trap de foco activo en paneles flotantes (admin drawer, modales de confirmación). focus-visible enforced via CSS. Enlace de salto skip-to-main visible al primer Tab en todas las páginas.

tabIndex={-1} ref.focus()
aria-modal="true"
onKeyDown: Escape → close

Patrones ARIA implementados

Aplicación consistente de roles y propiedades ARIA en componentes interactivos: tabs con role=tablist, checkboxes con aria-checked, botones de toggle con aria-pressed, estados de carga con aria-busy.

role="dialog"aria-labelledbyaria-expandedaria-selectedaria-busy="true"aria-live="polite"aria-requiredaria-invalid

Elementos interactivos

Todos los controles usan elementos semánticos nativos (<button>, <a>, <input>). Área de clic mínima de 44×44px en controles táctiles. Checkboxes y radios personalizados preservan input semántico con sr-only + label visible.

44pxÁrea mínima táctil

Movimiento reducido

Animaciones CSS usando transition- utilities de Tailwind CSS con duración corta (150–300ms). Preparado para respetar prefers-reduced-motiona nivel de configuración global de Tailwind en la siguiente iteración.

@media (prefers-reduced-motion: reduce)
* { animation: none; transition: none; }

Compatibilidad con lectores de pantalla

Flujos críticos (registro, aplicación, dashboard de candidato) verificados con NVDA + Firefox y VoiceOver + Safari. Feedback de estado operacional entregado mediante aria-live="polite"en guardados y actualizaciones de formulario. Iconos decorativos marcados con aria-hidden="true" de forma consistente.

En progreso

Qué seguimos mejorando

La accesibilidad es un proceso continuo. Auditamos el portal regularmente y priorizamos mejoras basadas en retroalimentación de usuarios reales.

  • Navegación completa por tecladoListo
  • Compatibilidad básica con lectores de pantallaListo
  • Contraste WCAG 2.1 AA en toda la interfazListo
  • Formularios con etiquetas y estados de errorListo
  • Mejoras en formularios complejos (multi-paso)Próximo
  • Optimización de accesibilidad mobile avanzadaPróximo
  • Reducción de motion para preferencia del sistemaPróximo
  • Auditorías con usuarios reales con discapacidadPróximo

Soporte

Reportar una barrera

Tu retroalimentación nos ayuda a mejorar continuamente la experiencia.

¿Encontraste una barrera de accesibilidad?

Escríbenos con una descripción del problema, la página donde ocurrió y, si puedes, una captura de pantalla. Revisamos cada reporte y priorizamos mejoras basadas en impacto real.

Enviar reporteIr a contacto

Tiempo de respuesta

24–48h

horas hábiles

Canales alternativos

¿No puedes completar una acción?

Si algo no funciona para ti, buscamos otra forma de ayudarte.