Condición visual
Visión normal
Base de referencia
Referencia de visión sin alteraciones. Contraste pleno, colores correctos y nitidez óptima.
Impacto en interfaces:
- Sin restricciones de contraste
- Todos los colores accesibles
- Texto fino legible
Vista simulada
Así verías esta interfaz de ejemplo con visión normal:
Esto es una aproximación visual para diseñadores: las condiciones reales son más complejas y varían mucho de una persona a otra. No uses este simulador para fines diagnósticos ni para estimar la visión de nadie en concreto.
Claves para diseñar con accesibilidad visual
- Contraste mínimo WCAG AA: 4,5:1 para texto normal, 3:1 para texto grande
- No uses solo el color para transmitir información (añade iconos o texto)
- Tamaño mínimo recomendado: 16 px para cuerpo de texto
- Evita fondos blancos puros (#FFF) para usuarios con cataratas
- Coloca notificaciones importantes en el centro, no solo en esquinas
Guía de condiciones visuales y accesibilidad
Todo lo que necesitas saber para diseñar interfaces accesibles
Comparativa de condiciones
| Condición | Prevalencia | Principal dificultad | Solución en diseño |
|---|---|---|---|
| Cataratas | 17 % de los mayores de 40 (EE. UU.) | Visión turbia y amarilla | Alto contraste, evitar blanco puro |
| Miopía severa | 4 % (miopía alta) | Borrosidad a distancia | Texto grande, interlineado amplio |
| Glaucoma | 3,5 % de 40 a 80 años (mundo) | Pérdida visión periférica | UI centrada, notificaciones centrales |
| D. macular | 8,7 % de 45 a 85 años (mundo) | Punto ciego central | Información redundante en periférico |
| Daltonismo rojo-verde | 8 % de los hombres de ascendencia europea | Confusión rojo/verde | No depender solo del color |
Fuentes de las prevalencias: cataratas, Congdon et al. (2004), Arch Ophthalmol 122(4), 487-494, cifra de Estados Unidos; glaucoma, Tham et al. (2014), Ophthalmology 121(11), 2081-2090; degeneración macular (cualquier estadio), Wong et al. (2014), Lancet Global Health 2(2), e106-e116; miopía alta, Holden et al. (2016), Ophthalmology 123(5), 1036-1042; daltonismo, Birch (2012), Journal of the Optical Society of America A 29(3), 313-320; baja visión, Bourne et al. (2017), Lancet Global Health 5(9), e888-e897.
Casos de uso de este simulador
- Diseñadores UX/UI: Validar paletas de color antes de entregar
- Desarrolladores front-end: Comprobar contraste de componentes
- Product managers: Defender la accesibilidad ante el equipo
- Formadores: Mostrar a estudiantes el impacto real de las decisiones de diseño
Preguntas frecuentes
¿Es una simulación médicamente precisa?
No. Es una aproximación visual para diseñadores. Las condiciones reales son más complejas y variables entre personas. No uses este simulador para fines diagnósticos.
¿Qué estándar de accesibilidad debo seguir?
La referencia habitual es WCAG 2.1 nivel AA. En España, el Real Decreto 1112/2018 obliga solo a los sitios web y las apps del sector público, y los presume conformes si cumplen la norma europea EN 301 549, cuyos requisitos para la web siguen las WCAG. Para el sector privado, desde el 28 de junio de 2025 el título I de la Ley 11/2023, de 8 de mayo (que transpone la Directiva (UE) 2019/882), exige accesibilidad a determinados servicios para consumidores, como el comercio electrónico, la banca, el transporte de viajeros o las comunicaciones electrónicas, con una exención para las microempresas que prestan servicios. En otros países rigen sus propias normas. Apuntar a AAA en apps de uso público beneficia a más usuarios.
¿Cómo comprobar el contraste de mis colores?
Usa la calculadora de contraste de meskeIA o herramientas como el color picker de DevTools de Chrome, que muestra el ratio WCAG en tiempo real.
¿El daltonismo afecta igual a hombres y mujeres?
No. El daltonismo rojo-verde (protanopia, deuteranopia y sus formas leves) está ligado al cromosoma X, y por eso es mucho más frecuente en hombres: afecta a cerca del 8 % de los hombres y al 0,4 % de las mujeres de ascendencia europea, según la revisión de encuestas poblacionales de Birch (2012). La prevalencia no es la misma en todo el mundo: en hombres de ascendencia china y japonesa esa misma revisión la sitúa entre el 4 % y el 6,5 %.
Pasos para una auditoría de accesibilidad visual
- Comprueba el ratio de contraste de todos los textos (objetivo: ≥4,5:1)
- Simula tu interfaz con protanopia y deuteranopia
- Verifica que los estados (éxito/error) no dependen solo del color
- Prueba con zoom al 200 % (texto no debe desbordarse)
- Revisa que las notificaciones importantes no están solo en esquinas