Realizar seguimiento de videos Youtube con Tag Manager para quienes trabajan como analista digital

Existen varias técnicas para realizar seguimiento de videos de Youtube que insertamos en el html en sitios webs, este post es un mini manual muy detallado de como realizarlo. Después de varios conflictos y varias horas de pruebas lo conseguí gracias a este artículo – después de leer y aplicar varios – , si laburas como analista digital te podrá servir para analizar datos, proponer mejoras y añadir a tus reportes de métricas.

Antes de comenzar con lo complicado, se requiere de los siguientes puntos:

  1. Cuenta en Google Analytics (se utilizará ID y el panel para testear los eventos lugo de la configuración).
  2. Cuenta en Google Tag Manager (se requiere de tiempo y orden para realizar las configuraciones).
  3. Un sitio web para realizar las pruebas (sólo se debe insertar el código que ofrece Youtube y Tag Manager vinculado a GA).

¿Para qué sirve?

Medir la cantidad de eventos de las interacciones realizadas por los usuarios al utilizar el reproductor de Youtube insertado en páginas html. Luego de implementar podrás visualizar datos en Comportamiento > Eventos de Google Analytics como: play, pause y (%) porcentaje visto. de los videos de todo el sitio. Eventos youtube para analista digital

Una vez que la implementación comience a lanzar todos los eventos, se puede realizar las segmentaciones especificas como por ejemplo:

Eventos + usuarios que han convertido. eventos a youtube analytics tag manager segmentación

Seguimiento para todos los videos del sitio. seguimiento youtube 3

¡A la acción analista digital!

Crearemos en Tag Manager:

(5) Variables:

1- variable de identificación WebProperty

  • Nombre: WebProperty ID
  • Tipo: Constant
  • Value: UA-XXXXXX-Y (ID de analytics)

YouTube variable 1 2- variable de YouTube está presente

  • Nombre: YouTube is present
  • Tipo: Custom JavaScript
  • Valor:
// Devuelve "true" si hay al menos un vídeo de YouTube en la función de la página () {for (var e = document.getElementsByTagName ( 'iframe'), x = e.length; x--;) si (/ youtube .com \ /embed/.test (e [x] .src)) {return true; } falso retorno; }

YouTube presente 2 3- categoría capa de datos variables

  • Nombre: dataLayer category
  • Tipo: Data Layer Variable
  • Valor: Capa de datos Nombre de la variable: eventCategory capa de datos Versión: Versión 2

3 categorías de YouTube4- variable de acción dataLayer

  • Nombre: dataLayer action
  • Tipo: Data Layer Variable
  • Valor: Capa de datos Nombre de la variable: eventAction capa de datos Versión: Versión 2

YouTube variable de acción 4Variable Etiqueta de 5- dataLayer

  • Nombre: dataLayer label
  • Tipo: Data Layer Variable
  • Valor: Capa de datos Nombre de la variable: eventLabel capa de datos Versión: Versión 2

YouTube variable de etiqueta 5

(2) Los disparadores:

Los disparadores de eventos 1- YouTube

  • Nombre: YouTube event
  • Tipo evento: Custom Event
  • Nombre evento: youtube

evento de YouTube TRIGGER- 62- desencadena YouTube presente

  • Nombre: YouTube present
  • Tipo evento: Custom Event
  • Fuego: Nombre del evento: gtm.dom “YouTube está presente” es igual a verdadera

YouTube presente gatillo 7

(2) Etiquetas:

Etiquetas 1- YouTube Evento

  • Nombre: YouTube Event
  • Tag Producto: Google Analytics
  • Tipo Tag: Universal Analytics
  • Configuration: Tipo de etiqueta: Universal Seguimiento de análisis Identificación: {{WebProperty ID}} Tipo de pista: Evento Categoría: {{categoría} dataLayer} Acción: {{acción} dataLayer} Etiqueta: {{dataLayer etiqueta}} Campos para configurar: Nombre del campo = “useBeacon”, valor de campo = “true”
  • Regla: Tag triggered by “YouTube event” trigger

YouTube event tag 8 copia

Etiquetas 2- YouTube Oyente

  • Nombre: YouTube Event
  • Tag Producto: Custom HTML Tag
  • Configuración: Tag type: Custom HTML HTML: (còdigo mas abajo)
  • Regla: Tag triggered by “YouTube present” trigger

listener9 YouTube

 

<! -
Google Analytics Administrador de etiquetas (V2) de encargo etiqueta HTML para el seguimiento de vídeo de YouTube

Derechos de autor 2015, el cardenal Path, Inc.

Autor original: Stéphane Hamel <shamel@cardinalpath.com>
Revisado por: Nicky Yuen <nyuen@cardinalpath.com>

versión 1.0
->
<Script type = "text / javascript">
  // Apoyo a varios jugadores en la misma página
  era gtmYTPlayers = [];
  
    // OPCIONAL: Habilitar JSAPI si no está ya en la URL
    // Nota: esto hará que el reproductor de YouTube de "flash" en la página cuando vuelva a cargar para que la API de JS
    for (var e = document.getElementsByTagName ( "iframe"), x = e.length; x--;)
        si (/youtube.com\/embed/.test(e[x].src))
            si (E [x] .src.indexOf ( 'enablejsapi =') === -1)
                E [x] .src + = (E [x] .src.indexOf () === -1: '&' '?'? '?') + 'enablejsapi = 1';
    
  /**
   * Se conecta oyente una vez que la API de YouTube es cargada	
  **/
    onYouTubeIframeAPIReady funcionar () {
        for (var e = document.getElementsByTagName ( "iframe"), x = e.length; x--;) {
            si (/youtube.com\/embed/.test(e[x].src)) {
                gtmYTPlayers.push (nueva YT.Player (E [x], {
                    eventos: {
                        onStateChange: onPlayerStateChange,
                        onError: onPlayerError
                    }
                }));
                YT.gtmLastAction = "p";
            }
        }
    }

  /**
   * Escucha de reproducción / pausa. También se podrían añadir otros estados como rebobinado y fin
     * También reporte% juega cada segundo
   * @param E - evento
  **/
    función onPlayerStateChange (e) {
        e [ "datos"] == YT.PlayerState.PLAYING && setTimeout (onPlayerPercent, 1000, e [ "blanco"]);
        var = video_data e.target [ "getVideoData"] (),
            label = video_data.video_id + ':' + video_data.title;
        si (e [ "datos"] == == YT.PlayerState.PLAYING && YT.gtmLastAction "p") {
            dataLayer.push ({
                Evento: 'youtube',
                eventCategory: 'youtube',
        eventAction: 'play',
                eventLabel: etiqueta
            });
            YT.gtmLastAction = "";
        }
        si (e [ "datos"] == YT.PlayerState.PAUSED) {
            dataLayer.push ({
                Evento: 'youtube',
                eventCategory: 'youtube',
        eventAction: "pausa",
                eventLabel: etiqueta
            });
            YT.gtmLastAction = "p";
        }
    }

  /**
   * No se pierda toda reportar errores a través de la capa de datos GTM. Una vez que el error se expone a GTM, que puede ser seguido en UA como un evento!
   * Consulte https://developers.google.com/youtube/js_api_reference#Events onError
   * @ Param: e (evento)
  **/
    
    función onPlayerError (e) {
        dataLayer.push ({
            Evento: 'error',
      eventCategory: 'youtube',
      eventAction: 'play',
            eventLabel: 'youtube:' + e
        })
    }

  /**
   * Informe el jugado% si coincide con 0%, 25%, 50%, 75%, 90% o completada
   * @ Param: e (evento)
  **/
    función onPlayerPercent (e) {
        si (e [ "getPlayerState"] () == YT.PlayerState.PLAYING) {
            // Var t = e [ "getDuration"] () - e [ "getCurrentTime"] () <= 1,5? 1: (Math.floor (e [ "getCurrentTime"] () / e [ "getDuration"] () * 4) / 4) .toFixed (2);
            
            // Establecer la duración jugado a uno de cada diez, porque tendremos que capturar también jugó el 90%.
            var t = e [ "getDuration"] () - e [ "getCurrentTime"] () <= 1,5? 1: (Math.floor (e [ "getCurrentTime"] () / e [ "getDuration"] () * 10) / 10) .toFixed (2);
            
            si (parseFloat (t) <0,25) {
                t = 0,00;
            }
            else if (parseFloat (t) <0,5) {
                t = 0,25;
            }
            else if (parseFloat (t) <0,75) {
                t = 0,50;
            }
            else if (parseFloat (t) <0,9) {
                t = 0,75;
            }
            else if (parseFloat (t) <1) {
                t = 0,90;
            }
            // Duración t tiene que ser fijo a 2 decimales
            t = t.toFixed(2);
            
            if (! e [ "lastP"] || t> e [ "lastP"]) {
                var video_data = e [ "getVideoData"] (),
                    label = video_data.video_id + ':' + video_data.title;
                e["lastP"] = t;
                dataLayer.push ({
                    evento: "youtube",
                    eventCategory: 'youtube',
                    eventAction: t * 100 + "%",
                    eventLabel: etiqueta
                })
            }
            e [ "lastP"] = 1 && setTimeout (onPlayerPercent, 1000, e!);
        }
    }
  
  /**
   * Añadir de descarga de detector de eventos
  **/
  window.addEventListener ( 'beforeunload', function (e) {
    for (var i = 0; i <gtmYTPlayers.length; i ++) {
      si (gtmYTPlayers [i] .getPlayerState () === 1) {// juego
        var = video_data gtmYTPlayers [i] [ 'getVideoData'] (),
        label = video_data.video_id + ':' + video_data.title;
        
        dataLayer.push ({
          Evento: 'youtube',
          eventCategory: 'youtube',
          eventAction: "salida",
          eventLabel: etiqueta
        });
      }
    }
  })
    
  // Cargar la API de YouTube JS y ponerse en marcha
    var j = document.createElement ( "script"),
        f = document.getElementsByTagName ( "script") [0];
    j.src = "//www.youtube.com/iframe_api";
    j.async = true;
    f.parentNode.insertBefore (j, f);
</ Script>

Y listo!

Importante: recuerde que debe finalizar versión comercial creada en el Administrador de etiquetas e insertar el código de seguimiento es la misma después de la primera <body> pegar aquí

Fuentes, recursos y artículos de utilidad:

Seguimiento por vídeo de YouTube con Google Administrador de etiquetas (V2)

YouTube Google Analytics y GTM Plugin

seguimiento de vídeo de YouTube a través de Google Administrador de etiquetas

Seguimiento de YouTube en Google Analytics y etiquetas de Google

Web Analytics Receta del libro: Cómo realizar el seguimiento Embedded vídeos de YouTube con Google Administrador de etiquetas

El arte de preguntar

La calidad de nuestras vidas la determina la calidad de nuestro pensamiento. La calidad de nuestro pensamiento, a su vez, la determina la calidad de nuestras preguntas, ya que las preguntas son la maquinaria, la fuerza que impulsa el pensamiento. Sin las preguntas, no tenemos sobre qué pensar. Sin las preguntas esenciales, muchas veces no logramos enfocar nuestro pensar en lo significativo y sustancial.

La calidad de nuestro pensamiento está en la calidad de nuestras preguntas.

Cuando hacemos preguntas esenciales, tratamos con lo que es necesario, relevante e indispensable al asunto que tenemos ante nosotros. Reconocemos lo que está en la esencia de la materia. Nuestro pensamiento está firme y disciplinado. Estamos preparados para aprender. Estamos intelectualmente capaces de encontrar nuestro camino.

si sabes que preguntar preguntas pequeñas preguntas mas grandas hacer preguntas gigantescas demasiadas preguntas algunas pregunta

Ilustraciones del norteamericano Grant Snider.

Texto: El Arte de Formular Preguntas Esenciales por Dra. Linda Elder y Dr. Richard Paul Basado en Conceptos de Pensamiento Crítico y Principios Socráticos.

Traducción con autorización de la Fundación para Pensamiento Crítico.

Financiate a ti mismo

Hace aproximadamente 8 meses he estado trabajando en un emprendimiento en paralelo a los proyectos que realizo como freelance durante mi tiempo “libre” y solo en días de semana – los fines de semana trabajamos en nuestro refugio de montaña junto a mi pareja -, en pocas palabras me he destrozado, ha sido complicado en tiempo y por sobre todo el escaso y limitado presupuesto con el que cuento – he cubierto todos los costos del proyecto – lo bueno es que durante todo estos años he generado buenas relaciones con desarrolladores lo cual me ha permitido negociar precios razonables.

Constantemente trato de validar la idea con posibles usuarios finales en terreno, mostrando el problema que resuelve y las funciones core de este, y también en empresas donde ya tengo aproximadamente 20 pilotos para iniciar. Lo que si me ha causado un poco de inseguridad es que a quienes se lo presento ha logrado tener buena acogida y han expresado que ya es digno para postular a una aceleradora e inversionistas, otros me han dado mil ideas y otros que se han querido sumar (es un MVP y le faltan varias herramientas que se me escapan de las manos realizarlas ahora), buscar financiamiento en este momento no es lo que quiero, tampoco ir a a eventos a perder tiempo, solo quiero continuar trabajando y deseo que salga a la luz mas temprano que tarde. Frente a esto hace unos días me tope con este artículo de 37Signals que me dejo más tranquilo en cuanto a lo busco.

Y dice así…

El dinero ajeno es el plan B

La primer prioridad de muchos comienzos de proyecto es conseguir fondos de los inversores. Pero recuerda, si cambias y eliges inversores externos, tendrás que responder a ellos también. Las expectativas crecen. Los inversores quieren recuperar su inversión — y rápido. La parte triste es que el aporte financiero a menudo se sobrepone a la construcción de un producto de calidad.

En estos días no toma mucho tiempo lograr el equilibrio. El Hardware es barato y la abundancia de software open source y gratis ofrecen una gran infraestructura. Y la pasión no tiene marcado el precio.

Entonces, haz lo que puedas con los fondos disponibles. Piensa seriamente y determina qué es realmente esencial y qué puedes dejar de lado. ¿Qué puedes hacer con tres personas en vez de diez? ¿Qué puedes hacer con $20k en vez de $100k?

Las restricciones fuerzan la creatividad
Trabaja con recursos limitados y te verás forzado a contar con restricciones tempranas y más intensamente. Y eso es bueno. La restricciones conducen a innovaciones.

La restricciones también te fuerzan a poner tu idea en producción más temprano que tarde — otro tema importante. Luego de uno o dos meses debes tener una buena idea acerca de si tu proyecto es correcto o no. Si lo es, en poco tiempo podrás auto-sustentarte sin financiamiento externo. Si tu idea no funciona, es tiempo de regresar al tablero de diseño. Al menos ahora lo sabes. Al menos así te puedes retirar fácilmente. Los planes de retirada se vuelven cada vez más complicados una vez que los inversos han sido involucrados.

Si estás creando software sólo para hacer dinero fácil, eso saldrá a la luz. La verdad, una liquidación rápida es bastante improbable. Así que haz foco en construir una herramienta de calidad que tu y tus clientes puedan usar por un largo tiempo.

 

Los empresarios, los ángeles y el costo de lanzamiento

Cosas que todos hacemos

Este 2015 ha sido un año de muchos proyectos tanto freelance como personales y gran parte se lo debo a este blog en especial a esta publicación – empresas que ofrecen servicios de ux en Chile – post que tiene una muy buena posición de forma orgánica en Google y ha captado varios usuarios cualificados.

Me han llegado mensajes de empresas de diseño dando las gracias por la recomendación, cuando no las he recomendado, solo realice un pequeño catastro de las empresas UX en Chile.

Esa era la explicación del por que esta tan botado este blog, cosa que continuará por mas tiempo, es por esto he decidido dar un giro, usaré esta plataforma para compartir apuntes que tengo en mis cuadernos y tablet que por lo general escribo cuando asisto a cursos y seminarios, creo que podría ser más pragmático que escribir algo de cero.


Apunte clase: Usabilidad en Proyectos Digitales “Hay cosas que todos hacemos”

Pensamos en crear “literatura de calidad” (o al menos “el folleto de un producto”), cuando la realidad del usuario está mucho más próxima a la “cartelera publicitaria que pasa a 100 kilómetros por hora”. Steve Krug

Cosas que todos hacemos

Sabemos que las personas que entran a un sitio web no ven toda la web, mas bien ojean las páginas por encima.

Listado:

  • No leemos, escaneamos
  • No tenemos tiempo
  • No nos importa mucho equivocarnos
  • No evaluamos opciones
  • Nos gusta adivinar
  • Nos importa lo que el otro piensa
  • Nos importa aún más lo que piensan los que a nosotros nos importan
  • Nos gusta que sepan quienes somos
  • No nos gusta que nos den muchas opciones
  • Nos gusta que nos cuenten de lo que nos importa
  • Nos gusta ganar

Creo que seria interesante profundizar cada punto, en cuanto al primero No leemos, escaneamos según un estudio realizado por Jackob Nielsen, los usuarios no leen, sino que escanean la página para tomar la decisión si merece la pena examinar ese contenido. El usuario más común solo lee las primeras palabras de cada frase, empezando por arriba y perdiendo interés a media que baja.

usuarios no leen, sino que escanean la página
usuarios no leen, sino que escanean la página(foto) el patrón de lectura que genera el test de usuario tiene forma de “F”.

En la próxima publicación compartiré los patrones de lectura como la mencionada y conocida F y la de Exploración (abajo) entre otras.exploracion