Blog de Ciberseguridad

Google web fonts

Abr 6, 2013

Google sigue en su carrera particular de entrar en todas partes y lo hace con fuerza allí donde se lo proponga. Y si somos diseñadores web tendremos un buen aliado en google web fonts.

Hasta ahora podíamos usar las “web safe fonts” o con la regla “font-face” de css y un buen puñado de archivos (.ttf, .otf, .eot, .woff y .svg) podíamos disponer de una tipografia en nuestra web sin necesidad de que el usuario la tuviera instalada en su sistema, fuera cual fuera.

google_web_fonts

Si las “web safe fonts” se quedan cortas y la segunda opción nos da muchos dolores de cabeza, tenemos otra más sencilla: en google web fonts elegimos entre las 624 tipografías (a 29/03/2013). Elegida una, vamos a “Quick-Use” dónde se nos desplegan cuatro puntos:

  1. Estilos de la fuente (negrita, cursiva…). También nos muestra en forma de medidor el impacto de la tipografía en la carga de la página.

  2. Seleccionamos la/las codificación(es) de carácteres que necesitemos.

  3. Añadir el código a nuestra web. Elegiremos la opción que más se adapte a nuestras necesidades para enlazar la hoja de estilos (Standard,@import o Javascript), y copiamos y pegamos el código dentro de “<head>”.

  4. Y finalmente nos da un ejemplo de como usar nuestra tipografía ya enlazada, y no es más que, con una regla CSS, formatear el elemento que queramos con la nueva tipografía. Por ejemplo: p{font-family:’Montserrat Subrayada’, sans-serif;}.

Soluciones fáciles, rápidas y efectivas. Cómo nos gustan en BCNSoluciona.

Ir al contenido