Gestiona la configuración de visualización de fuentes para que carguen más rápido

Un aspecto del rendimiento web que suele pasarse por alto son las fuentes, que, como cualquier recurso personalizado, tardan un poco en cargar al abrir el sitio. Aunque las fuentes alternativas ayudan mostrando texto mientras se descargan las personalizadas, algunos navegadores ocultan el contenido hasta que la fuente está lista, provocando un parpadeo de texto invisible.

Además de verse mal, esto también es una señal de alerta para la accesibilidad, ya que no hay texto que leer. Afortunadamente, existe una propiedad “font-display” con un atributo “swap” que le dice al navegador que muestre inmediatamente el contenido en cuestión usando una fuente del sistema precargada.

Para facilitarte el uso de la propiedad font-display en Webflow, hemos añadido los ajustes de visualización de fuentes directamente en la configuración de tus fuentes personalizadas*. Para habilitar “font-display: swap” en tus fuentes, simplemente selecciona la opción “swap” para cada fuente que estés usando. (Obtén más información sobre las otras opciones de visualización de fuentes en la documentación de Mozilla.)

*Ten en cuenta que los controles de visualización de fuentes solo están disponibles con fuentes personalizadas, no con fuentes de Google o Adobe. Para habilitar los ajustes de visualización de fuentes para esas fuentes, deberás descargarlas y añadirlas a tu sitio como una fuente personalizada.