El Cumulative Layout Shift puede ocurrir durante la carga de los ads dentro del contenido del sitio.
Esto puede suceder con los banners inarticle y standard.
Los usuarios pueden notar que un ad comienza a cargar y desplaza el contenido de la página, un aspecto ahora considerado importante por Google para los Web Vitals y los resultados de búsqueda.
CSS Global de HBAgency para Anuncios:
- HBAgency ha definido un archivo CSS global para permitir integrar fácilmente los estilos de los ads con otros scripts en el header.
- Preferimos alojar el script en nuestra CDN para facilitar las actualizaciones, pero también puedes copiar los estilos en tu propio stylesheet.
Manejo del Cumulative Layout Shift (CLS) para Anuncios:
- Los ads suministrados ya tienen attributes que usamos para aplicar estilos a los div que contienen los ads.
- Para hacer que los ads sean conformes con CLS, debemos establecer una altura fija en el slot del ad mismo. Esto significa que si estás usando tamaños flexibles como 300x250 y 300x600, la altura del contenedor que contiene el ad será de 600px.
- Si se sirve un ad de 300x250 en este espacio, lo centraremos verticalmente.
Implementación del CSS para Anuncios:
- Para hacer que los ads sean conformes con CLS, inserta el siguiente CSS en el head de tu sitio:
html
<link rel="stylesheet" href="https://hbagency.it/cdn/stylehb.css"> - Si eres un publisher registrado desde hace tiempo y aún no tienes los div en la página con el attribute class correspondiente, obtén los div desde la plataforma o contacta a tu account manager.
Gestión de Preferencias del Publisher:
- Como publisher, puedes optar por no considerar los problemas de CLS simplemente eliminando el archivo CSS de tu sitio.
Asistencia y Soporte:
Si tienes más preguntas al respecto, contacta directamente a tu account manager.