El método CLS se utiliza para medir el grado en que el contenido de la página web cambia o se mueve durante todo el ciclo de vida del ciclo de representación de la página o, en otras palabras, para medir qué tan estable es la apariencia visual del sitio web.
Probablemente muchas veces en tu vida hayas sido testigo de primera mano de lo frustrante que es poder hacer clic en un elemento de un menú y accidentalmente hacer clic en un anuncio, que luego te lleva a un sitio web de terceros. y lo frustrante que es cuando el contenido de la página web cambia en medio de una interacción. Por supuesto, los cambios de diseño también molestan a los usuarios. Sin embargo, también son capaces de causar problemas más importantes a los editores web, incluidas altas tasas de rebote y violaciones de sus políticas publicitarias debido a clics accidentales debido a cambios de diseño.
Además, dado que Google considera que CLS es uno de los tres " Core Web Vitals ", una puntuación baja de CLS puede afectar negativamente la puntuación general de Core Web Vitals, lo que hace que el usuario reciba una calificación reprobatoria. Como parte de los cambios recientes en el algoritmo de búsqueda de Google, los sitios que reciben una puntuación aprobatoria en la evaluación principal de Web Vitals se clasifican más favorablemente en los resultados de búsqueda.
Existe una correlación directa entre mejorar la puntuación CLS, mejorar la experiencia general del usuario, mejorar potencialmente la clasificación de Google y aumentar el tráfico orgánico de Google.
¿Cómo se mide el cambio de diseño acumulativo?
Cuando un elemento visible en la ventana gráfica cambia su posición inicial por cualquier motivo, ese cambio se registrará. Por lo tanto, se consideraría inestable si cambiara su posición inicial. Es importante tener en cuenta que solo es posible crear un cambio de diseño si un elemento visible se mueve a un lugar diferente en la página debido a que algo sucede en esa página, y no si un elemento nuevo o un elemento existente crece o se reduce.
Una puntuación CLS consta de dos medidas específicas diseñadas para rastrear los cambios de diseño: fracciones de impacto y fracciones de distancia. Estas dos medidas se utilizan para determinar la puntuación CLS. La fracción de impacto mide cómo los elementos inestables afectan la ventana gráfica entre dos cuadros combinando el elemento original y el desplazamiento como una proporción que se puede comparar con el área visible total de la ventana gráfica entre los dos cuadros. En el caso de un elemento inestable que se mueve horizontal o verticalmente, la fracción de distancia representa la distancia que ese elemento se ha movido alrededor de la ventana gráfica (ya sea horizontal o verticalmente).
¿Cómo puedes mejorar tu puntuación CLS?
Para reducir elementos inestables/comportamiento cambiante, aquí hay algunas recomendaciones:
- Diferentes páginas web pueden recibir otras puntuaciones CLS según la estructura de su sitio. Por ejemplo, las puntuaciones CLS para las páginas de artículos pueden ser más altas que las de la página de inicio. Por lo tanto, el primer paso es medir las puntuaciones CLS de todas las plantillas de páginas principales de su sitio.
- Las imágenes y los vídeos siempre deben tener atributos de ancho y alto. Cree imágenes responsivas con relaciones de aspecto definidas.
- Alternativamente, se pueden usar cuadros de relación de aspecto CSS para reservar el espacio necesario para los elementos. Durante el proceso de carga, esto garantiza que el navegador asigne la cantidad adecuada de espacio en el documento.
- La publicación de anuncios puede contribuir significativamente al cambio de diseño si las ubicaciones no se optimizan adecuadamente.
- No inyecte contenido dinámico encima del contenido ya cargado, excepto en respuesta a interacciones del usuario, en cuyo caso el diseño cambiará.
¡Acelere el rendimiento de WordPress con nuestros servicios de optimización de sitios !
