El Cumulative Layout Shift (CLS) es una métrica de Google que mide los desplazamientos inesperados en el contenido de una web y los cambios en el diseño de esta. Esta es una métrica fundamental centrada en el usuario con el objetivo de medir la estabilidad visual proporcionada para este.
Índice
¿Cómo se mide?
El CLS se mide a través de puntuaciones dadas por Google. Cuanto más baja sea la puntuación, más estable es el diseño.
Las calificaciones oficiales dadas por Google pueden ser:
- Bueno: se produce cuando el CLS está por debajo de 0,1.
- Mejorable: este se obtiene cuando el CLS está entre 0,1 y 0,25.
- Necesita mejorar: esta valoración se da cuando el CLS está por encima de 0,25.
Lo más recomendable es que la puntuación esté por debajo de 0,1 proporcionando así una buena experiencia de usuario.
Existen gran cantidad de herramientas para medir el CLS de tu página web. A continuación, mostramos algunas de ellas:
- Google PageSpeed Insights (PSI)
- Google Search Console
- Google Lighthouse
- Web.dev
Cómo solucionar los problemas de CLS
Antes de solucionar los problemas debemos detectar qué elementos son los que hacen los cambios de tamaño y diseño para poder solucionarlos.
Las probables soluciones son:
- Impedir que Javascript cambie styles o clases de Css posteriormente.
- Comprobar que no haya encontronazos entre clases Css con parámetros.
- Inspeccionar que ningún plugin introduce código extra que cambie los estilos tanto si utilizamos WordPress, Joomla, Prestashop, etc.
- Fijar los estilos al principio en lugar de que se efectúen al final y modifiquen el diseño del componente.
¿Por qué és importante el CLS en un sitio web?
Habitualmente se originan varias micro-actualizaciones al día en el algoritmo de Google, el cual diagnostica el posicionamiento web en los motores de búsqueda.
En este caso esta nueva métrica incorporada por Google es muy importante para nuestra web si uno de nuestros objetivos es lograr un buen posicionamiento web, por lo que hay que estar alineado a las nuevas actualizaciones de Google si queremos estar bien posicionados en los buscadores.