Tipografía responsiva: elige la fuente más adecuada para tu web

Si estás buscando una fuente para tu página web responsiva, seguramente encontrarás cientos de familias tipográficas en Internet. Teniendo en cuenta que el diseño web está compuesto aproximadamente en un 95% de tipografía, hemos creado una serie con los fundamentos necesarios sobre tipografía responsiva. Mientras que la última parte de esta serie se centra en la implementación técnica de la tipografía en el diseño responsivo con CSS, en esta segunda parte te indicamos dónde obtener fuentes web gratuitas y la mejor manera de aplicarlas.

Las familias tipográficas son una parte fundamental del diseño responsivo, pues están basadas en gráficos vectoriales escalables. Cuando se carga una página web, un servidor se encarga de descargar las fuentes para que estas puedan ser convertidas y visualizadas correctamente en el navegador web del usuario. La tipografía responsiva, por su parte, se adapta automáticamente a los requerimientos específicos de cada navegador para una mejor visualización. Varias plataformas de Internet ofrecen fuentes web que pueden ser descargadas, tanto de pago como gratuitas. Dentro de los proveedores de pago más reconocidos están Typekit o Fontspring, que cuentan con una amplia gama de fuentes conocidas y, entre ellas, varias clásicas. Igualmente, es posible decidirse por alguna de las ofrecidas por los proveedores gratuitos, como son: Google Fonts, Adobe Edge Web Fonts, Font Squirrel o DaFont. Sin embargo, no todas las fuentes disponibles son las más apropiadas para la mayoría de los proyectos. Algunas son demasiado informales o poco comunes y, por lo tanto, solo son recomendables para propósitos muy específicos y otros no tienen caracteres especiales como la eñe, las tildes o la diéresis. Además, el tamaño de los caracteres varía normalmente entre una fuente y otra. Es importante prestar atención a este tipo de fuentes y asegurarse de adoptar la que incluya los caracteres necesarios. Como ejemplo te presentamos algunas de las Google Fonts más prácticas y versátiles dentro del diseño web responsivo.

La plataforma Google Fonts es utilizada por muchos diseñadores web como fuente de tipografía web responsiva. Desde su lanzamiento en 2010, esta web ha tenido como objetivo poner a disposición de los usuarios fuentes web de código abierto (en total, más de 700) para ser utilizadas con fines personales o comerciales. Así, todas las fuentes pueden ser descargadas y su código puede ser implementado en cualquier página web.

Existe una amplia gama de familias tipográficas para páginas web responsivas. Como diseñador web es posible conseguir fuentes web de código abierto en plataformas como Google Fonts, Adobe Edge Web Fonts y Font Squirrel, por mencionar algunas. Sin embargo, también es importante tener en cuenta que fuentes como “Open Sans”, “Roboto” o “Lato” son muy populares y, por lo tanto, son usadas muy a menudo en Internet. Como consecuencia, quien quiera tener una fuente única o personalizada, deberá invertir cierta cantidad de dinero. Una opción más económica es la de conseguir una tipografía de código abierto e individualizarla, proceso que seguramente tomará algo de tiempo, pero no implicará ningún gasto. Por otra parte, la integración de una tipografía online en la propia página web responsiva es sencilla y rápida, características que tendrán un impacto positivo en la experiencia de usuario de los visitantes de tu web.