Snippets

Múltiples fuentes en una sola petición – Google fonts

0

Cada día es más común utilizar fuentes personalizadas en los sitios web, fuentes que aparte de cumplir su objetivo principal también sirven para embellecer y darle personalidad a las páginas web. Hay diferentes formas de cargar fuentes personalizadas en nuestros sitios, la principal sin duda por medio de Google Fonts, este servicio que nos ofrece Google y nos presenta cientos de fuentes totalmente gratuitas de código abierto y optimizadas para la web.

Todo esto es genial, el único inconveniente es que al tratar de utilizar varias fuentes traídas desde Google va a aumentar el número de peticiones que hace una página web al cargarse, en este caso uno externo.

Por ejemplo si tratáramos de cargar 3 fuentes de Google lo haríamos de la siguiente forma:

Pero, mira lo que sucede. Cada fuente es una petición diferente.

carga-multiple-google-fonts

Una forma de solucionar este problema es cargar todas las fuentes en una etiqueta link, que nos carga una hoja de estilos, en este caso serían las tres fuentes:

<link href='https://fonts.googleapis.com/css?family=Oswald|Lato|Lobster' rel='stylesheet'>

Incluso podemos cargar los diferentes pesos que necesitemos:

<link href='https://fonts.googleapis.com/css?family=Oswald:400,700,300|Lato|Lobster' rel='stylesheet'>

Esta es una buena solución a la múltiple carga de fuentes desde los servidores de Google, y todo en una sola petición.

Comentar

avatar
wpDiscuz