10 combinaciones de fuentes bellamente ejecutadas para la web

10 combinaciones de fuentes bellamente ejecutadas para la web

La tipografía es un elemento que debe complementar el contenido de un sitio web. Cuando se usa bien, establece una jerarquía visual y ayuda al usuario a conectarse con el contenido. En la web moderna, las nuevas tecnologías y herramientas, como la utilización de API, @font-face, CSS3, facilitan mucho esta tarea en la creación de impresiones visuales convincentes.

Cuando planifique un proyecto web, piense en el mensaje que sus tipos de letra intentan transmitir. Si no lo ha hecho, explore las categorías de tipo y luego mezcle los tipos de letra hasta que el diseño comunique lo que está tratando de decir.

En este artículo, echaremos un vistazo a 10 sitios web que usan el tipo de forma eficaz para transmitir información y lograr que los visitantes se interesen visualmente en sus ofertas.

Lago Wapogasset

Un titular fuerte y breve llama nuestra atención en este sitio web del campamento y une las cuatro divisiones del sitio a través de su redacción. Cuando se usan correctamente, las fuentes de visualización pueden marcar una gran diferencia en la creación de un diseño de sitio web novedoso. Además, una propiedad de sombra de texto levanta el título de la página y domina la jerarquía visual. El resto del sitio es un buen contraste, con una fuente sans-serif simple para ayudar en la legibilidad.

Fuentes utilizadas: Fono comprimido, Helvetica Neue

Agencia de vinos de Los Ángeles

2. Agencia de Vinos de Los Ángeles

La tendencia del diseño web de crear diseños tipográficos que se asemejan a carteles no ha desaparecido. Esta es una excelente manera de atraer la atención de los visitantes de inmediato. En este diseño, el color agrega suficiente contraste entre los elementos y una paleta de tipos limitada crea una apariencia relajante.

Fuentes utilizadas: Proxima-Nova, Liga Gótica

Paladar malvado

3. Paladar malvado

Una vez más, vemos cómo las fuentes ornamentadas se pueden usar de manera efectiva escasamente en tamaños grandes. Esta fuente decorativa se combina bien con un sans-serif minimalista para crear una fuerte impresión visual que habla de la marca.

Fuentes utilizadas: Bistro-Script-Web, Adrianna-extended, Adrianna, Helvetica Neue

826 Seattle

4. 826 Seattle

Las fuentes San-serif son algunas de las más populares en el diseño web. Desde cortas y redondas hasta altas y delgadas, la mayoría de las sans serif funcionan bien tanto para grandes bloques de texto como para pantallas. Se crea una jerarquía adecuada en el sitio web de 826 Seattle, lo que permite a los visitantes escanear fácilmente el contenido y encontrar elementos importantes.

Fuentes utilizadas: Courier, Museo Slab, Futura, Alternate-gothic-no-1-d

Casco digital en vivo

Hull Digital Live es una conferencia digital y tecnológica en el Reino Unido. Las fuentes utilizadas están bien elegidas y complementan la naturaleza moderna y progresiva del evento.

Fuentes utilizadas: Duke Fill, Proxima-nova

Aire Konos

La fuente sans-serif utilizada aquí se adapta muy bien al tipo de negocio. Un amplio espacio en blanco alrededor de la línea de encabezado brinda suficiente espacio para respirar, creando una sensación ligera y acogedora para el sitio.

Fuentes utilizadas: Steelfish_bd, Pt_sans-reg

globo de boston

Se utiliza un tipo de letra en inglés antiguo como placa de identificación del Boston Globe. También llamadas Fraktur o fuentes de letras negras, estas fuentes todavía se usan comúnmente en los periódicos y los sitios web que las acompañan en la actualidad. El resto del sitio es vanguardista y moderno. Los tamaños de fuente, los anchos de columna y la navegación se basan en las mejores prácticas en medios digitales. Para mantenerse al día con el creciente panorama móvil, The Boston Globe reformatea su diseño y tipografía para adaptarse a pantallas de escritorio, tabletas y teléfonos inteligentes utilizando un diseño receptivo.

Fuentes utilizadas: Miller Headline, Benton Sans, Georgia, Helvetica

zarzamora

La fuente del sitio web de Cloudberry le da una sensación amigable a esta empresa que brinda una buena experiencia en línea. Combinado con dos colores y solo unas pocas ilustraciones sencillas, el tipo de letra es suficiente para diferenciar el sitio.

Fuentes utilizadas: ARS Maquette

PP tatuaje

La tipografía en negrita crea un impacto para este sitio web de tatuadores. La tipografía grande es una tendencia en el diseño web moderno, pero debe ajustarse al contenido de diseño que contiene, como en el ejemplo anterior.

Fuentes utilizadas: Impact, Georgia

Greenville

Otra tendencia moderna en el diseño web es usar tipos de letra de losa para los titulares. Lo que alguna vez se usó para publicidad impresa se ha vuelto popular cuando se usa en pequeñas ráfagas de texto, especialmente en titulares, en la web. El resultado aquí le da al sitio Life In Greenville una apariencia fresca y limpia que complementa la ciudad basada en el emprendedor.

Fuentes utilizadas: Kulturista-web

Estas muestras son solo una muestra de cómo las empresas utilizan la tipografía para atraer visitantes, darles una impresión positiva de su empresa y, en última instancia, conducirlos más abajo en el embudo de conversión. Si bien no existen reglas estrictas con respecto a la selección de tipos, la experimentación, el conocimiento de las categorías de fuentes y el conocimiento de su marca son clave para crear una hermosa combinación de fuentes.

¿Qué combinaciones de fuentes encuentras visualmente interesantes? ¿Cuál de nuestros ejemplos realmente te conmueve? Háganos saber en los comentarios.