Simulador de Daltonismo
El Simulador de daltonismo es una herramienta gratuita en línea que muestra cómo se ven los colores y diseños elegidos para las personas con diferentes tipos de deficiencia de la visión del color (ECV). Cargue una imagen o elija colores para ver cómo se ven en las simulaciones de protanopía, deuteranopía, tritanopía y acromatopsia. Esta herramienta es esencial para diseñadores, desarrolladores y creadores de contenido que desean garantizar que sus sitios web, aplicaciones, infografías y visualizaciones de datos sean accesibles para aproximadamente el 8% de los hombres y el 0,5% de las mujeres que tienen algún tipo de daltonismo. Pruebe sus paletas de colores, diseños de interfaz de usuario, gráficos e ilustraciones para crear contenido visual más inclusivo.
Qué es
La deficiencia de la visión del color (ECV), comúnmente conocida como daltonismo, afecta aproximadamente a 1 de cada 12 hombres (8%) y 1 de cada 200 mujeres (0,5%) en todo el mundo. Es una afección genética que afecta la forma en que el ojo percibe ciertos colores, lo que hace que algunos colores sean difíciles o imposibles de distinguir. Tipos de daltonismo simulado: - Protanopia (ceguera roja): Faltan los conos rojos de la retina. Los rojos aparecen oscuros y se pierden las distinciones rojo / verde. Afecta a ~1% de los hombres. - Deuteranopia (Verde-ciega): Faltan los conos verdes. Esta es la forma más común de daltonismo. Los verdes aparecen parduscos y se pierden las distinciones verde / rojo. Afecta a ~5% de los hombres. - Tritanopia (persiana azul-amarilla): Faltan los conos azules. Se pierden las distinciones azul / verde y amarillo / rojo. Muy raro (~0,01% de la población). - Acromatopsia (daltonismo total): Ausencia total de percepción del color. El mundo aparece en tonos de gris. Extremadamente raro. - Protanomalía, Deuteranomalía, Tritanomalía: Sensibilidad reducida (ausencia no completa) al rojo, verde o azul, respectivamente. Estas son formas más leves. Por qué simular el daltonismo en el diseño: - Cumplimiento de la accesibilidad: las pautas WCAG requieren que la información no se transmita solo por el color - Visualización de datos: Los cuadros y gráficos deben ser legibles por todos los usuarios. - Diseño de la interfaz de usuario: Los estados de error, los indicadores de estado y los elementos interactivos necesitan señales que no sean de color - Materiales de marketing: Las infografías y presentaciones deben llegar a la audiencia más amplia. - Diseño inclusivo: Creación de productos utilizables por todos, independientemente de su capacidad visual. La simulación utiliza el algoritmo de Brettel, Viénot y Mollon (1997) para una transformación precisa del color, que modela la respuesta fisiológica real de las células cónicas en la retina humana.
Cómo usar
- Elija su método de simulación: cargue un archivo de imagen (PNG, JPG, SVG) para ver cómo aparece bajo diferentes tipos de daltonismo, o use el selector de color para probar colores individuales y combinaciones de colores.
- Para cargar la imagen: haga clic en el área de carga o arrastre y suelte su imagen. La herramienta mostrará la imagen original junto con cuatro versiones simuladas (protanopía, deuteranopía, tritanopía, acromatopsia) para facilitar la comparación.
- Para pruebas de color: ingrese códigos de color hexadecimales o use el selector de color para seleccionar colores. La herramienta muestra cómo aparece cada color en diferentes tipos de CVD, lo que le ayuda a identificar pares de colores problemáticos.
- Revise las imágenes simuladas una al lado de la original. Busque áreas donde la información importante se vuelva indistinguible; por ejemplo, el texto de error rojo sobre un fondo verde puede parecer idéntico en deuteranopia.
- Utilice el comprobador de relación de contraste integrado en la herramienta para verificar que sus combinaciones de colores cumplan con los requisitos de contraste WCAG AA (4.5:1) o AAA (7:1), incluso bajo simulación de daltonismo.
- Ajuste sus colores en función de los resultados de la simulación. Agregue patrones, etiquetas, íconos o texto además del color para transmitir información. Vuelva a realizar la prueba hasta que todas las distinciones críticas permanezcan visibles en cada tipo de simulación.
- Descargue las imágenes simuladas para incluirlas en la documentación de accesibilidad o compártalas con su equipo. Utilice la función 'Exportar informe' para generar un resumen en PDF de su análisis de accesibilidad del color.
Ejemplos
Entrada: Original: #FF0000 (Red), Type: Protanopia
Proceso: RGB→LMS color space → Apply protanopia filter → RGB
Resultado: Simulated: Dark brown/yellowish hue
Entrada: Original: #00FF00 (Green), Type: Deuteranopia
Proceso: Shift green spectrum → Red-green confusion simulation
Resultado: Simulated: Yellowish-brown tone
Búsquedas Relacionadas
La gente también busca: simulador de daltonismo, deficiencia de la visión del color, herramienta de accesibilidad, prueba de daltonismo.
simulador de daltonismodeficiencia de la visión del colorherramienta de accesibilidadprueba de daltonismo
Preguntas Frecuentes
¿Qué tan precisa es la simulación de daltonismo?
La simulación utiliza el algoritmo Brettel-Viénot-Mollon, que es el modelo matemático más aceptado para simular la deficiencia de la visión del color. Modela la respuesta fisiológica real de las células cónicas en la retina. Si bien ninguna simulación basada en pantalla puede replicar perfectamente la experiencia subjetiva del daltonismo (ya que los monitores emiten luz RGB), el algoritmo proporciona una aproximación altamente precisa que utilizan las herramientas de accesibilidad profesionales y las herramientas de desarrollo de navegadores.
¿Cuál es la diferencia entre protanopía y protanomalía?
Protanopia significa que los conos rojos están completamente ausentes; la persona no puede percibir la luz roja en absoluto. Protanomalía significa que los glóbulos rojos están presentes pero defectuosos, lo que resulta en una sensibilidad reducida al rojo. La protanopía es más grave. La misma distinción se aplica a deuteranopía / deuteranomalía (verde) y tritanopía / tritanomalía(azul). La herramienta simula tanto la ausencia total como las variantes de sensibilidad reducida.
¿Cómo hago que mis diseños sean accesibles para usuarios daltónicos?
Estrategias clave: 1) No dependa únicamente del color para transmitir información: agregue etiquetas de texto, patrones o íconos. 2) Utilice un alto contraste entre el primer plano y el fondo. 3) Elija paletas de colores que permanezcan distinguibles bajo simulación CVD (azul / naranja es mejor que rojo/verde). 4) Tablas de prueba con patrones además de colores. 5) Utilice subrayados para los enlaces, no solo cambios de color. 6) Agregue íconos de error junto al texto de error rojo. La herramienta lo ayuda a verificar que estas estrategias funcionen.
¿Puedo simular el daltonismo en un sitio web completo?
La función de carga de imágenes le permite probar capturas de pantalla de su sitio web. Para la simulación de página completa, tome capturas de pantalla de páginas clave (página de inicio, formularios, paneles) y cárguelas. Algunas extensiones de navegador (como la emulación de deficiencia de visión de DevTools de Chrome) pueden simular páginas completas en vivo. Esta herramienta es la mejor para probar opciones de color específicas, componentes de interfaz de usuario y visualizaciones de datos en lugar de simulación de página completa.
¿Qué colores son más seguros para el diseño accesible daltónico?
El azul y el naranja siguen siendo distinguibles para todos los tipos de daltonismo, lo que los convierte en uno de los pares de colores más seguros. El azul / amarillo también funciona bien para la mayoría de los tipos de ECV. Evite depender únicamente de las distinciones rojo/verde (problemáticas para los tipos de ECV más comunes). Cuando deba usar rojo/verde (por ejemplo, para estados de error / éxito), complételo siempre con íconos, etiquetas de texto o patrones. La simulación de la herramienta le permite verificar que cualquier combinación de colores funcione antes de implementarla.