Cómo medir la velocidad de una página web – Guía profesional

¿Tu web carga lentamente y te preocupa perder visitantes valiosos? Aprende a cómo medir la velocidad de una página web y descubre cómo mejorar su rendimiento en este artículo. Te enseñaremos a evaluar los factores que influyen en la velocidad de tu sitio y a utilizar herramientas gratuitas para analizar el rendimiento de tus páginas web.

Como dato obvio, sigue las palabras fuertes si quieres un resumen de todo el artículo.

1. Importancia de realizar un test de velocidad de mi página web.

Básicamente, saber que es la velocidad web y como medir el tiempo de carga de una web es importante porque nos ayuda a identificar los problemas que ralentizan el tiempo de carga de una página web, y así poder encontrar las soluciones pertinentes.

Si queremos alcanzar los objetivos que nos propongamos con nuestro sitio web esta es una tarea que no podemos dejar de lado, y estos son algunos de los aspectos más importantes relacionados al tiempo de carga de nuestras páginas web:

• Mejora la experiencia del usuario: Si tenemos presente lo que dio a conocer el propio Google (si una web demora más de 3 segundos en cargarse, más del 50% de los visitantes abandonan la búsqueda por otra alternativa), es porque sabe con información cierta que la velocidad de carga de una página web es un factor que puede mejorar la experiencia del usuario, mantenerlos más tiempo en línea, y como resultado también gana Google. Por ende, nosotros también debemos tener consideración en dicho aspecto.
• Mejorar la tasa de conversión: Una buena experiencia del usuario puede incrementar la tasa de conversión (ésta métrica mide la efectividad de una página web para convertir a los visitantes en clientes o en usuarios que realizan una acción específica).
• Mejorar el posicionamiento en Google: Si tenemos en cuenta los dos puntos anteriores, es normal deducir que también mejorara el posicionamiento orgánico en las páginas de resultados de Google. Además, la velocidad de carga de un sitio web es un factor importante en el algoritmo de búsqueda de Google.

¿Entonces con un óptimo resultado en mi test de velocidad en Google de mi web, tengo un buena posición orgánica SEO?

Como dijimos, la velocidad web es un factor importante para el posicionamiento orgánico, pero no lo es todo, también existen muchos otros factores de relevancia; como el contenido web, uso correcto de palabras claves o los backling. Tal como explicamos mas detalladamente en el siguiente post sobre como posicionar una página web en Google.

2. Las 4 mejores herramientas como medidor de velocidad web, y como usarlas.

Las 4 mejores herramientas para evaluar la velocidad de tu web son; «GTmetrix», «PageSpeed Insights», «Pingdom Website Speed Test» y «WebPageTest». Para que puedas aprovechar las ventajas que nos brindan individualmente y llegar a mejores conclusiones en tu análisis.

Lo recomendable es usar cada una de ellas y aprovechar las ventajas que nos brindan individualmente. Pero al final debes prestarle más atención a la herramienta de Google (PageSpeed), si bien no es la que nos brinda los mejores resultados, es la del sitio oficial del buscador donde deseamos posicionar nuestras páginas web, motivo más que suficiente para optimizar su rendimiento aquí.

2.1. PageSpeed Insights, como usar:

Es la herramienta oficial y gratuita de Google, que nos permite medir el rendimiento de una página web en términos de velocidad de carga y experiencia de usuario, tanto en dispositivos móviles y de escritorio. Para usar esta aplicación y realizar un speed test de página web sigue estos pasos:

1. Ingresa a la página de PageSpeed Insights.
2. Escribe la URL de la página web que deseas analizar en el campo correspondiente y haz clic en el botón «Analizar».
3. Espera unos segundos mientras la herramienta analiza la página.
4. Obtén los resultados y utiliza las recomendaciones para implementar mejoras en la página y, si es necesario, vuelve a realizar el análisis para verificar el progreso.

Como usar PageSpeed Insights de Google (imagen):

Primera vista de resultados de Google pagespeed en imagen:

Importante prestar atención a los principales factores que mas influyen en la rapidez con la cual se cargan nuestras páginas web, como explicamos más abajo.

2.2. GTmetrix, como usar:

Esta herramienta cuenta con una versión gratuita y una de pago. Utiliza una combinación de pruebas de velocidad de PageSpeed de Google y de Yahoo! (YSlow) para generar un informe detallado sobre el rendimiento del sitio web e identificar áreas problemáticas en un sitio web y tomar medidas para mejorar la velocidad y la experiencia del usuario.

Para realizar un test de velocidad de páginas web con esta aplicación sigue los siguientes pasos:

1. Ingresa a la página de GTmetrix.
2. Ingresa la URL de la página web que deseas analizar.
3. Selecciona la ubicación desde donde deseas realizar el análisis y configura la opciones avanzadas segun tus nesesidades (opcion disponibe si estas registrado).
4. Haz clic en «Test your site».
5. Espera a que finalice el análisis y obtendrás un informe detallado con recomendaciones para mejorar la velocidad de tu sitio web.

Regístrate a GTmetrix y obtén más opciones avanzadas de análisis web

Simplemente te diriges a «Login», introduces un correo electrónico y contraseña y listo, podrás aprovechar de las opciones avanzadas.

Como medir velocidad de carga web con GTmetrix, vista en imagen:

Configuración de opciones avanzadas de Gtmetrix una vez suscripto:

• Círculo azul: Elegir la ubicación del servidor de prueba
• Círculo verde: Elegir el navegador de prueba (Chrome o Firefox)
• Círculo negro: Seleccionar el tipo de conexión (cable, 3G, 4G, etc.)

Resultados que nos arroja al analizar la velocidad web con GTmetrix en imagen:

Importante prestar atención a los principales factores que mas influyen en la rapidez con la cual se cargan nuestras páginas web, como explicamos más abajo.

2.3. Pingdom Website Speed Test, como usar:

También cuenta con una versión gratuita y una de pago. Esta herramienta mide la velocidad de carga de una página web desde diferentes ubicaciones geográficas, lo que permite a los usuarios identificar cualquier problema de velocidad que puedan estar experimentando en diferentes partes del mundo.

Al igual que otras herramientas, también proporciona información detallada sobre el tamaño de los archivos, las solicitudes HTTP y el tiempo de carga de cada recurso en la página, lo que ayuda a los usuarios a identificar las áreas de mejora para optimizar la velocidad del sitio web.

Para realizar y probar la velocidad web con esta aplicación sigue estos pasos:

1. Ingresa a la página de Pingdom Website Speed Test
2. Ingresa la URL de la página web que deseas analizar en el campo de texto.
3. Selecciona la ubicación desde donde deseas hacer la prueba. Puedes elegir entre varios servidores ubicados en diferentes partes del mundo (Cirulo rojo imagen inferior).
4. Haz clic en el botón «Start Test» para iniciar la prueba.
5. Espera a que la prueba finalice, analiza los resultados y sigue las recomendaciones de Pingdom para optimizar la velocidad de tu página web.

Como analizar el tiempo de carga de una página web con Pingdom Website Speed Test (vista desde imagen):

Primera vista y métricas que nos arroja esta herramienta de testeo de velocidad web:

Importante prestar atención a los principales factores que mas influyen en la rapidez con la cual se cargan nuestras páginas web, como explicamos más abajo.

2.4. WebPageTest, como usar:

También cuenta con una versión gratuita y una de pago llamada WebPageTest Private Instances. Con su análisis de velocidad web, podremos evaluar y medir el tiempo de carga y el rendimiento de una página web en diferentes navegadores y dispositivos. Además, ofrece una gran cantidad de información y datos detallados sobre el rendimiento de la página, como el tiempo de carga inicial, el tiempo de carga completo, el tiempo de respuesta del servidor, el tamaño de la página y más.

Para saber como usar esta aplicación y verificar la velocidad de una página web sigue estos pasos:

1. Abre el sitio web de WebPageTest, y luego deberás crear una cuenta en dicha aplicación para su uso gratuito.
2. Ingresa la URL del sitio web que deseas analizar en el cuadro de texto en la página principal.
3. Selecciona la ubicación de prueba desde el menú desplegable ubicado en la esquina superior derecha de la página.
4. Haz clic en el botón «Start Test» para iniciar la prueba.
5. Espera a que se complete la prueba y revisa los resultados en la página de resultados que se muestra.

Cómo suscribirse a WebPageTest para poder medir la velocidad de carga de una página web:

1. Introducimos la URL para realizar el análisis de velocidad web y hacemos clic en «Start test».
2. Nos dirigiremos a una página donde nos pedirá suscribirnos para su uso, hacemos clic en «login».
3. Ahora seleccionamos el plan gratuito, y rellenamos los datos que nos solicita como nombre, gmail y contraseña.
4. Listo, ahora podremos aprovechar del uso de esta aplicación y sus opciones avanzadas para nuestros test de velocidad web.

Primera vista de resultados del test de tiempo de carga de WebPageTest en imagen:

Importante prestar atención a los principales factores que mas influyen en la rapidez con la cual se cargan nuestras páginas web, como explicamos mas abajo.

3. Principales métricas a tener en cuenta como resultados del test de velocidad web.

Para saber como medir la velocidad web correctamente y encontrar las mejores soluciones, estas son las principales métricas a prestar atención, con un agregado en porcentaje que mide el grado de importancia en el resultado final:

• Loading performance o Rendimiento de carga (45%)
  • 1 First Contentful Paint (10%)
  • 2 Speed Index (10%)
  • 3 Largest Contentful Paint (25%)
• Interactivity o interactividad (40%)
  • 4 Time to Interactive (10%)
  • 5 Total Blocking Time (30%)
• Visual Stability o Estabilidad Visual(15%)
  • 6 Cumulative Layout Shift (15%)

3.1. First Contentful Paint (FCP – 10%):

También conocido como Primera Pintura Con Contenido, es una métrica de rendimiento web que mide el tiempo que tarda en cargarse el primer elemento visible en la página web, como puede ser un texto, una imagen o un video.

Se considera que la carga se ha completado cuando se pinta el primer píxel del contenido en la pantalla del usuario. Esta métrica FCP es importante porque es un indicador de la velocidad percibida por el usuario, ya que proporciona una respuesta visual temprana de rapidez de la página web.

Según GTmetrix (puede ser diferente para las demás herramientas pero nos sirve de guía), estos son los parámetros para decidir si ésta métrica es aceptable o no:

• Bien, no hay nada que hacer aquí = tiempo FCP de 934 milisegundos o menos.
• Está bien, pero considere mejorar = tiempo FCP entre 934 y 1205 milisegundos.
• Más de lo recomendado = tiempo FCP entre 1205 y 1600 milisegundos.
• Mucho más tiempo de lo recomendado = tiempo de FCP superior a 1600 milisegundos

3.2. Speed Index (SI – 10%):

En español conocido como Índice de Velocidad, es una métrica de rendimiento que mide la rapidez con la que se completa visualmente la mitad superior de la página.

Es un cálculo que refleja la experiencia del visitante utilizando un análisis cuadro por cuadro del comportamiento de carga de la página y está muy ligado a otros tiempos de carga de la página, lo que lo convierte en un punto de referencia útil para evaluar el rendimiento de su sitio web en su totalidad.

Piense en Speed ​​Index como una métrica unificada que representa muchas de las otras métricas y auditorías.

La métrica no mide el tiempo real de carga, sino que se calcula utilizando las diferencias visuales entre los fotogramas capturados durante la carga de la página y representa una forma práctica de determinar si las optimizaciones de velocidad de su página están funcionando.

Según GTmetrix (puede ser diferente para las demás herramientas pero nos sirve de guía), estos son los parámetros para decidir si ésta métrica es aceptable o no:

• Bien, no hay nada que hacer aquí = SI de 1311 milisegundos o menos.
• Está bien, pero considere la mejora = SI entre 1311 y 1711 milisegundos.
• Mayor de lo recomendado = SI entre 1711 y 2300 milisegundos.
• Mucho más largo de lo recomendado = SI superior a 2300 milisegundos.

3.3. Largest Contentful Paint (LCP- 25%):

Con un 25% en grado de importancia para dicho test, el LPC o Pintura Con Contenido Más Grande, es una métrica de rendimiento web que mide el tiempo que tarda en cargarse el elemento de contenido más grande o significativo de una página web. Este elemento puede ser una imagen, un video, un bloque de texto, etc.

LCP se considera una medida importante de la experiencia del usuario, ya que indica cuánto tiempo tarda en aparecer el contenido relevante para el usuario en la pantalla.

Según GTmetrix (puede ser diferente para las demás herramientas pero nos sirve de guía), estos son los parámetros para decidir si ésta métrica es aceptable o no:

• Bien, no hay nada que hacer aquí = LCP de 1200 milisegundos o menos.
• Está bien, pero considere la mejora = LCP entre 1200 y 1666 milisegundos.
• Más de lo recomendado = LCP entre 1666 y 2400 milisegundos.
• Mucho más tiempo de lo recomendado = LCP superior a 2400 milisegundos.

3.4. Time to Interactive (TTI – 10%):

El TTI o Tiempo para Interactivo, es una métrica de rendimiento web que mide el tiempo que tarda una página web en volverse interactiva para el usuario. Se refiere al tiempo que transcurre desde que se hace clic en un enlace o se introduce una URL hasta que la página web está completamente cargada y el usuario puede interactuar con ella.

El TTI se considera una métrica crítica, ya que indica cuándo los usuarios pueden comenzar a interactuar con la página y realizar acciones en ella, como hacer clic en botones o escribir en campos de formulario.

Según GTmetrix (puede ser diferente para las demás herramientas pero nos sirve de guía), estos son los parámetros para decidir si ésta métrica es aceptable o no:

• Bien, no hay nada que hacer aquí = TTI de 2468 milisegundos o menos.
• Ok, pero considere la mejora = TTI entre 2468 y 3280 milisegundos.
• Más largo de lo recomendado = TTI entre 3280 y 4500 milisegundos.
• Mucho más tiempo de lo recomendado = TTI superior a 4500 milisegundos.

3.5. Total Blocking Time (TBT – 30%):

El TBT o tiempo total de bloqueo, es una métrica de Lighthouse Performance que mide la cantidad total de tiempo que una página web estuvo bloqueada e impidió que el usuario interactuara con ella, y con un 30% de importancia es la métrica de mayor magnitud para este test de carga de página web.

Se trata de una de las Web Vitals y es un reemplazo de la métrica First Input Delay (FID), el TBT mide el tiempo total entre First Contentful Paint (FCP) y Time to Interactive donde el hilo principal (el hilo principal se refiere al proceso de carga y renderizado de una página web en el navegador) estuvo bloqueado durante el tiempo suficiente para evitar la capacidad de respuesta de entrada.

Cuando cualquiera de las tareas del hilo principal, o sea, cuando cualquier tarea en el proceso de carga y renderizado de una página web realizado por el navegador como la descarga de recursos o la ejecución de scripts, DURA MÁS DE 50ms, el subproceso principal se considera «bloqueado» porque el navegador no puede interrumpir una tarea en curso.

El TBT se calcula con la suma de todos estos tiempos de bloqueo de las tareas del hilo principal por encima de los 50 ms, siendo dicha suma el tiempo total de bloqueo de la página.

En el ejemplo anterior de la imagen, cada barra representa un proceso de carga y renderizado de recursos diferentes por parte del navegador, la parte clara de la línea representa una duración de 50ms durante dicho proceso, mientras que la parte oscura representa el tiempo que pasa el proceso del hilo principal por encima de esos de 50ms.

• Parte clara de la línea = 50ms
• Parte oscura de la línea = tiempo que supera esos 50ms
• Calculo del TMT = 345ms

Según GTmetrix (puede ser diferente para las demás herramientas pero nos sirve de guía), estos son los parámetros para decidir si ésta métrica es aceptable o no:

• Bien, no hay nada que hacer aquí = TBT de 150 milisegundos o menos.
• Está bien, pero considere mejorar = TBT entre 150 y 224 milisegundos.
• Más de lo recomendado = TBT entre 224 y 350 milisegundos.
• Mucho más tiempo de lo recomendado = TBT superior a 350 milisegundos.

3.6. Cumulative Layout Shift (CLS – 15%):

El CLS o Cambio de Diseño Acumulativo mide el cambio inesperado de elementos web mientras se procesa la página, en otras palabras, mide cuánto cambia la disposición visual de una página mientras se carga.

Luego, esta medida se cuantifica como una puntuación agregada de todos los cambios de diseño individuales en su página, lo que puede resultar en una mala experiencia del usuario si los elementos de la página se mueven de forma inesperada.

Es importante tener en cuenta la diferencia entre los cambios de diseño esperados e inesperados.

• Se produce un cambio de diseño esperado en respuesta a una acción del usuario en la web, por ejemplo, al hacer clic en el icono de búsqueda para expandir un campo de entrada.
• Un cambio de diseño inesperado , por otro lado, generalmente se desencadena por contenido de terceros, imágenes sin dimensiones u otro contenido dinámico. Por ejemplo, un anuncio que aparece de repente y empuja una imagen o contenido hacia abajo en la página.

Según GTmetrix (puede ser diferente para las demás herramientas pero nos sirve de guía), estos son los parámetros para decidir si ésta métrica es aceptable o no:

• Bueno, no hay nada que hacer aquí = CLS de 0,1 o menos.
• Está bien, pero considere la mejora = CLS entre 0,1 y 0,15.
• Más largo de lo recomendado = CLS entre 0,15 y 0,25.
• Mucho más tiempo de lo recomendado = CLS de 0,25 o superior.

4. Cómo optimizar el tiempo de carga en mi test de velocidad del sitio web en Google.

Un sitio web de carga rápida puede mejorar la experiencia del usuario, aumentar la retención de visitantes y mejorar las conversiones. Por lo tanto es un factor importante en el ranking de Google, puede mejorar el SEO y atraer más tráfico orgánico.

Aquí dejamos alguno consejos de optimización de cada uno de los 6 puntos nombrados anteriormente, teniendo en cuenta que también pueden ser afectados por otros factores que no nombramos aquí:

«Es probable que algunas de las tareas que mencionemos se repitan en más de un punto, esto es porque optimizando dicha tarea se optimiza el resultado de más de una de las métricas principales»

4.1. Cómo mejorar First Contentful Paint de mi medidor de velocidad páginas web:

Como ya dijimos, el FCP representa un 10% del valor total del test, y estas son algunas de las tareas para su optimización:

4.1.1. Reducir el tiempo de respuesta del servidor:

Reducir el tiempo de respuesta del servidor ayuda a ofrecer un tiempo de FCP rápido en su página. Algunas de las cosas que puede hacer aquí incluyen:

• Reducción del tiempo de respuesta inicial del servidor
• Uso de una red de entrega de contenido (CDN)
• Sirviendo activos estáticos con una política de caché eficiente
• Evitar redireccionamientos de varias páginas
• Establecer conexiones tempranas con orígenes de terceros importantes

4.1.2. Eliminar los recursos que bloquean el renderizado:

Seguro ya viste este mensaje si ya realizaste un test de velocidad web anteriormente, se refiere a identificar y corregir elementos de la página web que impiden que se muestre el contenido principal rápidamente.

Los recursos o elementos que bloquean el renderizado pueden incluir scripts, hojas de estilo, imágenes o elementos de la interfaz de usuario que retrasan el tiempo de carga del sitio.

Al eliminar estos recursos, se mejora la experiencia del usuario al garantizar que el contenido se muestre lo más rápido posible y se reducen las posibilidades de que los visitantes abandonen el sitio debido a una carga lenta.

4.1.3. Minimizar el número de solicitudes y el tamaño de la carga útil:

El número de solicitudes se refiere a la cantidad de recursos que una página web solicita al servidor para poder ser cargada en el navegador. Estos recursos pueden incluir archivos HTML, imágenes, archivos de estilo CSS, scripts de JavaScript, fuentes, entre otros.

Reducir tanto el número de solicitudes como el tamaño de la carga útil de una página web es importante para mejorar la velocidad de carga de la página y proporcionar una mejor experiencia al usuario.

4.2. Cómo mejorar Speed Index:

En este caso, con la mayoría de las mejoras de rendimiento que dan como resultado una First Contentful Paint (FCP) y Largest Contentful Paint (LCP), probablemente también resulten en un Índice de velocidad (SI) más rápido para su página

Algunas de las optimizaciones aquí incluyen:

• Reducir el tiempo de ejecución de JavaScript
• Minimizar el trabajo del subproceso principal
• Eliminar JavaScript no utilizado
• Reducir el impacto del código de terceros
• Reemplazar grandes bibliotecas de JavaScript con alternativas más pequeñas

4.3. Cómo mejorar Largest Contentful Paint Index:

Algunas de las prácticas que podemos realizar en este sentido son:

• Reducir el tiempo de respuesta del servidor: Igual como nombramos en el punto 4.1.1.
• Eliminar los recursos que bloquean el renderizado: Igual como nombramos en el punto 4.1.2.
• Optimización de imágenes y videos: esto podemos hacer para su optimización
  • Tamaño adecuado de las imágenes
  • Codificación eficiente de imágenes
  • Combinar imágenes usando sprites CSS
  • Entregar imágenes en formatos de próxima generación
  • Uso de formatos de video para contenido animado

4.4. Cómo mejorar Time to Interactive:

Algunas de las prácticas a realizar para mejorar los resultado al examinar la velocidad web incluyen:

4.4.1. Optimización de la ejecución de JavaScript:

Optimizar la ejecución de JavaScript ayuda a reducir el tiempo de bloqueo del subproceso principal y asegura que nuestra página responda rápidamente a las entradas de los usuarios. Algunas de las tareas que podemos realizar incluyen:

• Reducir el tiempo de ejecución de JavaScript
• Minimizar el trabajo del hilo principal
• Eliminar JavaScript no utilizado
• Eeducir el impacto del código de terceros
• Reemplazar grandes bibliotecas de JavaScript con alternativas más pequeñas

4.4.2. Mantener el número de solicitudes lo más bajo posible – tal como explicamos en el punto 4.1.3.

Al minimizar la cantidad de solicitudes que realiza tu sitio web, se reduce la cantidad de trabajo que debe hacer el navegador para cargar la página, lo que puede ayudar a acelerar el proceso de renderizado y permitir que los usuarios interactúen con la página más rápidamente.

4.4.3. Usar sugerencias de recursos para establecer conexiones tempranas:

Estas son algunas de las estrategias que puedes utilizar para usar sugerencias de recursos y establecer conexiones tempranas con servidores de terceros y mejorar el rendimiento de tu sitio web:

• Identifica los recursos de terceros que tu sitio web utiliza, como fuentes externas, archivos JavaScript, hojas de estilo, imágenes, etc.
• Asegúrate de que los recursos de terceros se carguen de manera asíncrona para evitar retrasos en la carga de la página.
• Utiliza la función de DNS prefetching de tu servidor web para establecer conexiones tempranas con los servidores de terceros. Esto permite al navegador del usuario resolver las direcciones IP antes de que se soliciten los recursos.
• Habilita la compresión de recursos para reducir el tamaño de los archivos antes de que se envíen al navegador del usuario.
• Utiliza un servicio de CDN (Content Delivery Network) para alojar los recursos de terceros en servidores cercanos a la ubicación del usuario, lo que reduce la latencia y mejora el tiempo de carga de la página.

4.5. Cómo mejorar Total Blocking Time:

El tiempo total de bloqueo está altamente correlacionado con el rendimiento de JavaScript, y es probable que cualquier mejora en la ejecución de JavaScript (en general, las optimizaciones que mejoran el TTI ) reduzca su TBT.

Estas son algunas de nuestras recomendaciones para mejorar el TTI, teniendo en cuenta que también pueden mejorar el resultado de otras métricas:

• Reducir el tiempo de ejecución de JavaScript
• Estas Minimizar el trabajo del subproceso principal
• Eliminar JavaScript no utilizado
• Reducir el impacto del código de terceros
• Reemplazar grandes bibliotecas de JavaScript con alternativas más pequeñas

4.6. Cómo mejorar Cumulative Layout Shift Time:

Estas son algunas de nuestras recomendaciones para mejorar el CLS:

4.6.1. Especificación de las dimensiones de la imagen:

Siempre especifique tanto el ancho como la altura de los elementos de imagen y video de su sitio web para que se use el espacio correcto para las imágenes/videos. Otra alternativamente, puede ser usar cuadros de relación de aspecto CSS para hacer lo mismo.

4.6.2. Reducir los cambios de diseño causados ​​por anuncios, incrustaciones e iframes:

Estas técnicas ayudarán a minimizar los cambios de diseño causados por anuncios, incrustaciones e iframes y mejorar el valor de CLS al medir la carga web.

• Asignar dimensiones para los elementos en los que se colocarán anuncios o iframes.
• Colocar anuncios y iframes fuera del flujo normal del contenido de la página.
• Asegurarse de que los anuncios y iframes estén completamente cargados antes de permitir la interacción del usuario.
• Utilizar el atributo «loading» de HTML para retrasar la carga de los anuncios y iframes fuera del campo de visión del usuario.
• Evitar colocar anuncios y iframes en lugares que puedan interferir con la navegación del usuario o la visualización del contenido.

4.6.3. Prevención del destello de texto invisible (FOIT):

El problema de Flash of Invisible Text (FOIT) también puede afectar el CLS de su página. Asegúrese de que su texto permanezca visible durante las cargas de fuentes web precargando fuentes web y/o usando el atributo «font-display».

El font-display atributo determina cómo se muestra la fuente durante la carga de la página, en función de si se ha descargado y está lista para usar. Para la mayoría de los navegadores modernos, el uso «font-display: swap» resuelve el problema de FOIT.

En caso de estar usando fuentes web de Google en su página, puede agregar «font-display» funcionalidad agregando el «&display=swap» parámetro al final de la URL de su fuente web en su CSS.