Por qué algunas miniaturas desaparecen en el listado
Una miniatura nunca se juzga sola. Aparece en una cuadrícula rodeada de quince o veinte competidoras, sobre un fondo de página que es blanco o casi negro según el tema que use quien mira. Un diseño que parece llamativo en tu monitor puede desaparecer del todo en ese contexto, y la razón casi siempre es el contraste: o falta dentro de la imagen, o falta entre la imagen y todo lo que la rodea.
Dos tipos de contraste, y los dos importan
El contraste interno es la separación entre tu sujeto y tu propio fondo: ¿encuentra el ojo la cara, el producto, el texto? El contraste externo es la separación entre tu miniatura entera y las miniaturas de al lado.
Casi todos los consejos hablan solo del primero. Pero una miniatura con un contraste interno estupendo que resulta tener el mismo tono general que sus vecinas desaparece igual, porque el ojo nunca se detiene lo suficiente como para apreciar la composición.
Diseña para los dos temas de la interfaz
Quien tenga el modo oscuro ve tu miniatura sobre una página casi negra; en modo claro, sobre blanco. Una miniatura con bordes oscuros se funde con el tema oscuro y se lee como más pequeña de lo que es. Una con fondo blanco hace lo mismo en modo claro.
La defensa es no apoyar tu composición en los extremos justo en el borde del encuadre. Un tono medio o un color saturado en el borde se separa de los dos temas. Es también la razón por la que funcionan tan bien los contornos negros gruesos: le dan al diseño su propio borde, sea cual sea el fondo.
La saturación es un instrumento tosco que funciona
El color muy saturado atrae el ojo más rápido que el color apagado. Por eso el look chillón y sobresaturado es tan común: no es una moda, es una respuesta funcional a competir dentro de una cuadrícula.
El precio es que lo hace todo el mundo, así que la cuadrícula entera es ruidosa y la ventaja se encoge. Lo que apunta a un movimiento más interesante: en un listado de ruido saturado, una miniatura de verdad contenida con un solo color fuerte puede destacar precisamente por estar tranquila. La regla no es «sé ruidoso», es «sé distinto de tus vecinos».
Combinaciones de color que aguantan en pequeño
Las parejas que sobreviven a la reducción son las que tienen mucha diferencia de luminosidad, no solo de tono. El amarillo sobre negro aguanta; el amarillo sobre blanco no, aunque el contraste de tono sea idéntico. El rojo sobre azul oscuro se ve bien grande y se convierte en barro en pequeño, porque su luminosidad es parecida.
Una comprobación rápida: pasa tu diseño a escala de grises. Si los elementos siguen separándose con claridad, tu contraste está haciendo trabajo de verdad. Si todo se funde en grises parecidos, te estabas apoyando solo en el tono, y el tono es lo primero que se pierde en pequeño.
Contraste contra una fotografía, no contra un color plano
Elegir dos colores con mucha diferencia de luminosidad funciona cuando controlas los dos. Sobre una fotografía solo controlas uno. El fondo que hay detrás de una línea de texto puede pasar de un cielo brillante a un portal oscuro en el ancho de una sola palabra, y no hay ningún color de letra que supere los dos.
Así que deja de intentar resolverlo con color y dale al texto su propio fondo. Los dos tratamientos que funcionan son un contorno grueso, que viaja con cada letra y garantiza la separación caiga donde caiga esa letra, y un bloque o una banda maciza detrás del texto, que sustituye la fotografía por completo en esa zona. Una sombra suave es una versión más floja de la misma idea, y a menudo basta sobre una imagen moderadamente cargada.
Hay una tercera opción que muchas veces es la mejor: oscurecer la zona de la fotografía sobre la que se apoya el texto, con un degradado o una capa parcial, y poner encima texto claro. Mantiene la imagen visible, cosa que el bloque macizo no hace, y convierte un fondo impredecible en un fondo oscuro predecible.
Elijas lo que elijas, júzgalo donde el fondo es peor, no donde es normal. Busca la zona más clara que queda bajo tu texto y la que tiene más detalle, y comprueba la palabra que cae sobre cada una: la legibilidad se decide en el peor punto de la línea, no en la media. Un patrón de medida útil aquí es el criterio de accesibilidad web de 4,5:1 para texto normal y 3:1 para texto grande. YouTube no lo exige y se escribió pensando en interfaces, no en imágenes, pero la letra de una miniatura es texto grande sin discusión, y mantener 3:1 contra lo más claro que tenga detrás es un suelo razonable.
Daltonismo, y qué le hace al diseño una interfaz oscura
En torno a uno de cada doce hombres tiene alguna deficiencia en la visión del color, según la cifra que se suele citar, y la forma más común hace difícil distinguir el rojo del verde. Cualquier diseño cuyo significado viva en una diferencia de rojo contra verde —una cruz roja junto a una marca verde, dos barras que solo se distinguen por el tono, un marcador donde los bandos se separan solo por color— pierde ese significado para una parte real del público.
El remedio es la misma disciplina que la prueba en escala de grises: que el tono no sea nunca lo único que transporta la información. Si tienen que aparecer el rojo y el verde, que uno sea claro y el otro oscuro, o dales formas, posiciones o etiquetas distintas. Un diseño que funciona en escala de grises funciona para cualquier tipo de visión del color, lo cual es un atajo cómodo.
El modo oscuro cambia más cosas que los bordes de tu encuadre. La misma imagen parece más luminosa y más saturada sobre una página casi negra que sobre una blanca, porque el ojo se adapta a su entorno. Un diseño ajustado para resultar contundente en modo claro puede resultar deslumbrante en oscuro, y un diseño apagado y de tonos bajos pierde toda su separación de sombras, porque el entorno ya no le da al ojo nada más oscuro con lo que medirlo.
No puedes publicar dos versiones, así que diseña para el caso difícil. Deja algún valor realmente claro dentro del encuadre, para que la imagen tenga un anclaje luminoso sobre cualquiera de los dos fondos; evita que grandes zonas caigan a casi negro en el borde; y mira el diseño terminado una vez con cada tema antes de subirlo. Cambiar el ajuste de apariencia de tu propio YouTube son unos segundos y es la única forma honesta de verlo.
Elige un color y mantenlo
El color tiene un segundo trabajo, más allá de la legibilidad: identificar. Si todas tus miniaturas usan el mismo color de acento, la gente empieza a reconocer tus vídeos en un listado antes de leer nada.
Eso vale más con el tiempo que ganar un clic con una miniatura suelta. Y además es barato: elige un acento, úsalo en el texto o en una forma resaltada, y sé aburridamente constante.
Compruébalo en contexto, no aislado
El error es juzgar tu miniatura a pantalla completa en el editor. Júzgala en pequeño y, a ser posible, junto a otras miniaturas, porque esa es la condición real de visionado.
La vista previa de este editor muestra el diseño a los tamaños reales del listado mientras trabajas, y eso pilla el problema de contraste interno. Para el externo, abre YouTube y mira tu miniatura entre vecinas reales antes de darla por buena.
Respuestas rápidas
¿Hay un color mejor para miniaturas?
Ningún color gana por sí solo. Lo que gana es mucho contraste de luminosidad dentro de la imagen y un tono distinto al de tus vecinas. El amarillo y el rojo son comunes por luminosos y saturados, no por magia.
¿Uso los colores de mi marca?
Sí, si tienen contraste suficiente. La coherencia ayuda a que te reconozcan. Si tu paleta es toda de tonos medios, añade un acento de mucho contraste solo para las miniaturas.
¿El modo claro u oscuro cambia lo que debo hacer?
Cambia dónde se funden los bordes de tu miniatura. Diseñar para que el borde del encuadre no sea ni negro puro ni blanco puro cubre los dos casos.
¿Cómo sé si mi miniatura funciona para quien no distingue bien los colores?
Pásala a escala de grises. Si todo se sigue separando, no te estás apoyando solo en el tono, y un diseño que sobrevive a la escala de grises sobrevive a las formas comunes de daltonismo.