Mejores fuentes para web

Las mejores fuentes de Google

No hay duda de que las fuentes web son un tema candente. Parece que, tras décadas de insistencia, el mundo por fin está viendo las cosas como las ven los diseñadores: la tipografía importa y es importante hacerla bien.

¿Por qué son tan importantes las fuentes? Cuando se diseña un sitio web, puede ser fácil conformarse con las fuentes predeterminadas y centrarse en otras decisiones aparentemente más importantes. Sin embargo, esto no sólo sería un error, sino que estarías perdiendo el poder de las fuentes y los beneficios que pueden aportar a tu sitio. En su herramienta de creación de prototipos, ver la fuente final en todo su esplendor puede arrojar nueva luz sobre su producto. He aquí algunos ejemplos de cómo la elección de las fuentes adecuadas puede beneficiar a su sitio web.

Las fuentes ayudan a la creación de la marcaLa elección de la fuente adecuada para su sitio web puede suponer una gran diferencia para su marca. Desde el logotipo hasta los números, pasando por el microcopy, la elección de la fuente establece una especie de comunicación no verbal con el lector. Debido a la forma en que nuestros ojos responden inconscientemente a las señales visuales (escribimos más sobre esto cuando hablamos de la narración y la UX), las fuentes de su sitio web pueden influir en la impresión inmediata que el lector tiene de su marca.

Fuentes del sitio web

* Nota: Un asterisco indica que la familia es apta para el cuerpo de texto, lo que significa que contiene estilos regulares, cursiva y negrita y tiene un contraste de trazo bajo a moderado, contadores grandes, aperturas abiertas y una altura x grande.

Sí. Puede descargar los archivos ZIP de esta página (utilizando los enlaces situados bajo la esquina inferior derecha de las imágenes de muestra) y luego instalar los archivos de fuentes localmente en su sistema como lo haría con cualquier otra fuente. Algunas fuentes están optimizadas para su uso en pantallas, por lo que siempre es una buena idea imprimir algunas copias de prueba para ver cómo se leen en una página impresa.

Sí, puede descargar los archivos ZIP de esta página (utilizando los enlaces situados en la esquina inferior derecha de las imágenes de muestra) y luego instalar los archivos de fuentes localmente en su sistema como lo haría con cualquier otra fuente.

Archivo Narrow (incluida en la lista anterior) es realmente genial. Roboto y Open Sans también vienen en anchos condensados. Otras buenas opciones son Barlow Condensed, Pathway Gothic One, Fjalla One y Oswald.

Ha sido difícil reducir la lista a 40 opciones, así que aquí hay otros contendientes que no han pasado el corte: Zilla Slab, Overpass, Josefin Sans, Josefin Slab, Old Standard TT, Gentium Basic, Varela Round, Rajdhani, Bitter y Nunito Sans.

Fuentes de Google

Aquí puedes encontrar una selección de fuentes que hemos elegido, en parte por sus cualidades estéticas, pero sobre todo por su funcionalidad. Además de familias con muchos estilos y pesos, encontrarás fuentes optimizadas para interfaces, fuentes web optimizadas para la interfaz de usuario, y otras especialmente legibles en párrafos, o especialmente cómodas para leer en el móvil y legibles en cualquier dispositivo, ya sea smartphone, escritorio o tableta.

Las fuentes se alojan en el servidor del usuario independientemente de los servicios externos. @font-face era una regla obsoleta de CSS2 que ha sido reintroducida en las especificaciones de CSS3 y es soportada por casi todos los navegadores modernos. Una fuente web es una fuente personalizada que es soportada por diferentes navegadores y viene en formatos como TTF, WOFF, EOT y SVG.

@font-face { font-family: ‘ChunkFiveRegular’; src: url(‘Chunkfive-webfont.eot’); src: url(‘Chunkfive-webfont.eot?#iefix’) format(’embedded-opentype’), url(‘Chunkfive-webfont. woff’) format(‘woff’), url(‘Chunkfive-webfont.ttf’) format(‘truetype’), url(‘Chunkfive-webfont.svg#ChunkFiveRegular’) format(‘svg’); font-weight: normal; font-style: normal; }

Las mejores fuentes web gratuitas 2021

Fondo: Abril Fatface es una fuente gratuita que forma parte de una familia tipográfica mucho más amplia y de primera calidad llamada Abril. La familia de fuentes en su conjunto fue una reimaginación de las clásicas newsface para los lectores de hoy en día. Sin embargo, este tipo de letra en particular destaca entre los miembros de la familia por sus caracteres más pesados (“gordos”). Esto se debe a que Abril Fontface se inspiró en el texto del título utilizado en los carteles publicitarios del siglo XIX. Cuándo debe utilizarla: Si buscas una forma de añadir un toque más atrevido a un sitio de noticias, una revista digital o un blog, esta sería una elección de fuente limpia pero fuerte para tus encabezados. 2. Adieu Tipo de fuente: Extended sans serifGratis/premium: Premium

Fundición o diseñador: Kenneth Knutsen para Good Type FoundryFondo: Adieu es lo que se conoce como un tipo de letra extendido. Esto significa que sus caracteres son extra anchos, lo que puede llevar a los visitantes a leer el texto a un ritmo más lento de lo habitual, lo que hace que el mensaje sea más memorable. Al ser una fuente bastante dominante, Adieu suele funcionar bien en logotipos y textos de cabecera de sitios web. Inspirada en temas de velocidad y deporte, las letras presentan un gran contraste entre trazos gruesos y finos, creando una sensación de velocidad. Cuándo debe utilizarla: Debido a la anchura de este tipo de letra, puede esperar que los visitantes lean sus palabras más lentamente. Teniendo en cuenta esto, harías bien en evitar el uso de esta fuente para el texto de los párrafos normales y relegarla sólo a tus encabezados o logotipos. 3. Andika Tipo de letra: Sans serif