{ Pasión por el código }

© Blog Ailon Webs

Modo oscuro y modo claro. ¿Cuál es el mejor?

Por M. Soutto

modo oscuro y modo claro
Modo oscuro y modo claro. ¿Cuál es el mejor?

Se está impulsando cada vez más el uso del modo oscuro en las pantallas de nuestros dispositivos. Pero te has preguntado ¿cuál es el mejor para tus ojos? o ¿cuál mejora tu rendimiento?, incluso ¿cuál es el indicado para la pantalla de tu dispositivo?. Para dar respuesta a estas preguntas indagaremos sobre lo que sabemos hasta la fecha para poder decidir que es lo mejor.

NUEVO No te pierdas: Modo oscuro y modo claro. Diseño web desarrollado por Ailon Webs.

¿Qué es el modo oscuro y el modo claro?

El modo oscuro o tema nocturno, en inglés Dark Mode, es la forma de visualizar la pantalla de tu dispositivo (móviles, ordenadores, etc.) con texto blanco y fondo oscuro (casi negro).

Y el modo claro,en inglés Light Mode, es lo contrario, visualizas la pantalla con texto oscuro y fondo claro.

Comparativa entre modo oscuro y modo claro
Modo oscuro Modo claro
Color de fondo casi negro blanco
Color del texto blanco negro
Iluminación del entorno escasa mucha

¿Cómo influye el entorno en la visualización de un modo u otro?

Varios factores pueden influir, factores que dependen de nuestra propia visión, del entorno en el que usan las pantallas de los dispositivos, las interfaces de usuario (UI), etc. Por ello, debememos repasar algunos conceptos para que entendamos bien como interaccionan entre sí.

Las pantallas de los dispositivos que actualmente utilizamos durante muchas horas, ya sea por trabajo, como entretenimiento o ambas, pueden causar fatiga visual. Por ello, se recomienda que los colores del entorno (colores de las paredes, muebles, etc.) donde utilizamos la pantalla tengan tonos apagados, es decir, colores pastel, o colores mate sin brillos.

Tu Web para Inmobiliaria

Web Inmobiliarias

Rápida, fuerte y atractiva, optimizada para móviles y buscadores. Desarrollada 100% por Ailon Webs, podemos hacer los cambios que necesites.

Si necesitas más información contáctanos.

Las pantallas

Al principio de la informática, existían pantallas con fondo oscuro y texto blanco o incluso verde luminoso, eran otros tiempos y otra tecnología de pantallas, con grandes diferencias de contraste.

Actualmente, hay muchos tipos y tamaños de pantallas de dispositivos, en móviles, tablets, ordenadores de sobremesa, portátiles, etc, todas ellas soportan una amplia gama de colores y con muy buena calidad.

La polaridad de contraste de las pantallas, es otra posible causa de fatiga visual. Este concepto de polaridad de contraste se usa para describir el contraste entre el texto y el fondo (se muestra en la siguiente imagen). La polaridad de contraste puede ser:

  • Positiva: pantalla con texto oscuro sobre fondo claro o modo claro.
  • Negativa: pantalla con texto claro sobre fondo oscuro o modo oscuro.
Pantallas polaridad de contraste positiva y negativa
Pantallas polaridad de contraste positiva y negativa, ver el contraste entre el texto y el fondo.

Pros y contras de la polaridad de contraste:

  • Positiva:
    • Se perciben menos los reflejos.
    • Se visulizan con más nitidez los bordes de los caracteres del texto.
    • Es más fácil conseguir el equilibrio de luminancias.
  • Negativa:
    • Se percibe más el parpadeo.
    • En personas con menor agudeza visual, mejora la legibilidad.
    • Percepción de que los caracteres son mayores.

Sensibilidad del ojo

Las primeras pantallas monocromáticas, contaban con un fondo no iluminado oscuro y los caracteres emitían luz (blanca o verde luminoso), que originaba un halo luminoso alrededor de los caracteres. Esto producía mucha fatiga visual, recordemos que es el lóbulo occipital de nuestro cerebro el que realmente ve, y en estas pantallas monocromáticas, tenía mucho trabajo transformando a tiempo real las imágenes de contorno difuso (ópticamente hablando) a imágenes nítidas. Un gran trabajo el de nuestro cerebro, pero esto le cansa.

Hoy en día no tenemos este inconveniente, las pantallas tienen mayor precisión cromática.

Modo oscuro y modo claro. ¿Cuál es el mejor?
Modo oscuro y modo claro. ¿Cuál es el mejor?

¿Cuál es el mejor modo oscuro o modo claro?

Somos los usuarios que decidimos como personalizar la pantalla de nuestro dispositivo, buscamos la que resulte más cómoda para nuestra visión y que nos permita centrarnos en el contenido. Pero ahora que está de moda el modo oscuro, creo que es un buen momento para sopesar cuál es más beneficioso o cuál es el adecuado según la situación, entorno, o nuestros ojos y ¿qué es mejor para nuestros ojos y para nuestro rendimiento?

El modo claro, ya sabemos que el color blanco refleja todas las longitudes de onda del espectro de luz visible, lo que posibilita que la pupila no necesite dilatarse para dejar entrar más luz. Esto facilita a el ojo humano una lectura más cómoda si el texto es negro sobre fondo un blanco, y también favorece la mejor comprensión y retención de lo que se lee. La pupila contraída tiene que esforzarse menos para enfocar el texto.

En cambio, el modo oscuro, provoca que la pupila se dilate para dejar entrar más luz. Por este motivo a muchas personas les resulta más cómodo el modo oscuro cuando en el entorno hay poca luz, pero no siempre es recomendable usarlo. Por naturaleza del ojo humano puede ver muy bien por el día y no tanto por la noche, el mejor contraste para el ojo es del texto oscuro sobre fondo claro.

Sensibilidad del ojo en función de la luz

Una de las ventajas al usar el modo oscuro es que puede extender la vida útil de la batería, caso que nuestro dispositivo la use, ya que cuando lo usamos nuestra pantalla emite menos luz que cuando la usamos en modo claro.

La cantidad de luz que nos rodea en nuestro entorno puede influir en el consumo de energía y en nuestra percepción. Esto tiene una relación directa con la estructura anatómica de nuestros ojos, concretamente con la pupila y cómo reacciona a la cantidad de luz del entorno.

La pupila del ojo humano es por donde llega la luz a nuestra retina y su diámetro varia según la cantidad de luz que recibe. Es el iris el que adapta el diámetro de la pupila según la cantidad de luz que recibe, si llega mucha luz se contrae para que no se dañe la retina y si llega poca luz se dilata para obtener una imagen nítida.

Así varía el diámetro de la pupila en función de la luz que recibe:

  • Mucha luz (luminosidad) → disminuye el diámetro de la pupila (miosis)
  • Poca luz (penumbra) → aumenta el el diámetro de la pupila (midriasis)

Cuando la pupila tiene un diámetro pequeño disminuye el esfuerzo para enfocar el texto y con ello disminuye la fatiga visual.

Las cámaras de fotos funcionan igual, el ángulo de apertura (f) de las lentes (equivaldría a el diámetro de la pupila del ojo), si uso una apertura pequeña f/22, aumenta la nitidez y el área de enfoque es grande.

Y si el ángulo de apertura (f), tiene una apertura grande por ejemplo f/3, el área de enfoque es pequeña y lo que no está enfocado queda borroso.

Un alto porcentaje de las personas tienen astigmatismo, esto causa la visión borrosa ya que uno o ambos ojos tienen una forma irregular. Si tienes astigmatismo tendrás dificultad para leer textos claros sobre fondos oscuros; los niveles de luz tienen parte de la culpa, por ello con una pantalla brillante (fondo blanco) la pupila disminuye su diámetro para así disminuir el efecto de la lente deformada que provoca la forma irregular del globo ocular; entonces, con una pantalla oscura (fondo negro), la pupila se dilata para recibir más luz y en consecuencia obtiene una visión desenfocada.

Cuando envejecemos nos hacemos más susceptibles al deslumbramiento, ya que la pupila disminuye de diámetro. Y como hemos visto al disminuir el diámetro de la pupila entra menos cantidad de luz al ojo. Por esto motivo en un entorno con poca luz, por la noche por ejemplo, la visión se ve disminuída.

¿Y en el diseño web?

Los diseños de páginas web que emplean el modo oscuro o dark mode en los últimos años se han popularizado quizá más para que el usuario tenga una experiencia distinta a la tónica clásica del blanco más tradicional de los últimos años.

Muchos sitios web usan el modo oscuro para atraer clientes, y hay encuestas que indican que es el preferido por muchos usuarios sobre todo los que usan las redes sociales. Es posibe que esté influenciado porque el tema oscuro: ha sido usado por grandes empresas tecnológicas desarrolladoras de los dispositivos que usamos y hacen ahora posible que sus usuarios cambien al modo oscuro; los programadores y también los expertos que diseñan UI utilizan aplicaciones con el modo oscuro y se vean influenciados al desarrollar webs quedando reflejado en sus trabajos; o bien, por el simple hecho de cambiar, al estar muchas horas leyendo en el modo claro pasar al oscuro es como cambiar algo; cuando necesitas reducir el uso de la batería del dispositivo.

Aunque el modo oscuro, como comentamos anteriormente, produce la dilatación de la pupila, lo que implica un mayor esfuerzo para enfocar y fatiga visual. Sin embargo, se prefiere el modo oscuro, cuando el entorno al dispositivo que utilizamos tiene condiciones de poca luz y no implica leer gran cantidad de texto.

Los diseños de sitios web con el modo oscuro son muy populares actualmente, por lo que no deberíamos descartar este tema para un futuro proyecto web. Los desarrolladores de Ailon Webs creemos que tiene que haber un equilibrio por ello hemos diseñado webs para tienda online con ambos modos. Si te interesa abajo te detallamos webs diseñadas por nosotros de tiendas online en modo oscuro o bien en modo claro. Puedes elegir la tuya en función de tus gustos y buscando siempre el modo que haga destacar más los productos de tu tienda online.

Modo oscuro:

Modo claro:

Conclusiones

Parece que cuando la óptica y la medicina nos indican lo contrario, es el modo oscuro el que se ha hecho popular entre los usuarios de los dispositivos. Quizá influye más la percepción de cambio que la idiosincracia de nuestro sistema de visión.

En cuanto al diseño de sitios web, debemos diferenciar el tiempo de uso que hacemos de los dispositivos para valorar si es mejor un modo que otro, ya que no es igual estar varias horas utilizando el modo oscuro en una aplicación con la consecuente fatiga visual, comparado con la visualización de unos minutos de un diseño web. Por ello, no debemos descartar el modo oscuro para el diseño de sitios webs, ya que el negro como ya dijimos en un artículo anterior "aumenta la percepción del valor del diseño, sugiriendo autoridad y superioridad". Pero el blanco usado en diseños minimalistas "aumenta la percepción del valor del diseño, honestidad y bondad. Transmite un diseño limpio, por tanto, aumenta la percepción de valor en productos".

Hemos aprendido que cuando la pupila recibe mucha luz su diámetro de la pupila es pequeño y como resultado disminuye el esfuerzo del ojo para enfocar texto y por lo tanto disminuye la fatiga visual. El ojo humano ve muy bien con la luz diurna pero no tanto por la noche, por ello el mejor contraste para el ojo sería el modo claro (texto oscuro sobre fondo claro). Si tienes astigmatismo es muy probable que te sientas mejor usando el modo claro. A largo plazo, leer en modo claro en las pantallas de ordenadores, móviles, tablets, etc., parece que se asocia a padecer miopía o bien a aumentarla si ya la tenías.

El modo oscuro puede hacer que dure más la batería de tu dispositivo (si la tiene), puede ser más relajado usarlo por la noche cuando hay poca luz en el entorno. Muchos dispositivos ya cuentan con una tercera opción que es modo automático, el sistema detecta la luz del entorno y cambia gradualmente el modo.

Modo oscuro vs. modo claro. ¿Cuál es mejor?. La mayoría de las personas ven mejor con el modo claro, pero algunas pueden ver mejor con el modo oscuro. Pensar que si nuestros músculos oculares tienen que realizar un mayor esfuerzo al leer nos produce mayor fatigar visual. Por ese motivo, lo mejor es que si no te sientes cómodo/a usando un modo u otro no obligues a tus ojos a hacerlo, ¡cuídalos son únicos!

Leyenda

  • UI = Interfaz de Usuario. Es el medio con lo que un usuario interactúa con un dispositivo, máquina, ordenador, móvil, etc.
  • UX = eXpericia de Usuario, del inglés User eXperience. En el diseño web es lo que el usuario percibe cuando utiliza la web.

Recibe nuestras promociones

Por favor escriba un email válido
No ha leído y aceptado el aviso de protección de datos

Categorías: Diseño de páginas web.

Etiquetas: UX, UI, tecnología