El encaprichamiento creciente de la web con el diseño plano ha llevado a un rechazo rápido de los artificios como sombras paralelas, a favor de un aspecto más limpio y basado en la forma. Pero esto deja al diseñador con un problema: ¿cómo se teclea el estilo para ser vibrante mientras se adhiere a los principios del diseño plano?

Una solución es el renovado interés en las tipografías cromáticas. En uso generalizado en la impresión de bloques de madera del siglo XIX, las caras de tipo cromático usan colores múltiples para definir diferentes áreas. Este es el enfoque opuesto al diseño de logotipo moderno, en el que se nos enseña que las formas deben funcionar en un solo tono.

El beneficio de los diseños cromáticos es que añaden profundidad, énfasis y carácter; sin la necesidad de una decoración de texto más intrusiva, como las sombras.

Uno de los mejores ejemplos de esto es Sodachrome. Diseñado por Dan Rhatigan e Ian Moore, Sodachrome consta de dos fuentes separadas; uno en el que las gracias apuntan a la izquierda, y otro en el que apuntan hacia la derecha. Configuradas individualmente, las dos fuentes se ven claramente desbalanceadas, sin embargo, una sobre otra en diferentes colores, producen una atractiva serifa de slab. El beneficio adicional de Sodachrome es que la superposición entre los dos colores crea una tercera cara, una sans-serif moderna, en el corazón del diseño. El interés visual en Sodachrome se crea mediante la interacción entre estos tres diseños diferentes.

sodachrome1
sodachrome2

Sodachrome por Dan Rhatigan e Ian Moore.

El desarrollo de fuentes cromáticas para su uso en la web es un desafío. Considerando que los diseños tales como Lisa Lonergan de Knoxville sigue esquemas romanos muy tradicionales, diseños como Pigmento de Mark Frömberg - que tiene 600 caracteres - no encaja fácilmente en formatos de contorno vectorial.

knoxville

Knoxville por Lisa Lonergan.

pigmento1pigmento2

Pigmento de Mark Frömberg.

Las tipografías, incluso las caras estilo grunge, están diseñadas como un contorno. Los contornos se pueden escalar, colorear y espaciar de la forma que el diseñador elija. OpenType (OT), TrueType (TT), Web Open Font Format (WOFF) y casi cualquier otro formato disponible funciona de esta manera. Esto significa que no se puede especificar un diseño cromático en un solo archivo. Sin embargo, siempre que el tipo de letra cromática se entregue como dos archivos de fuente separados, podemos colocar uno sobre el otro con bastante facilidad.

CSS incluso nos permitirá duplicar el título en los estilos utilizando la propiedad de contenido , evitando doblar el contenido en el marcado que tendría un impacto negativo en el SEO y la accesibilidad.

El formato básico es:

Any old title

Y en el CSS:

h1{font-family:"Some Chromatic Font A";color: rgba(50, 0, 0, 0.5);position:relative;}h1:after{font-family:"Some Chromatic Font B";color: rgba(0, 50, 50, 0.5);position:absolute;left:0;content:"Any old title";}

Por ahora, la falta de fuentes cromáticas que se producen para uso web probablemente signifique que su uso sea un paso demasiado lejano para sitios como blogs que requieren numerosos encabezados. Pero para logotipos, o encabezados que rara vez cambian, donde el uso de una imagen es aceptable, las tipografías cromáticas son una forma vibrante y atractiva de configurar el tipo que conserva una estética plana.

¿Has trabajado con tipografías cromáticas? ¿Qué dificultades técnicas encontraste? Háganos saber en los comentarios.