Problemas con Tipografía - Cómo corregir (Ejemplo 2).mp4

👆👆👆👆👆👆👆👆👆

💾 DESCARGA ESTE VIDEO PARA TU USO PERSONAL AQUÍ

¿Qué puedes hacer con este video? Almacenarlo como material de consulta futura exclusivamente para tu uso personal.

¿Qué NO puedes hacer?Publicarlo en ningún medio, formato ni plataforma, comercializarlo, distribuirlo ni alterarlo en forma alguna.

Cuando te aparezca esta oportunidad en Lighthouse "Elimina los recursos que bloqueen el renderizado", la solución debes dividirla, porque no existe una única solución. Analiza todos los recursos que están bloqueando el renderizado.

Si entre ellos ves que hay recursos que provengan de fonts.google.com, quiere decir que tu plantilla está cargando fuentes externas desde el proyecto Google Fonts. Esto genera un retardo en la carga de la página.

Sucede porque mientras se carga la página, el navegador debe recurrir a un sitio web externo, generando peticiones hacia  afuera, que no dejan fluir rápidamente la carga de la página.

Existen tres formas de solucionarlo:

• Modificando la plantilla: muchas plantillas tienen la opción llamada "Cargar fuentes de Google localmente". Por ejemplo Kadence o Astra lo traen en su versión gratuita. Otras, como Neve lo traen pero en su versión pagada. Y otras, simplemente no lo traen. Cuando decidas una plantilla, esto puede ser una opción a verificar y si lo trae, te garantizará mejorar la velocidad. Este es mi método preferido.

• Manualmente: puedes usar fuentes del sistema en tu plantilla, y con ello no recargarás con fuentes tu sitio web. Esto implica cambiarlas de forma manual, bien desde la definición general de fuentes de la plantilla (si así tu plantilla lo permite), bien desde los bloques si en ellos tienes elementos con definición de fuente particular. Esto tendrá implicación en el aspecto gráfico del sitio.

• Con plugin: si tu plantilla no permite cargar las fuentes de Google localmente, debes recurrir a un plugin. Uno que funciona muy bien es OMGF.