Al crear un sitio web, es crucial tener no solo un excelente diseño de interfaz de usuario, sino también una gran accesibilidad.

Puede ser una tarea tediosa sobre todo si no podemos relacionarnos con ciertas condiciones que pueden dificultar una buena experiencia de usuario.

Una de estas condiciones es el daltonismo o la deficiencia de la visión del color (CVD). Si no eres daltónico, es probable que no pienses en ello muy a menudo. Las personas que tienen esta condición, sin embargo, tienen que lidiar con ella todo el tiempo. Aunque se considera una discapacidad leve, puede afectar muchas actividades diarias: cocinar, comer, transportarse y navegar por Internet.

Dicho esto, nuestro sitio web debe ser accesible para la mayor cantidad de personas posible, incluidas aquellas con CVD.

¿No estas seguro de cómo hacerlo? ¡Sin preocupaciones! Estamos aquí para ayudarte.

Este artículo lo ayudará a aprender más sobre el daltonismo y las cosas que puede hacer (y no hacer) para que su diseño sea más amigable para los daltónicos.

Primero, necesitamos entender qué es el daltonismo.

Entender el daltonismo

daltonismo
Por lo menos el 90% del tiempo, el daltonismo no es realmente una forma de ceguera, sino una deficiencia para distinguir el rojo, el azul o el verde. Esta discapacidad puede causar dificultad para identificar ciertos colores en comparación con quienes tienen una visión normal.

Contrariamente a la creencia popular, el daltonismo no muestra síntomas idénticos. Esto significa que es posible que dos personas con daltonismo vean diferentes gamas de colores en la misma imagen.

Tipos de daltonismo

1. Ceguera al color rojo-verde

Este es el tipo más común de daltonismo debido a la ausencia o debilidad de las células de cono rojo (protans) o células de cono verde (deutrans).

Se puede dividir en estos subtipos:

  • Protanopiaausencia de células de cono rojo. El rojo parece marrón oscuro; naranja, amarillo y verde aparecen en varios tonos de amarillo; y el violeta parece azul.
  • protanopía

  • protanomalíadefectuoso células de cono rojo. Los colores son menos brillantes y los colores rojo, naranja y amarillo parecen tener un poco de verde.
  • protanomalía

  • Deuteranopíaausencia de células de cono verde. Los rojos y verdes aparecen como amarillos parduscos y los violetas también parecen azules.
  • Deuteranopía

  • Deuteranomalíadefectuoso células de cono verde. Los colores son menos brillantes. Los colores amarillo y verde parecen tener un poco de rojo.
  • Deuteranomalía

2. Ceguera al color azul-amarillo

Este es un tipo más raro que ocurre cuando las células de cono azul (tritanes) son anormales o inexistentes.

Se puede dividir en estos subtipos:

  • • Tritanopia: ausencia de células de cono azul. El rojo no se ve significativamente afectado; los azules se vuelven más verdosos; los amarillos y naranjas se vuelven algo rosados, y los verdes se vuelven azules.
  • Tritanopia

  • • Tritanomalía: células de cono azul defectuosas. El azul parece tener un tono un poco de verde y amarillo y el naranja puede ser un poco más pálido.
  • Tritanomalía

3. Completa el daltonismo “Acromatopsia”

Este es el tipo más severo donde es literalmente correcto usar el término daltonismo. Esto es cuando una persona no ve ningún color en absoluto. Ocurre cuando ninguna o solo 1 de las 3 celdas de cono funciona.
acromatopsia.jpg

Diseño web para daltónicos

Se estima que alrededor de 100 millones de personas utilizan Internet. Estos 100 millones de personas ven todo, incluido su sitio web, de manera diferente a los demás. Puede ser ventajoso para usted, en cuanto a conversión, hacer que su navegación sea mucho más fácil cuando visiten su sitio web.

Aquí hay algunas formas de acomodar mejor a sus usuarios de CVD (Deficiencia de la visión del color) en su sitio web.

1. No confíes en los colores.

retroalimentación de color
Al diseñar un concepto, siempre tenga en cuenta no depender tanto de los colores para transmitir información importante. De lo contrario, las personas con CVD tendrán dificultades para comprender su diseño y pueden resultar en una experiencia de usuario deficiente.

Por ejemplo, al tratar de llenar los campos verdes necesarios, puede ser obvio para nosotros con una visión normal.
campos normales

Pero puede ser una pesadilla para aquellos que tienen una deficiencia en la visión del color.
campos cvd

En su lugar, puede utilizar otros elementos como textos (palabras clave y descripciones), formas, iconos, principios de Gestalt, etc. para transmitir su información.
campos correctos

Además, es menos probable que la teoría del color funcione en personas con daltonismo. Por lo tanto, no los use para la interfaz de comentarios. Si solo está utilizando un color rojo como indicador de algo “incorrecto” o como una “advertencia”, es posible que desee reconsiderarlo.

2. Utilice simuladores de daltonismo.

usar simuladores
Una forma de asegurarse de que su diseño sea apto para daltónicos es viéndolo usted mismo. Hay muchas herramientas y software en línea que pueden ayudarlo a ver a los ojos de un CVD.

Si está utilizando Photoshop, tiene una herramienta integrada que le permite hacerlo. Puede habilitarlo yendo a Ver > Configuración de prueba.
Photoshop daltónico

Para sitios web, puede utilizar este filtro de página web.
sitio total

3. Matiz, Saturación, Alto Contraste y Brillo.

saturación de tono de contraste
Aunque carecen del departamento de color, los usuarios de CVD siguen siendo excelentes para percibir el contraste, el tono, la saturación y el brillo. Usa esto para tu ventaja.

Por ejemplo, puede usar un fondo azul claro y asociarlo con elementos que tengan un color azul más oscuro.
muestra de contraste

4. Piensa en lo mínimo.

diseño minimalista
Puedes golpear dos pájaros de un tiro aquí. Además del hecho de que el minimalismo es una tendencia en el diseño web, también puede disminuir la confusión y mantener la accesibilidad del color.

También puede optar por un esquema de color monocromático para el diseño de su sitio web. Se complementará bien con un alto contraste ya que solo está usando un color con diferentes tonos.
naturaleza mínima
Es posible que hayas pensado en blanco y negro o en escala de grises cuando leíste “monocromático”. ¡Definitivamente está bien! Pero para que quede claro, puede usar cualquier color que desee. Sea creativo y explore varios tonos y cómo puede combinarlos.

5. Evite malas combinaciones de colores

Para los usuarios con CVD, hay combinaciones de colores que son difíciles de identificar, y luego están las peores combinaciones que pueden causarles pesadillas. Aquí hay algunos que debería considerar evitar para su diseño:

  • • Verde rojo
  • • Verde marrón
  • • Verde azul
  • • Gris verde
  • • Verde y Negro
  • • Azul púrpura
  • • Gris azulado
  • • Verde claro y amarillo

Pero si debe usar algunos de estos, puede disminuir su carga ajustando el brillo de los colores (claro versus oscuro). Tal vez puedas optar por un rojo claro con un verde más oscuro. Esto al menos les ayudaría a diferenciar unos de otros.

¡Estás despierto!

Espero que esta información y consejos te ayuden a crear un mejor sitio web para todos. Ahora tiene más conocimientos que puede utilizar para llegar a más usuarios y aumentar su tráfico *¡crucemos los dedos!*. Pero más que los beneficios personales, puede ser de gran ayuda para quienes padecen esta afección. Seguro que estarán agradecidos por tus esfuerzos.

Gracias por pasar su tiempo con nosotros. ¿Nos perdimos algún buen consejo e idea? Comparte lo que piensas en nuestros comentarios a continuación.

Kareen Liez

Sobre el Autor:
Un Ingeniero Civil que tiene un negocio de construcción y un joven voluntario para una organización cívica. También contribuye para un periódico local debido a su inquebrantable pasión por escribir.

Deja una respuesta