5 tipografías de Google Fonts para tu página web

5 tipografias para diseñar tu pagina web

¿Aún no conoces las tipografías de Google Fonts para tu página web? Pues es el momento de que las conozcas y empieces a utilizarlas!

Google Fonts

Google Fonts ofrece todo tipo de tipografías de uso gratuito, que puedes utilizar para prácticamente cualquier cosa que necesites! Puedes descargarlas para usar las en tu ordenador o simplemente puedes añadir unas pequeñas lineas de código en tu web para poder utilizar las que más te gusten!

¿Cómo elijo las tipografías para una página web?

Cuando elijo una tipografía para una página web, lo primero que pienso es en que tiene que ser una tipgrafía versátil, por lo que tiene que estar disponible en varios estilos, negritas, seminegritas, cursivas…. además hago pruebas con ellas, sobre como se ven con más interlineado o menos interlineado y con más espaciado entre las letras y menos.

Por supuesto, esta tipografía debe de ser además acorde con la imagen de la empresa o la persona que está detrás de la página web o tienda online. Pero también es muy importante cómo usarla.

Ya hablé en un post anterior (Rediseñandome a mi misma) sobre las tipografías de esta página web, que son dos de mis preferidas, pero hoy quiero centrarme en otras 5 tipografías y sus diferentes usos:

5 tipografías de Google fonts para tu página web

Montserrat

Tipografia para diseñar tu pagina web Montserrat

Una tipografía muy versátil, en la imagen anterior puedes ver como quedaría con diferentes espaciados entre letras y diferentes estilos (negritas y cursivas). Personalmente esta tipografía me encanta y creo que concuerda con muchos estilos de páginas web. Tanto es así que es una de las tipografías más usadas en web de Google Fonts.

Está disponible para uso en hasta 18 estilos diferentes

  • Thin
  • Thin italic (cursiva)
  • Extra Light
  • Extra Light Italic
  • Light
  • Light Italic
  • Regular
  • Regular Italic
  • Medium
  • Medium Italic
  • Semi-bold
  • Semi-bold Italic
  • Bold
  • Bold Italic
  • Extra Bold
  • Extra Bold Italic

Con todos estos estilos y posibilidades que nos ofrece, pueden parecer dos tipografías totalmente diferentes, en una misma página web, evitando con ello cargar dos tipografías (una para títulos y otra para textos) en tu página web y reduciendo el número de archivos que tu página web debe de cargar, mejorando así la velocidad de carga de tu web!

Raleway

Tipografia para diseñar tu pagina web Raleway

Esta sí que es una tipografía que nos ofrece millones de posibilidades y vista de diferentes formas, no parece ni por asomo la misma tipografía.  Es una de mis preferidas para muchos proyectos precisamente por esto, utilizada en mayúsculas con un buen espaciado entre letras, no tiene nada que ver con la tipografía original que quizás ofrece un estilo más desenfadado.

Podéis ver en la imagen algunas de las opciones que ofrece esta tipografía y cómo no parece la misma tipografía.

Está disponible por defecto también en 18 estilos:

  • Thin
  • Thin italic (cursiva)
  • Extra Light
  • Extra Light Italic
  • Light
  • Light Italic
  • Regular
  • Regular Italic
  • Medium
  • Medium Italic
  • Semi-bold
  • Semi-bold Italic
  • Bold
  • Bold Italic
  • Extra Bold
  • Extra Bold Italic

Ideal practicamente para cualquier tipo de diseño e imagen.

Dosis

Tipografia para diseñar tu pagina web Dosis

Otra de las tipgrafías que sorprenden por ofrecer miles de opciones y diseños totalmente diferentes en su uso es la tipografía Dosis. Como puedes ver en la imagen, es una tipografía que desctaca por su estilo y su variedad.

Dosis está disponible sólo en 7 estilos diferentes por defecto ya que no tiene posibilidad de cursiva, aún así para algunos diseños es una de mis preferidas:

  • Extra
  • Light
  • Regular
  • Medium
  • Semi-bold
  • Bold
  • Extra Bold

Puede usarse prácticamente en cualquier tipo de diseño, para títulos o para textos.

Muli

Tipografia para diseñar tu pagina web Muli

Con un toque muy redondito, esta tipografía resulta muy versátil y con muchas posibilidades y estilos diferentes para poder jugar con ella, hasta encontrar lo que más coincide con tus necesidades.

Está disponible en 14 estilos por defecto:

  • Extra Light
  • Extra Light Italic
  • Light
  • Light Italic
  • Regular
  • Regular Italic
  • Semi-bold
  • Semi-bold Italic
  • Bold
  • Bold Italic
  • Extra Bold
  • Extra Bold Italic
  • Black
  • Black Italic

Ideal para aportar estilo en cualquier página web.

Titilum Web

Tipografia para diseñar tu pagina web Titilium Web

La última tipografía que he elegido hoy, es una tipografía que tiene mucha personalidad, pero también que ofrece mucha variedad, la Titilium Web, me gusta tanto para proyectos desenfadados como para proyectos que requieren un poco más de estilo, por lo personal que es.

Está disponible por defecto en 11 estilos diferentes:

  • Extra Light
  • Extra Light Italic
  • Light
  • Light Italic
  • Regular
  • Regular Italic
  • Semi-bold
  • Semi-bold Italic
  • Bold
  • Bold Italic
  • Black

 

Con cualquiera de estas tipografías, jugando un poco con ellas y con sus estilos podrás encontrar el tuyo propio para darle valor a tu página web, recuerda siempre que la tipografía es uno de lo elementos más importantes de tu página web, ya que es una parte muy importante de tu imagen. Además la tipografía elegida debe de ser de fácil lectura para que tus visitantes puedan leer cómodamente todo lo que tienes que contarles…

¿Y tu? ¿Cuáles son tus tipografías preferidas?

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Información básica sobre Protección de Datos

  • Responsable:Estefanía Álvarez Vijande.
  • Fin del Tratamiento:Respuesta a la información solicitada y relación comercial.
  • Legitimación:El consentimiento del usuario.
  • Destinatarios:Los datos no se comunicaran a terceros, salvo obligación legal.
  • Derechos:Acceder, rectificar y suprimir los datos, tal como se explica en la información adicional
  • Información Adicional:Puedes consultar toda la información sobre protección de datos en la Política de Privacidad

Ir al contenido