5 consejos demostrados para reducir la latencia en páginas web que utilizan header bidding

El header bidding, o subasta de encabezados, representa una solución ideal para que los editores puedan aumentar al máximo sus ingresos publicitarios. En marzo de 2019, el 79,2 % de los principales editores utilizaron el header bidding como parte de su paquete tecnológico.

Sin embargo, algunos editores pueden sufrir una mayor latencia en sus páginas si el header bidding no se aplica de la forma adecuada. En este artículo hemos recopilado 5 consejos demostrados que ayudan a evitarla.

Continúa leyendo para descubrir cómo reducir la latencia en las páginas web asociada al header bidding.

¿En qué consiste la latencia de una página web?

Básicamente, la latencia de una página web es el tiempo total que tarda en cargarse dicha página web. Comienza cuando el usuario inicia la solicitud y finaliza cuando el contenido de la página ha terminado de cargarse.

Una latencia alta aumenta el tiempo de carga de la página, algo que afecta negativamente a la experiencia del usuario y al SEO. Además, la latencia puede provocar unos fill rates de anuncios más bajos, lo que también puede mermar los ingresos publicitarios de los editores.

¿Qué influye en la latencia?

El Header bidding es un procedimiento programático en el que varias fuentes de demanda (SSPs) pujan por el mismo inventario al mismo tiempo, aumentando por lo tanto la rentabilidad de los editores. Incorporar más partners de demanda aumenta la competencia, por lo que los editores pueden generar así más ingresos de publicidad.

Opinión de la experta de Setupad

Signe Kreicere, Ingeniera en Asistencia Técnica de SetupAd explica: «La latencia se da de forma natural cuando se utiliza el header bidding, puesto que cada postor necesita un tiempo para responder. Después, la solicitud se envía al mejor postor para que se puedan mostrar los anuncios en la página. En este caso, la latencia de la página web puede compensarse mediante una adecuada gestión de los límites de tiempo, es decir, aquellos socios que tardasen más en responder no podrían pujar después del límite. Sin embargo, si el límite de tiempo es demasiado corto, los editores podrían perderse buenas pujas. Resulta necesario realizar las pruebas correspondientes para tomar una decisión adecuada.»

La latencia que surge durante el procedimiento del header bidding no se puede hacer desaparecer por completo. Existen dos elementos principales que influyen en la misma:

– Añadir cualquier código extra en el encabezado aumenta el tiempo de ejecución, lo que aumenta, por tanto, la latencia.

– Hay dos tipos de servidores de header bidding: lado del cliente y lado del servidor. El lado del cliente funciona en el navegador del usuario y las solicitudes a los demand partners también se envían desde el navegador. Esto puede afectar a la velocidad de carga de la página.
En el lado del servidor, el procedimiento del header bidding se traslada del navegador a un servidor de anuncios, lo cual resuelve el problema de la latencia. No obstante, puesto que el lado del servidor no cuenta con coincidencia de cookies, los editores obtienen menos ingresos salvo que se tratase de una solución híbrida.

Setupad aplica una solución de header bidding híbrida que combina las pujas más altas del lado del cliente con las pujas más altas del lado del servidor. De esa forma, los editores obtienen los máximos ingresos sin renunciar a la velocidad.

Asimismo, Setupad emplea una solución basada en etiquetas sin alterar el código fuente de los editores. Esa solución reduce espectacularmente el número de solicitudes de anuncios y consume menos recursos del navegador, lo cual también contribuye a minimizar el problema de la latencia.

¿Cómo se puede analizar la latencia de la página web?

No existe una sola manera correcta de analizar la latencia de la página web. Esto se debe a que las etiquetas externas (como las etiquetas de los anuncios) y los archivos no suelen cargarse de forma asíncrona, para así minimizar el impacto sobre la renderización de la página. Con respecto al header bidding, prebid.js también envía pujas de forma asíncrona para evitar que afecten a la carga del contenido de la página.

Por tanto, la forma más adecuada de medir la latencia del header bidding consiste en analizar cuánto tarda cada anuncio en cargar. Para este paso, puedes utilizar la Consola de Herramientas para Desarrolladores del navegador. En Google Chrome, se trata de la consola Chrome DevTools (véase ejemplo a continuación).

Estos son los pasos que hay que seguir:

– Pulsa Opción + ⌘ + J (en macOS), o Mayús. + CTRL + J (en Windows) para abrir Chrome DevTools

– Accede al panel «Network»

– Escribe «ads?» en la ventana «Filter». En ese momento todos los anuncios de tu página se mostrarán de inmediato en la «Requests Table».

– En el menú «Response», verás un nombre de etiqueta para cada solicitud de anuncio, de forma que resulta posible analizar cada anuncio individualmente.

– En el menú «Timing» se puede ver cuándo comenzó la solicitud y cuánto tardó en resolverse.

– «Waiting» (TTFB) representa la cantidad de tiempo que tardó en cargar el anuncio en sí.

Eso no significa que las herramienta de aceleración de páginas no sirvan de nada. Las distintas herramientas de aceleración de páginas ofrecen distinta información y te ayudan a entender por qué pesa tu página.

Nuestros expertos sugieren utilizar Pingdom porque también te muestra qué medidas deberías adoptar para optimizar el rendimiento de tu página.

5 consejos para reducir la latencia

1. Usa carga asíncrona

La mayoría de los postores no pueden cargar su biblioteca de Javascript de manera asíncrona. Lo cual provoca tiempos de ejecución más elevados y que los usuarios tengan que esperar ante una página vacía antes de que el contenido se cargue.

Sin embargo, los contenedores de header bidding (wrappers) han resuelto este problema. Los wrappers pueden funcionar con carga asíncrona, mediante la cual todas las ofertas de puja se envían a los partners de demanda simultáneamente cuando se solicita la página.

En caso de un código síncrono, se lanza una etiqueta una vez que el postor anterior ha respondido, de forma que los postores se «bloquean» mutuamente.

Las etiquetas de Setupad se cargan de manera asíncrona sin que la funcionalidad de tu página se vea afectada y no se interrumpa ni ralentice la carga de la misma.

2. Implementar carga diferida (lazy load) para los anuncios

El lazy load supone una buena solución para reducir la latencia de cualquier página. Se puede aplicar en varios elementos de la página, como imágenes, anuncios y iframes. El concepto es sencillo: la solicitud de anuncio se activa justo cuando es más probable que un usuario lo vea.

Puesto que no todos los anuncios se ofertan durante la carga inicial de la página, el navegador utiliza menos recursos, aumentando así la velocidad de la página. Esto garantiza una mejor experiencia de usuario.

Por supuesto, el porcentaje de visualización de los anuncios mejora, ya que los editores obtienen menos impresiones no vistas.

Un porcentaje de visualización más alto mejora los ingresos por anuncio de los editores, puesto que el valor del inventario de anuncios aumenta.

3. Herramienta de latencia para páginas web

La extensión HeaderBid Expert de Chrome te permite ver la latencia de cada partner de demanda (tiempo de respuesta de la puja). Lo cual puede resultar útil para ver si hay partners que provoquen retrasos en los tiempos de la subasta. También puede informarte de si los socios cargan de manera asíncrona o si bloquean las ofertas. Una vez obtienes esa información, puedes decidir si añadir o eliminar partners de demanda.

Otra herramienta que resulta muy útil es la extensión para Chrome de Setupad, diseñada expresamente para nuestros clientes. Les ofrece información de datos a tiempo real, información sobre los SSPs ganadores, impresiones, ingresos, el click-through-rate (CTR) y mucho más.

4. Reduce las solicitudes de HTTP

Aproximadamente el 80 % del tiempo de carga de la página se va en solicitudes de HTTP. Cada elemento de la página, como imágenes, la hoja de estilo y el script, activan una solicitud de anuncio. Por tanto, cuantos más elementos haya, más tiempo tarda la página en cargar. Plantéate eliminar cualquier imagen, herramienta o plug-in cuando sea posible. Además, puedes hacer lo siguiente:

– Comprime los tamaños de los archivos. Comprime imágenes, vídeos y cualquier otro archivo multimedia que tengas.

– Combina JS y CSS externos. Esto reduce el número de solicitudes de HTTP que realiza el navegador. Por ejemplo, si tu página cuenta con 10 archivos CSS externos y 10 archivos JS externos, combinar los archivos JS y CSS en un solo archivo reduciría las solicitudes totales en 18.

– Minifica CSS, JS y HTML. Este proceso elimina cualquier carácter innecesario de un determinado archivo, como espacios en blanco, saltos de línea, comentarios, etc. El resultado es una versión del archivo «más corta» cuya descarga necesita menos bytes.

– Activa el caché del navegador. Resulta necesario para que, cuando el usuario que visitó tu página anteriormente la vuelva a abrir, ya estén almacenadas en su lado todas las hojas de estilo, HTML y JS. Así, el número de solicitudes se reduce. Existen plug-ins de caché para los usuarios de WordPress tanto gratuitas como de pago; nosotros recomendamos utilizar o bien W3 Total Cache (gratuita) o WP Rocket (de pago).

– Reduce el número de scripts Esto resulta importante para aquellos editores cuyas páginas cuentan con herramientas externalizadas para comentarios, chatbots, integración de Twitter y otras herramientas de integración. Por ejemplo, si tienes una función de chatbot en todas las páginas, plantéate dejarla solamente en la página de inicio.

5. Pásate al protocolo HTTP/2

El objetivo principal del protocolo HTTP/2 consiste en mejorar el tiempo de carga de la página. Algo que consigue mediante la descarga asíncrona de archivos web desde un servidor web. Dicho llanamente, el HTTP/2 optimiza el flujo del contenido entre clientes y servidores. Con el HTTP/2, muchos clientes experimentan mejoras en la velocidad de carga y respuesta de la página, mientras que los administradores del sitio web experimentan una reducción del uso de recursos.

¿Cómo pasarse a HTTP/2?

Algunas empresas de hosting soportan HTTP/2, como Dreamhost y Bluehost. Si tu plan de hosting actual no ofrece compatibilidad con HTTP/2, plantéate mejorarlo o cambiar a otra empresa de hosting.

Ten en cuenta que si quieres implementar el Protocolo HTTP/2, necesitas una conexión HTTPs (es decir, segura). Además se considera una buena práctica en la web, así que hazte primero con una primero si no la tienes ya.

Conclusión

La mayoría de editores se resisten a utilizar el header bidding por miedo a que ralentice su página. Sin embargo, el listón del sector está muy alto hoy en día. Cuando colaboras con una plataforma de monetización como Setupad, todo un equipo de AdOps Managers se asegurarán de que tu velocidad de carga no se vea afectada.

Además, los editores obtendrán la mejor solución anti-malvertising, formatos de anuncios avanzados, monetización del tráfico, Adblock y un enfoque de optimización personalizado. ¡Comienza a colaborar con nosotros y aumenta tus ingresos de publicidad sin sacrificar velocidad de carga!