Modo oscuro: cuando la sustentabilidad se ve genial (y ahorra batería)

Hablemos del modo oscuro, y no, no me refiero a cuando se corta la luz y te baja el amor por tu batería portátil. El modo oscuro se ha vuelto súper popular últimamente y no es solo porque se vea genial (que sí se ve genial). Resulta que también está ayudando a cuidar el planeta.

Avatar de

Aquí va la cosa: si tienen un celular con pantalla OLED o AMOLED y esto es importante porque en 2025 ya estamos hablando de que entre el 60% y 70% de los smartphones de gama media y alta usan esta tecnología estos dispositivos pueden apagar píxeles individuales cuando muestran negro. ¡Es como magia! Cada píxel negro es literalmente un píxel apagado, lo que significa menos consumo de batería.

Samsung, Apple, Xiaomi y prácticamente todos los fabricantes grandes ya están usando predominantemente pantallas AMOLED o variantes de OLED en sus teléfonos recientes. Así que hay muchas probabilidades de que el dispositivo en el que están leyendo esto tenga una de estas pantallas.

¿Cuánto ahorro estamos hablando? Bueno, puede ser desde un 3% hasta un 50% en el consumo de batería, dependiendo de qué tan brillante tengas la pantalla. ¡Eso es un montón!

Sustentabilidad digital: diferencias entre móviles y computadoras

Ahora, aquí viene un detalle importante: en pantallas de PC y laptops la cosa cambia bastante. Menos del 10% de los monitores y pantallas de computadora usan tecnología OLED/AMOLED. La mayoría siguen usando IPS LCD u otras tecnologías LCD tradicionales por temas de costo y disponibilidad. Las pantallas OLED para PC son más exclusivas y caras, así que el mercado aún es pequeño.

Esto significa que si están desarrollando para escritorio, el impacto energético del modo oscuro va a ser mucho menor. Pero igual vale la pena implementarlo por temas de accesibilidad y experiencia de usuario.

Aquí viene la parte interesante para nosotros los que hacemos sitios web: resulta que aproximadamente el 50% de la energía que se consume cuando alguien visita nuestro sitio la genera el dispositivo del usuario. Entonces, si optimizamos nuestros sitios para modo oscuro, ¡estamos impactando directamente en la sustentabilidad digital! Especialmente considerando que la mayoría de la gente navega desde el celular.

Pero ojo, no todo es color de rosa... o debería decir, no todo es color de negro. Y hay un detalle curioso: algunos estudios dicen que la gente tiende a subir el brillo cuando usa modo oscuro, lo que puede anular parte del ahorro. ¡Qué irónico!

Implementación sostenible de modo oscuro: más fácil de lo que piensas

La parte genial es que implementar modo oscuro no es nada complicado. Con CSS pueden usar prefers-color-scheme: dark y ¡listo! El navegador detecta automáticamente si el usuario prefiere modo oscuro.

Pero aquí van algunos tips importantes que he aprendido:

1-Diseño web sostenible: por qué evitar el negro puro (#000000)

Miren, sé que suena raro, pero el negro absoluto puede causar fatiga visual. Mejor usen algo como #121212. Es súper oscuro pero no tan extremo.

2-Accesibilidad y sustentabilidad: optimizando contrastes en modo oscuro

Necesitan mantener al menos una relación de contraste de 4.5:1 para que sea accesible. No se trata solo de invertir colores, sino de rediseñar pensando en la experiencia del usuario.

3-Contenido visual eco-friendly: cómo adaptar imágenes para desarrollo sostenible

Si tienen imágenes súper brillantes en un fondo oscuro, van a parecer luces de discoteca. Ajusten el brillo o usen filtros para que todo se vea coherente.

Lo que me parece mejor de todo esto es que cuando arreglamos el modo oscuro para que sea sustentable y accesible, casi siempre terminamos mejorando la experiencia general del sitio. Es como cuando optimizas para accesibilidad y de repente te das cuenta de que tu UX mejoró para todos.

Y considerando que la mayoría de los usuarios van a ver nuestros sitios en dispositivos móviles con pantallas OLED/AMOLED, el impacto puede ser bastante significativo si lo multiplicamos por millones de usuarios.

Y bueno, si están pensando en implementarlo, recuerden probar en dispositivos reales. Lo que se ve bien en su monitor de desarrollo puede verse completamente diferente en un celular a las 11 de la noche.

La verdad es que el modo oscuro es una de esas "features" que beneficia a todos: a los usuarios les gusta, ahorra batería en la mayoría de los smartphones modernos, y nosotros como desarrolladores podemos sentirnos bien sabiendo que estamos contribuyendo un poquito a la sustentabilidad digital.

¿Ya tienen modo oscuro en sus proyectos? Si no, ¡definitivamente vale la pena agregarlo!