El uso de tipografías para web siempre ha sido un problema. Por defecto, los navegadores web solo podían presentar el texto con las tipografías que el usuario tenía instaladas en su sistema operativo (Windows, Mac, Linux,…).
La mejor manera de hacerlo era con las llamadas tipografías seguras, un listado de tipos de letra que se utilizaban en orden establecido. Si la primera fuente no estaba disponible en el ordenador del usuario, se utilizaba la segunda fuente.Y, así, sucesivamente. Estas eran los familias de fuentes utilizadas:
Cuáles son las tipografías para web seguras
Las tipografías para web que funcionaban de manera adecuada en cualquier navegador han sido:
- Verdana, Geneva, sans-serif.
- Georgia, Times New Roman, Times, serif.
- Courier New, Courier, monospace.
- Arial, Helvetica, sans-serif.
- Tahoma, Geneva, sans-serif.
- Trebuchet MS, Arial, Helvetica, sans-serif.
- Arial Black, Gadget, sans-serif.
- Times New Roman, Times, serif.
- Palatino Linotype, Book Antiqua, Palatino, serif.
- Lucida Sans Unicode, Lucida Grande, sans-serif.
- MS Serif, New York, serif.
- Lucida Console, Monaco, monospace.
- Comic Sans MS, cursive.
Una posible solución a este problema con las tipografías para web era utilizar imágenes, lo que permitía crear cualquier efecto con los textos de las webs. Esto suponía un aumento en el tiempo de descarga. Se solucionaba el tema del diseño, pero no era la solución.
Las nuevas tecnologías web y los nuevos navegadores permiten presentar cualquier fuente que quieras utilizar.
Bibliotecas de fuentes indispensables para cualquier diseñador
En muchas ocasiones no encuentras las tipografías para web adecuadas. Estas son algunas de las fuentes que puedes aprovechar para dar a tus páginas web un diseño tipográfico impactante:
No todas las fuentes valen para lo mismo. Elegir bien las tipografías para web puede marcar la diferencia de tu sitio web. Por eso, deberás probar cuál es la que mejor te conviene para combinarla con el diseño que elijas, teniendo en cuenta que lo más importante de las tipografías es su legibilidad.
[Banner-soporte]
A continuación tienes 60 mejores tipografías para web de Google Fonts para mejorar el diseño de tu página web:
1.- Lato
Lato es una familia tipográfica sans serif que comenzó en el verano de 2010 por el diseñador Łukasz Dziedzic, basado en Varsovia («Lato» significa «verano» en polaco)
Su diseñador, trató de equilibrar cuidadosamente algunas prioridades potencialmente conflictivas. Quería crear un tipo de letra que pareciera bastante «transparente» cuando se usara en el texto del cuerpo, pero mostraría algunos rasgos originales cuando se usara en tamaños más grandes. Utilizó proporciones clásicas (particularmente visibles en mayúsculas) para darle a las formas de letra armonía y elegancia familiares.
2.- Open sans
Open Sans es una tipografía sans serif humanista diseñada por Steve Matteson, Type Director de Ascender Corp. Esta versión contiene el conjunto completo de caracteres 897, que incluye los juegos de caracteres ISO Latin 1, Latin CE, Greek y Cyrillic estándar. Open Sans fue diseñado con un estrés vertical, formas abiertas y una apariencia neutral, pero amigable. Estaba optimizado para impresoras, web e interfaces móviles, y tiene excelentes características de legibilidad en sus letras.
3.- Proxima nova
La familia Proxima Nova es una revisión completa de Proxima Sans (1994).
Desde el punto de vista estilístico, Proxima Nova abarca la brecha entre tipografías como Futura y caras sanas clásicas. El resultado es un híbrido que combina proporciones humanísticas con un aspecto algo geométrico.
4.- Source Sans Pro
Fuente Sans Pro es un conjunto de fuentes OpenType que han sido diseñadas para funcionar bien en entornos de interfaz de usuario (UI). Además de una fuente funcional OpenType, este proyecto de código abierto proporciona todos los archivos fuente que se utilizaron para crear esta fuente OpenType mediante la herramienta AFDKO makeotf.
5.- Calibri
Calibri es la tipografía más popular para el correo electrónico, la mensajería instantánea y las presentaciones. También obtuvo buenos resultados para el uso en texto de páginas web.
6.- Cera
Cera combina calidez con elegancia. En un compañero interesante para el diseño web.
7.- Montserrat
8.- Helvetica® Neue
9.- Raleway
10.- Keep Calm
[Banner-anunciante]
11.- Basic tittle
Crea increíbles imágenes de texto o logotipos con diferentes colores y cientos de efectos de texto.
12.- Code
Es aplicable para cualquier tipo de diseño gráfico: web, impresión, gráficos en movimiento, etc., y es perfecto para camisetas y otros artículos como pósters, logotipos.
13.- Couture
Tipo de letra utilizado por Chanel, perfecta para diseño de logotipos.
14.- Dolce Vita
Dolce Vita viene en: Light, Normal, y Bold.
15.- Nova
Mark Simonson, su diseñador fundó su estudio especializado en letras y tipografía en 2000. Había comenzado como diseñador gráfico e ilustrador en 1976, trabajando como director de arte en varias revistas y en la Radio Pública de Minnesota. Mark comenzó a otorgar licencias de fuentes a FontHaus en 1992 y ahora tiene más de 100 fuentes en el mercado.
16.- Quicksand
Está diseñado para fines de exhibición, pero también es lo suficientemente legible para usar en tamaños pequeños.
17.- Asenine
18.- Fine Style
19.- Alegreya
[Banner-soporte]
Diseñado por Huerta Tipográfica, una fundición argentina de colaboración con un profundo respeto por el diseño y la tipografía. Fundada en 2009, la compañía comenzó como un lugar para reunirse, cooperar y compartir experiencias mientras colaboraba en proyectos académicos y comerciales. Huerta Tipográfica desarrolla fuentes personalizadas y minoristas con licencias libres, patentadas o exclusivas, y está firmemente comprometido con la creación de tipos innovadores y funcionales. Su trabajo galardonado ha sido reconocido por Letter.2, Tipos Latinos y la Bienal Iberoamericana de Diseño.
20.- Asap
Asap es una familia de tipografías para web sans-serif contemporánea con sutiles esquinas redondeadas. Diseñado por Pablo Cosgaya, Asap («tan pronto como sea posible») hay 4 estilos: Regular, cursiva, negrita y negrita cursiva. Esta familia, especialmente desarrollada para el uso de pantalla y escritorio, ofrece un ancho de caracteres estandarizado en todos los estilos, lo que significa que las líneas de texto siguen siendo de la misma longitud. Esta función útil permite a los usuarios cambiar estilos de texto en movimiento sin tener que reenviar un cuerpo de texto. Asap se basa en Ancha (diseñado por Pablo Cosgaya y Hector Gatti), y ha sido desarrollado con la colaboración de Andrés Torresi.
21.- Merriweather
Tipo Sorkin
Merriweather fue diseñado para ser una cara de texto que es agradable de leer en las pantallas. Presenta una letra X muy grande, ligeramente condensada, una tensión diagonal suave, serifas robustas y formas abiertas.
También hay Merriweather Sans, una versión sans-serif que armoniza estrechamente con los pesos y estilos de esta familia serif.
22.- Roboto
Roboto tiene una naturaleza dual. Tiene un esqueleto mecánico y las formas son en gran parte geométricas. Al mismo tiempo, la fuente presenta curvas amables y abiertas. Mientras que algunos grotescos distorsionan sus formas de letra para forzar un ritmo rígido, Roboto no compromete, permitiendo que las letras se coloquen en su ancho natural. Esto hace que el ritmo de lectura más natural se encuentre más comúnmente en los tipos humanista y serif.
23.- Amaranth
24.- Gentium Basic
El conjunto de caracteres admitido, sin embargo, es mucho más pequeño que para las fuentes principales de Gentium Plus. Estas fuentes «Básicas» solo admiten los rangos básicos Unicode del complemento Latin y Latin-1, más una selección de los caracteres latinos extendidos más utilizados, con marcas diacríticas, símbolos y signos de puntuación diversos.
En particular, estas fuentes no son compatibles con IPA latino extendido completo, soporte completo para idiomas de Europa Central, griego y cirílico. Vea la página principal del proyecto Gentium para más detalles.
La familia Gentium Book Basic es muy similar pero tiene un peso ligeramente más oscuro.
25.- Noto Sans
26.- Ubuntu
El alcance de la familia de fuentes de Ubuntu incluye todos los idiomas utilizados por los diferentes usuarios de Ubuntu en todo el mundo, en sintonía con la filosofía de Ubuntu, que establece que todos los usuarios deben poder usar su software en el idioma que prefieran.
27.- Droid Sans
28.- Signika
29.- Josefin Slab
30.- Vollkorn
[Banner-anunciante]
31.- Bree Serif
32.- Poppins
33.- Hind
34.- Playfair Display
35.- Lora
36.- Domine
37.- Fira Sans
38.- Old Standard TT
39.- PT Serif
40.- Oswald
[Banner-soporte]
41.- Cabin Condensed
42.- Abril Fatface
43.- Dosis
44.- Oxigen
45.- Pathway Gothic One
46.- Advent Pro
47.- Maven Pro
48.- Arvo
49.- Patua one
50.- Varela Round
51.- Questrial
52.- Titillium web
53.- Libre Baskerville
Esta romana con aspecto clásico funciona muy bien para la lectura en pantalla.
54.- Orbitron
[Banner-anunciante]