Como agregar un tipo de letra a tu página web con google fonts

El tipo de letra de tu página web le da identidad y ayuda a comunicar de una mejor forma tu propuesta de valor. Hoy te cuento como elegir la fuente que quieras e incorporarla a tu negocio online gracias a Google Fonts.

Que es Google Fonts

En dos palabras «una maravilla»  jajaja. La verdad es que para quienes llevamos años trabajando en montar sitios web Google Fonts nos ha simplificado mucho el trabajo y ayudado a dar un estilo más profesional a nuestros proyectos en forma rápida.

Para que te hagas una idea, antiguamente para cambiar una fuente debías agregar manualmente el archivo de tipografía al servidor para luego referenciarlo desde tu web y repetir ese ciclo hasta que tuvieras el estilo de fuente deseado, una auténtica pesadilla.

Google fonts es una biblioteca online gratuita con miles de tipografías a tu disposición que te permitirá incluir en tu web el tipo de letra que quieras en tan solo unos pasos sin tener que agregar archivos a tu sitio web, sino tan solo unas líneas de código, ¿Cómo es posible?, sigue leyendo.

Paso 1, Elige el tipo de letra que quieres

Lo primero que debes hacer es ir al sitio web oficial de Google Fonts y buscar entre todos los tipos de letra disponibles.

Para  hacerlo Google Fonts cuenta con un buscador inteligente que a medida que vayas escribiendo nombres de tipografías te los irá desplegando en la parte inferior. Cuenta también con filtros adicionales como categorías, idioma y propiedades para una búsqueda más específica.

Cabe decir que cada tipo de letra será mostrado en pantalla con su estilo, para que puedas ir viendo el que más te gusta fácilmente y compararlo con el resto. Como bonus te puedo decir que con la extensión de Chrome Css Peeper puedes saber los tipos de letra de una web específica en caso de que no sepas su nombre y te gustaría implementarla tal como te cuento en este episodio de mi podcast.

Paso 2, Elige el estilo para tu tipo de letra

Una vez que tomaste la decisión por un tipo de letra específico puedes hacer clic en él y tendrás que indicar cuáles serán el o los estilos que quieres incluir en tu proyecto.

Dependiendo del tipo de letra encontrarás diferentes variaciones para cursivas, nivel de peso, etc. No es lo mismo una letra fina que una gruesa y puedes incluir los estilos que quieras luego de tener una vista previa.

Otra cosa muy interesante es que para cada tipo de letra podrás descargar los archivos de la familia de fuentes completa, de esta forma podrás por ejemplo trabajar materiales anexos a tu página web como flyers, tarjetas de visita, anuncios para redes sociales, etc.

Paso 3, Copia tu estilo de letra y pégalo en tu web

Una vez que ya tienes clara tu elección de tipo de letra y variaciones de estilo, verás que en la parte derecha de la pantalla tienes a disposición el código fuente que deberás incluir en el encabezado de tu sitio web para tener hacer uso de las fuentes.

Además de esto, Google Fonts te genera las reglas de CSS para especificar las familias en caso de que quieras indicar que por ejemplo el Body de tu sitio web estará usando ese estilo a partir de ahora.

Como puedes ver todo esto es muy útil y potente para tu proyecto, pero para que no te queden dudas te dejo a continuación un video de mi canal de YouTube donde te explico paso a paso todo el proceso.

Recuerda siempre que puedes suscribirte al canal para más contenido y si quieres una clase personalizada de este y otros temas de negocios online estoy siempre disponible en mis sesiones de consultoría.

Ya sabes lo que digo, «Dios nos hace con sueños y herramientas para alcanzarlos«.

¡Nos leemos!