7 claves efectivas para aumentar las ventas de tu página web

Consigue más y mejores ventas para tu negocio online aplicando estas 7 claves probadas.

Tutorial completo sobre Google Fonts

Comparte este artículo
Share on linkedin
Share on facebook
Share on email
Share on telegram
Share on whatsapp

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:

psicologia de las tipografias

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.

tipografía-Serif

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.

tipografía-Sans-serif


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.

tipografía-display

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. 

tipografía-script



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. 

descargar-tipografia-google-fonts

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.

como-instalar-una-tipografia-en-mi-ordenador

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.

Combinaciones-tipográficas-perfectas

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.

¡Valora este artículo!
(Votos: 2 Promedio: 4.5)
Formación de diseño web estratégico

Aprende a diseñar de forma estratégica tu página web y deja de perder tiempo viendo cursos básicos que no te aportan más de lo que ya sabes

Comparte este artículo
Share on linkedin
Share on facebook
Share on email
Share on telegram
Share on whatsapp
Artículos recomendados

Tipos de diseñador web: de la imagen a la estrategia

¿Estás buscando a alguien que se ocupe de diseñar tu sitio web? ¿Conoces los tipos de diseñador web que pueden ayudarte? No siempre es fácil entender las diferencias para poder elegir qué necesita tu negocio. Algunos te hablan del enfoque en el aspecto visual, otros de cuidar la seguridad o de campañas de posicionamiento SEO.

Cómo unificar diseño web y SEO de forma fácil

La apariencia externa es lo primero que siempre miramos tanto en una persona, como en cualquier otro ámbito de la vida. Te preguntarás, ¿qué tiene esto que ver con el diseño web y el SEO? Pues mucho, más de lo que te imaginas. Para explicarme mejor, digamos que el diseño web sería como la fachada

Deja un comentario