¿Por qué es mejor usar Google Fonts en diseño web?. Hubo un momento oscuro en Internet cuando un sitio web solo podía considerarse de buena usabilidad si mostraba textos en Arial o Times New Roman. Hubo un momento aún más oscuro cuando era aceptable usar Comic Sans, ¡es mejor que ni siquiera lo recuerdes!
La verdad es que desde que Google decidió abordar el problema definitivamente con su API de fuentes, los diseñadores han obtenido mucha más personalización y expresión para su trabajo de diseño web independiente . ¡Es por eso que le mostraremos ahora por qué usar una fuente de Google es la mejor solución para usted!
¿Qué es una fuente de Google?
Después de todo, ¿qué significa API de fuentes de Google? Este es el nombre de la interfaz de programación de aplicaciones que creó el gigante de las búsquedas para facilitar el trabajo de los diseñadores web al elegir la tipografía de un sitio web.
En el pasado, los navegadores solo podían mostrar las fuentes en una página web si estaban instaladas en la computadora del usuario. Esto limitó enormemente la creatividad de los profesionales de la web, que estaban restringidos a las fuentes del sistema para no causar problemas de visualización (como Arial, Verdana, Times New Roman, etc.).
Con la API de Google, las fuentes se representan usando un directorio en la nube, sin la necesidad de tenerlas instaladas en el sistema de la persona que ve la página. Es un cambio simple, pero que abre un nuevo mundo de posibilidades para el profesional independiente que quiere más calidad y estilo en su trabajo.
Ventajas de usar Google Fonts en diseño web?
No en vano los diseñadores web han estado integrando este directorio de fuentes en su trabajo. No es porque a todos nos guste Google, es porque le dan ventajas competitivas y conceptuales al profesional independiente que busca destacarse de la competencia. Vea las razones de esto:
Licencia comercial gratuita
La primera razón ya es un buen incentivo para comenzar a usar Google Fonts. Todos los diseñadores independientes saben lo difícil que es encontrar fuentes de calidad que estén fuera de los estándares del sistema sin tener que recurrir a la piratería.
Sí, esos días han terminado. El directorio de Google ofrece más de 800 familias de fuentes de alta calidad técnica y visual, gratuitas y de código abierto. Esto significa que puede descargar, usar y modificar cualquiera de ellos de la manera que desee.
Facilidad de implementación
Google creó su directorio de fuentes pensando específicamente en su uso para Internet. Por lo tanto, es muy fácil buscar y agregar familias a su freela de diseño web.
Todos ellos tienen el mismo sistema de implementación unificado para CSS y HTML, solo elija la fuente de Google que desee, copie el código y agréguelo a la página que está creando.
Ganar en usabilidad
Una gran ventaja de este directorio es la variedad de familias de fuentes para los diversos usos que puede tener en una página. Simplemente establezca su prioridad para la usabilidad que está buscando.
¿Quieres una página más legible? ¿Para uso preferencial en dispositivos móviles? ¿Desea que las fuentes de pantalla integren gráficos y usabilidad? ¡Solo busque lo que necesita y comience la integración!
Como la usabilidad no es de solo lectura, también debe preocuparse por la ligereza del sitio y la rapidez con que se ve su página. Con eso en mente, Google clasifica las fuentes por tiempo de carga, de rápido a lento, para que sepa objetivamente cuánto afectará esa familia al peso de su página.
Libertad de estilismo
Está claro que para un diseñador es importante imprimir su estilo después de que se resuelva la usabilidad. Es en este momento que un profesional independiente necesita huir de las fuentes estándar para poder mostrar su estética y concepto.
El directorio de Google ofrece fuentes con y sin serif, fantasía y visualización, manuscrita y monoespacio, opciones para todos los casos al diseñar su proyecto .
Cómo incluir una fuente de Google en tu diseño?
Es muy fácil agregar una fuente de Google a su proyecto, ya sea su sitio de cartera o un freela de diseño web. Vea los pasos a continuación:
1. Elige la fuente
Vaya a directamente a Google Fonts. Lamentablemente, el sitio solo está en inglés, pero es muy fácil de navegar. Puede explorar todo el directorio hasta encontrar lo que necesita, pero también puede usar la búsqueda para buscar un nombre y refinar los resultados por categoría.
2. Seleccione la fuente
Seleccione las familias de fuentes que prefiera haciendo clic en el signo «+» junto a su nombre. Al hacer esto, la familia elegida se agregará a un menú en la parte inferior de la página.
3. Personaliza la familia seleccionada
Al abrir el menú con las fuentes que eligió, vaya a la pestaña «PERSONALIZAR» para agregar todos los pesos que está considerando usar en su diseño. En ese momento, ¡ten cuidado!
Cuantas más opciones de peso seleccione, mayor será la influencia de la fuente en el tiempo de carga de la página. Utilice solo los que sean necesarios para garantizar su estilo y usabilidad del sitio web.
4. Agregue fuentes de Google a su código
¿Fuentes definidas?, es hora de importarlas en su trabajo. En el mismo menú para familias seleccionadas, la pestaña «EMBED» generará el código que necesita para usar la fuente. Puede usar el método HTML tradicional o la regla @import en el CSS de su sitio.
Además, Google también genera la regla para que usted especifique el uso de familias en el código de estilo, ¡bastante didáctico para que no se equivoque!
El directorio de Google Fonts surgió como la solución a la dificultad que los diseñadores tuvieron para variar y sorprender en sus proyectos de diseño web. Comprender cómo funciona y aprender a usarlo es esencial para que un profesional independiente se destaque de la competencia en personalidad, eficiencia y profesionalismo.
Ahora que está listo para usar una fuente de Google para el diseño web independiente, es hora de poner en práctica sus conocimientos, no solo para diseñar su diseño sino también para facilitar la vida de los usuarios que su cliente desea atraer. Desde tipografías.online nos complace poder ayudarte. ?
