Esta página fue traducida con asistencia de IA. El original en inglés es la versión autorizada.
Durante la mayor parte de la historia de la tipografía en pantalla hubo una sola superficie de lectura: texto oscuro sobre fondo claro, imitando el papel. El modo oscuro cambió eso. En pocos años pasó de ser una preferencia minoritaria de desarrolladores a un ajuste a nivel de sistema en todos los sistemas operativos principales, y los lectores ahora llegan a una página habiendo dicho ya a su dispositivo qué polaridad quieren. La tipografía tiene que responder en ambas superficies.
Qué dice la investigación sobre polaridad
La polaridad de pantalla — si el texto es oscuro sobre claro (polaridad positiva) o claro sobre oscuro (polaridad negativa) — se ha estudiado desde la era de los CRT, y los hallazgos han sido bastante consistentes. Para la lectura sostenida en iluminación ordinaria, la polaridad positiva suele medir mejor: los estudios de corrección de pruebas, agudeza visual y velocidad de lectura tienden a favorecer el texto oscuro sobre fondo claro. La explicación dominante es fisiológica. Una superficie brillante contrae la pupila, y una pupila más pequeña produce una imagen retiniana más nítida y con mayor profundidad de campo. El texto claro sobre oscuro dilata la pupila y ablanda la imagen.
Ese es el caso general, no el universal. El modo oscuro se gana su lugar en al menos tres situaciones:
- Poca luz ambiental. Una página blanca y brillante en una habitación a oscuras deslumbra, interrumpe la adaptación a la oscuridad y puede resultar genuinamente incómoda. En entornos tenues, la polaridad negativa reduce el desajuste entre la pantalla y el entorno.
- Fotofobia y sensibilidad a la luz. Los lectores con sensibilidad a la luz asociada a migrañas, ciertos síntomas posconmoción o afecciones que hacen dolorosos los campos brillantes a menudo dependen de los temas oscuros para poder leer.
- Algunas condiciones de baja visión. Los lectores afectados por la dispersión de la luz — por cataratas o medios oculares opacificados, por ejemplo — pueden ver con más claridad cuando se reduce la luz total emitida por la página. Entre los usuarios de magnificadores de pantalla y de alto contraste siempre ha habido un contingente de claro-sobre-oscuro exactamente por esta razón.
La halación y el problema del astigmatismo
El fallo característico de los temas oscuros es la halación: el texto brillante sobre fondo oscuro parece resplandecer, sangrando hacia afuera y desdibujando la forma de la letra. El efecto es más fuerte con blanco puro sobre negro puro, y es peor para los lectores con astigmatismo — una condición refractiva muy común — cuya óptica imperfectamente enfocada emborrona aún más los trazos brillantes. Las tipografías finas son las que más sufren, porque el halo consume una proporción mayor del trazo.
Los remedios son sencillos:
- Nunca use texto blanco puro sobre negro puro. Suavice ambos extremos: un gris claro sobre un gris muy oscuro reduce drásticamente el resplandor manteniendo un contraste amplio.
- Compense el peso aparente. El texto claro sobre fondo oscuro parece más negro que el mismo tipo invertido, porque los trazos brillantes se expanden. El tipo compuesto en un tema oscuro a menudo admite ser un punto más ligero de peso — o, con una fuente variable, ajustarse mediante el grado (véase el capítulo siguiente) para que la corrección no cause reflujo del texto.
- No se limite a invertir la paleta clara. Un tema oscuro diseñado por negación suele tener demasiado contraste en el texto y demasiado poco en la interfaz. Debe diseñarse como una composición propia, con sus propios valores de contraste verificados.
Respetar la elección del lector
La media query prefers-color-scheme informa de la preferencia del lector a nivel de sistema operativo, y honrarla es la línea de base moderna. Un lector que ha elegido el modo oscuro a nivel de sistema ha expresado una preferencia — a veces una necesidad médica — y un sitio que lo deslumbra con una página blanca la ha desautorizado. Lo inverso también vale: forzar un tema oscuro a lectores que eligieron el claro es igual de presuntuoso. Ofrezca un conmutador dentro de la página si lo desea, pero use como predeterminado el ajuste del sistema operativo, y recuerde definir ambos temas por completo: un modo oscuro estilizado a medias, con texto oscuro heredado sobre una superficie oscura, es peor que ninguno.
El hardware bajo la página
La propia pantalla forma parte de la superficie de lectura. En las pantallas OLED, los píxeles negros están simplemente apagados, lo que significa que los temas de negro absoluto ahorran batería — un beneficio legítimo — pero la conmutación por píxel puede producir un leve emborronamiento del texto claro durante el desplazamiento en algunos paneles, otro argumento a favor del casi negro en lugar del negro absoluto. Las pantallas de tinta electrónica están en el otro extremo: son reflectantes, como el papel, no emiten luz y renderizan casi exclusivamente bien la polaridad positiva. El contenido que probablemente se lea en lectores electrónicos nunca debe depender de un tema oscuro para su legibilidad.
Por qué este capítulo es nuevo
En 2005, las pantallas oscuras pertenecían a los terminales y a la ciencia ficción; la web era blanca, y la polaridad era una cuestión zanjada porque los lectores no tenían forma de expresar una preferencia. No había ajuste oscuro a nivel de sistema, ni prefers-color-scheme, ni OLED en el bolsillo de ningún lector. El modo oscuro como superficie de lectura mayoritaria y controlada por el usuario es un desarrollo de la última década, y convirtió la polaridad de una nota histórica a pie de página en una responsabilidad viva del diseño.
En CSS
/* Design the dark theme; don't just invert the light one */
@media (prefers-color-scheme: dark) {
:root {
--paper: #171310; /* near-black — never #000 */
--ink: #ece5d6; /* off-white — never #fff (halation) */
}
img { filter: brightness(0.9); } /* dim plates to the surface */
}Recomendaciones
- Mantenga el oscuro-sobre-claro como superficie predeterminada para la lectura de textos largos; la evidencia sobre lectura sostenida la favorece.
- Honre
prefers-color-schemeen ambas direcciones — trate el ajuste del sistema operativo como la decisión del lector. - En los temas oscuros, evite el blanco puro sobre negro puro; suavice ambos valores para controlar la halación.
- Reduzca ligeramente el peso del tipo (o baje el grado) en los temas oscuros para contrarrestar el ennegrecimiento aparente.
- Diseñe la paleta oscura de forma independiente y verifique sus relaciones de contraste; no invierta el tema claro.
- Prefiera superficies casi negras al negro absoluto en OLED para limitar el emborronamiento al desplazarse, salvo que el ahorro de batería sea el objetivo explícito.
- Asuma que los lectores de tinta electrónica ven polaridad positiva; nunca haga que el modo oscuro sea estructural.