google fonts

Durante mucho tiempo hemos visto como por mucho que quisiéramos innovar en algún diseño web siempre nos teníamos que conformar con un pequeño grupo de tipografías que aparecían en todos nuestros ordenadores como por ejemplo la Arial, Georgia, Times New Roman o la siempre odiada Comic Sans. Y ocurría esto porque era una forma de asegurar que ese texto se pudiera leer sin dificultades en todos ordenadores fuese cual fuese su sistema operativo.

Pero desde hace unos años han ido apareciendo diversas webs en las que podemos descargar tipografías de código abierto para que podamos usar con cualquier sistema operativo, como es el caso de Google Fonts. Esto nos ha abierto mucho más las opciones a la hora de diseñar ya que podemos elegir la tipografía que mejor se adapte a las necesidades de nuestro cliente o a las nuestras propias.

¿Qué es Google Fonts?

Google Font es una herramienta de fuentes gratuitas con un gran catálogo que incluye más de 850 tipografías diferentes. Comenzó su andadura en 2011 y a día de hoy se ha convertido en una herramienta indispensable para diseñadores web ya que pueden o bien incluirlas en su página mediante código o descargarla para trabajar con ellas desde Illustrator o Photoshop, por ejemplo.

En estos 7 años la web de Google Fonts ha pasado por diferentes cambios y en la actualidad cuenta con una interfaz muy sencilla y visual en la que podrás encontrar un gran repertorio de fuentes de todos los estilos y lo que es más importante, de código abierto. Además, podrás personalizar a tu gusto tanto la letra como la búsqueda de las mismas.

[Tweet “#GoogleFonts: qué son y cómo usarlas en tu página web. ¿Te animas a probarlas?”]

¿Cómo usar Google Fonts?

La forma de usar Google Fonts es muy fácil. Para poder descargar o agregar a tu web las fuentes que más te gusten tan solo tendrás que seguir unos sencillos pasos.

1.- Entra en la web de Google Fonts y podrás comprobar lo sencilla y clara que es su interfaz.

2.- En la pantalla principal te aparecen algunas de las fuentes disponibles. Agrega el texto que quieras y podrás aplicarlo a todas para que veas cómo va a quedar realmente.

Google Fonts

3.- Personaliza la letra elegida dándole más grosor o tamaño, por ejemplo.

Google Fonts4.- Una vez que ya tengas la letra personaliza, en la parte superior derecha hay un símbolo de más (+). Pincha ahí y automáticamente te aparecerá una pantalla en la parte de abajo derecha con la letra que has seleccionado lista para usar.

 

Google Fonts5.- Abrimos esa pestaña y aparecerá la letra que hemos seleccionado. Desde aquí podremos hacer dos operaciones. La primera de ellas es descargar la tipografía para instalarla en nuestro ordenador y trabajar con ella en Photoshop, Illustrator u otros programas. Y la otra opción es copiar el código e incluirlo en nuestra página web dándole un toque más personal al diseño.

Google Fonts6.- Si lo que quieres es buscar un tipo de letra en concreto en la parte izquierda tienes un menú en el que podrás especificar las características que quieres que tenga tu familia tipográfica.

Google FontsComo ves conseguir una fuente diferente o personalizada para tus trabajos de diseño es muy sencillo usando la página de Google Fonts.

¿Cómo hacer una buena elección de familia tipográfica?

Antes de lanzarte a probar cientos y cientos de letras para tus trabajos de diseño deberás tener claros ciertos aspectos como los que te mencionamos a continuación, de lo contrario perderás mucho tiempo eligiendo y probando tipografías diferentes.

  • Piensa en el estilo del cliente o del trabajo que tengas que realizar. Deberás buscar una letra acorde a su estilo y con unas características que concuerden con la filosofía de esa empresa. Ten muy claro quién es el público al que va dirigido el texto.
  • No elijas demasiadas tipografáis para un mismo trabajo. Es recomendable contar como mucho con dos familias de letras que sean complementarias entre si, para que no rompan la estética de tu web.
  • Haz pruebas de la fuente en tu página web. Puede que aunque nos guste mucho una letra no tenga una armonía con el resto de los detalles y elementos del diseño web.
  • Elige letras que sean fáciles de leer. Aquí viene el dilema: letra con serif o sin serif. ¿Qué quiere decir? La letras serif cuentan con una terminación a modo de decoración, como por ejemplo la Times New Roman y suele usarse en textos largos. Por otro lado está la letra sin serif, orientada generalmente al público más joven y que puede ser más sencilla de leer como por ejemplo la Arial.

Algunos ejemplos de tipografías de Google Fonts

A continuación os mostramos algunas de las tipografías que podrás descargar en la web de Google Fonts. Toma nota.

  • Ejemplos de tipografía con serif

Google Fonts

  • Ejemplos de tipografía sin serif

Esperamos que este post os sirva de ayuda. Ahora no hay excusa para tener en nuestra web una tipografía diferente que refleje el espíritu de nuestra empresa. Tienes más de 850 para elegir! seguro que hay alguna que te gusta

¿Conoces otras páginas para descargar fuentes? ¿Cuáles son tus favoritas?