En este tutorial sobre Google Fonts no solo aprenderás a buscar tipografías, también a descargarlas y a elegir la mejor combinación tipográfica para que puedas usarla en tu página web.
Google Fonts es un directorio de fuentes o tipografías de calidad. Es decir, son fuentes que están optimizadas, para evitar ralentizar los tiempos de carga de tu página web y además están libres de virus.
Antes de comenzar
Antes de comenzar a elegir y descargar tipografías, tienes que tener claro qué tipo de página web vas a diseñar.
Por ejemplo, para una página de una guardería podrías elegir una fuente Sans Serif, con letras redondeadas y más divertidas.
Para una web de un emprendedor que se dedica al marketing para farmacias, sería conveniente una letra más seria.
Una vez que lo tienes claro, es el momento de comenzar a buscar la tipografía perfecta para tu web.
Psicología tipográfica
Cuando entras a Google Fonts te encontrarás con un apartado de Categorías en el que te salen varias opciones a elegir. A continuación te explicaré la psicología tipográfica que se esconde detrás de cada categoría:
Serif
Las letras con serifa son las que tienen como una especie de patitas en sus terminaciones. Es la más utilizada en las instituciones o en los sectores más tradicionales. Da sensación de seriedad y respeto.
En el entorno web se utiliza para los titulares.
Varios ejemplos de esta fuente sería la típica Times New Roman, Book Antigua, Garamond o Courier.
Sans Serif
La tipografía Sans Serif o de palo seco, es la contraria a la Serif, es decir, no tiene esas patitas en sus terminaciones, sino que es recta. Esta fuente transmite modernidad, seguridad, alegría y neutralidad.
En las páginas web la utilizamos para los párrafos, ya que es mucho más legible.
Podemos encontrar la tipografía Arial, Tahoma o Elvética dentro de esta categoría.
Display
El estilo Display es una fuente decorativa, con diferentes formas dentro de cada letra, podemos usarlas para entornos más divertidos y únicos. Se suele utilizar en grandes tamaños y podemos verla en el uso de carteles y flyers.
Este estilo de tipografía evitamos usarlo en las páginas web, ya que dificultan la lectura a tamaños pequeños.
Un ejemplo de esta fuente sería Amarante, Amerika o Eurostile.
Handwriting
La tipografía de estilo Handwriting es la que parece que está escrita a mano. Se caracteriza por su uso en cursiva. Transmite elegancia y es una fuente seductora.
En el entorno web podemos usarlas en pequeños detalles, para reforzar un título o en firmas. Evita usarla en titulares, ya que dificulta la lectura.
Algunos ejemplos típicos serían Dancing Script, Pacifico o Antro Vectra.
Cómo descargar una tipografía
Cuando has elegido la tipografía que vas a usar en tu web, es el momento de descargarla.
Para ello tienes que pinchar dentro de la tipografía elegida y darle al botón “Download Family” que encontrarás arriba a la derecha. Cuando pinchas sobre el botón, automáticamente comenzará la descarga.
Revisa tu carpeta de descargas para encontrar un archivo .zip que después tendrás que extraer.
Si quieres instalar esta tipografía en tu ordenador, es tan sencillo como hacer doble clic sobre el archivo que se ha extraído, se abrirá una nueva ventana y darle al botón instalar.
De esta forma podrás comenzar a usar la nueva fuente en tu ordenador, pero ojo, que hacer esto no significa que se quede instalada en tu WordPress.
Combinaciones tipográficas perfectas
En mi caso, he elegido la tipografía Roboto. Cuando he pinchado dentro, para descargarla, se ha abierto una página en la que puedo visualizar los diferentes pesos y estilos de la fuente elegida.
Dentro de esta misma página, bajas hasta abajo del todo y encontrarás una opción llamada “Popular Pairings”.
Este es un selector que te indica qué tipo de fuentes son combinables con Roboto o con la tipografía que hayas elegido en tu caso.
Ejemplos de combinaciones tipográficas
A continuación de dejo varios ejemplos de combinaciones tipográficas que casas perfectamente entre ellos y que podrás usar en tu página web sin patinar.
Lora y Open Sans
Pacifico y Merriweather
Parisienne y Roboto
Tutorial en vídeo
Si prefieres ver este tutorial en vídeo y pasas de leer todo lo anterior, no te preocupes, aquí te explico paso a paso cómo buscar, descargar y combinar diferentes tipografías desde Google Fonts.
Conclusión
Podrás encontrar muchísimos directorios para descargar tipografías y eres libre de elegir el que quieras. El que yo te recomiendo es Google Fonts.
Por un lado tiene una gran variedad de fuentes para descargar y que puedes usar en tu web, respetando la licencia de uso.
Por otro lado, como te decía al principio, las tipografías están optimizadas y libres de virus, lo cual es una gran seguridad para ti.
Si tienes alguna duda o sugerencia, puedes dejar tu comentario y estaré encantada de leerte.
