Mezclar tipografía en el diseño web

0

Dominar el arte de combinar tipografía, especialmente en el diseño web, es crucial. Es fácil abrumarse al ver las diversas fuentes que pueden ser incorporadas en un proyecto. Por eso es importante tener la cabeza fría para pensar en lo que realmente queremos expresar y transmitir.

La tipografía, por sí sola, es igualmente capaz de contribuir o arruinar tu diseño. Teniendo este riesgo en cuenta, utilizar más de una fuente puede ser todo un reto. Sin embargo, esto no impide a muchos diseñadores mezclar fuentes. Muchas veces, fuentes que por sí solas no tienen gran atractivo combinadas con otras logran un resultado estupendo, creativo y, en algunos casos, hasta sofisticado.

Veremos algunos ejemplos ilustrativos para demostrar que combinar fuentes es una tarea difícil, pero no imposible.

ING Direct

ingdirect

La página de inicio nos muestra una ilustración de una escena nocturna. En el título se ha empleado una tipografía que, aunque pueda verse infantil, realmente combina con el diseño en general. La tipografía básica que se incluye después del título se acopla bien con la fuente principal.

Inesplorato

Pantallazo de web Inesplorato

El efecto de tiza del eslogan es bastante llamativo y combina a la perfección con la imagen de fondo así como con la letra curva en negrita y de aspecto juguetón que se aprecia en el resto del sitio.

Digitz

Pantallazo de la web Digitz

Se han empleado dos fuentes, una de ellas es básica y se han empleado distintos colores, tamaños y estilos para dividir la información. La otra tipografía nos contagia de un espíritu festivo, no sólo por el mensaje sino también por la anatomía misma de la tipografía.

Feven Amenu

fevenamenu

La página principal tiene un diseño limpio sobre fondo blanco, que incluye un texto en un espacio considerablemente estrecho, sin embargo no se presentan problemas en la lectura debido a la elección de fuentes.

MollyDooker Wines

Pantallazo de la web Molly Dooker

Aunque el diseño de fondo se ve cargado y distrae bastante, la información está ordenada en bloques de texto, al igual que las secciones, facilitando la lectura. Para el texto se emplea una tipografía básica, de esa manera se resaltan los títulos.

Pathfinders

Pantallazo de la web Pathfinders

Esta agencia de publicidad pone a disposición del público un portafolio online. Cada sección de este sitio web tiene un fondo, una decoración y una tipografía distinta. Como resultado final tenemos un sitio web muy creativo, característica que toda empresa en el rubro de la publicidad debe tener.

The Butcher’s Daughter

Pantallazo de la web The Butcher's Daughter

En este sitio web se han combinado fuentes rectas (tanto en formato simple como en negrita) con manuscritas. Y aunque ambas son bastante distintas entre sí se ha logrado balance y armonía en el diseño.

Bhojwani Foods

bjhowani

Este sitio web tiene muchos gráficos y fotos. Aunque en principio parece que ha sido un gran error de diseño, pues se ve desordenado, en realidad se ha pensado en cada elemento cuidadosamente. La tipografía como escrita a mano le da ese aspecto familiar que invita a probar sus productos. Sin mencionar que va a la perfección con los otros elementos de diseño y las demás tipografías empleadas.

JJR2012

Pantallazo de web JIR2012

En este sitio web la tipografía lo es todo ya que se ha empleado para hacer retratos. La parte realmente interesante es que podemos inspeccionar esos diseños y verlos de frente, como cualquier imagen o verlos en tres cuartos, lo que le da un efecto de profundidad.

Highway one roadtrip

Pantallazo de web Higway One

Un sitio web totalmente interactivo. Se distinguen dos tipografías principales: las decorativas que son utilizadas como títulos en globos de texto y las básicas que se utilizan para agregar información.

Crop the Block

Pantallazo de web Crop the Block

La página principal nos muestra un video de fondo, sobre este aparecen el logo y el eslogan. Y aunque al principio el video te puede distraer, tu atención pasa inmediatamente al eslogan, que consiste de tres palabras en tres diferentes tipografías. Realmente un gran ejemplo de cómo combinar fuentes.

Marina Zardo

Pantallazo de web Marina Zardo

Se emplea una tipografía caligráfica y algo ilegible que le da el aspecto de ser una firma. Se combina a la perfección con la tipografía básica que se ve en todo el sitio.

 

Hacer uso de diferentes tipografías en tus diseños realmente puede potenciarlos. Como hemos podido apreciar en los ejemplos mostrados, se han logrado resultados creativos y han hecho el diseño en general más dinámico. Tener diversidad de formas puede ser muy ventajoso para tus diseños, así que no temas probar a usar 2 ó 3 fuentes la próxima vez que diseñes un sitio web.

Comparte este post.

Escribe tu comentario