Comprender como los visitantes interactuan con el contenido de video en tu sitio web proporciona informacion valiosa sobre el engagement. Esta guia cubre el seguimiento de la reproduccion en tres formatos de video comunes: elementos de video HTML5 nativos, reproductores de YouTube integrados y embeds de Vimeo.

Que se rastrea

Para cada formato de video, el objetivo es capturar cuatro metricas clave:

Si el visitante inicio la reproduccion
El porcentaje del video que fue visto
Si el visitante vio el video hasta el final
El tiempo promedio de reproduccion durante un periodo, tanto en segundos como en porcentaje

Rastreo de video HTML5 nativo

El elemento HTML5 <video> expone eventos nativos que hacen que el seguimiento sea sencillo. Escucha los eventos playing, pause y ended para calcular hasta donde avanzo el espectador en el video. Cuando el visitante abandona la pagina (en el evento beforeunload), envia un evento de analytics personalizado que contenga el porcentaje de progreso junto con indicadores de si la reproduccion comenzo y si se completo.

Rastreo de embeds de YouTube

YouTube proporciona una API de IFrame que dispara callbacks onStateChange. Los estados relevantes son PLAYING, PAUSED y ENDED. Para calcular el progreso, divide la posicion de reproduccion actual (getCurrentTime()) entre la duracion total (getDuration()). Envia las metricas resultantes como un evento personalizado cuando el usuario navega fuera de la pagina o cuando el video termina.

Rastreo de embeds de Vimeo

El SDK del reproductor de Vimeo ofrece una API mas limpia para este proposito. El evento timeupdate proporciona una propiedad data.percent directamente, por lo que no es necesario calcular el progreso manualmente. Combina esto con el evento play para rastrear si se inicio la reproduccion, y dispara tu evento de analytics con las metricas acumuladas.

Configuracion de objetivos de conversion

Una vez que los eventos de seguimiento de video fluyen hacia tu panel de analytics, puedes crear objetivos de conversion basados en ellos. Por ejemplo, establece un objetivo para visitantes que vieron al menos el 75% de un video de demostracion del producto. Esto te permite visualizar el engagement promedio de reproduccion a lo largo del tiempo y correlacionar el consumo de video con otras acciones en el sitio.