Tips a tener en cuenta a la hora de hacer test A/B

Dani Robledillo

Gracias al uso de tests A/B podemos averiguar cuáles son los contenidos que más influyen en el rendimiento de la página web, email o anuncio y optimizarlos para poder conseguir un incremento de la tasa de conversión.

Los tests A/B son el engranaje principal que hace que aumente nuestra tasa de conversión. Para conseguir esto es muy importante que nos basemos en hipótesis a la hora de realizar tests A/B.

Una hipótesis es una suposición que hacemos y que está basado en un problema que presuponemos que está afectando al comportamiento del usuario, y a su vez al rendimiento que obtenemos de la página.

Para aprender a implementar un test A/B, podéis informaros en nuestro blog de cómo implementar un test A/B con Google Optimize.

Entiende lo que tu audiencia necesita

Hacer preguntas a tus usuarios es una excelente manera de obtener información para probar hipótesis.

La idea es aplicar la información que se obtiene de las respuestas para posteriormente realizar tests A/B que realmente afectan a la tasa de conversión.

SurveyMonkey es una buena herramienta para obtener comentarios de los usuarios web. Preguntas del tipo ¿Cómo crees que podemos mejorar tu experiencia en el sitio web? o, ¿Hay algún problema al que te enfrentas en el proceso de compra? pueden ser de gran utilidad a la hora de enfocar nuestros test A/B.

Realiza los cambios poco a poco

Imagina un test A/B en el que cambias 5 cosas de tu web. ¿Podrás decidir fácilmente qué KPI te ayudará a decidir el ganador? ¿Podrás decidir qué cambio ha sido el que ha tenido más relevancia?

Si incluyes varios elementos en el mismo test va a ser difícil entender qué elemento ha generado un mejor desempeño.

Lo más recomendable es comprobar un cambio tras otro y optimizar la web poco a poco. Para hacer varias modificaciones de manera simultánea, los experimentos multipage o de páginas múltiples, en la cual se muestra a un grupo de usuarios todas las páginas nuevas o antiguas, son una buena opción.

Define el objetivo correcto para cada test A/B

Antes de ejecutar cualquier prueba, es importante definir cómo se va a medir el éxito de esa prueba en particular.

Es importante definir un objetivo acorde al test que estamos realizando.

Si tenemos un ecommerce el objetivo principal va a ser la compra, no obstante si realizamos un test que quiera aumentar los productos agregados al carrito, lo ideal es que el objetivo principal sea el número de veces que se ha añadido un producto al carrito. Como objetivo secundario si que podemos añadir el objetivo de transacción.

En el caso de tener una web orientada a generar leads, el objetivo principal de la web va a ser generalmente un formulario de contacto.

En cambio, si en la web tenemos un botón para descargar alguna guia y queremos testear el uso de ese botón, el objetivo principal va a ser el número de clics sobre el botón y no los formularios de contacto enviados.

Dale a los tests A/B el tiempo suficiente para producir datos útiles

Es importante dejar que la prueba se ejecute el tiempo suficiente para obtener un tamaño de muestra sustancial. De lo contrario, va a ser difícil difícil saber si existe una diferencia estadísticamente significativa entre las dos variaciones.

¿Cuánto tiempo es lo suficientemente largo? Dependiendo de la compañía, cómo se ejecute el test A/B y del volumen de datos de nuestra web, se pueden obtener resultados estadísticamente significativos en horas, días o semanas.

Una gran parte del tiempo que se tarda en obtener resultados estadísticamente significativos es la cantidad de tráfico que recibe, por lo que si la web no recibe mucho tráfico, llevará mucho más tiempo ejecutar un test A/B.

Documenta tus pruebas y resultados

Documentar test A/B con Effective Experiments

Por alguna razón, esto suele ser un tema más descuidado pero no por ello menos importante.

Es importante tener un panel de control donde se vean todos los tests realizados, que versión es la ganadora y el por que de ese test.

Effective Experiments es una herramienta de documentación del roadmap de testing que nos puede ayudar a gestionar y documentar nuestros experimentos.

Los tests siempre tenemos que hacerlos sobre una suposición de por qué se implementa ese test ya que de esta forma vamos a ir aprendiendo poco a poco cómo actúan los usuarios en nuestra web.

Si el día de mañana se hace un rediseño de la web, vamos a saber qué CTAs añadir, que botones destacar o cómo debemos mostrar ciertos elementos para no tener que volver a testearlo todo de nuevo.

Esto no solo ahorra tiempo al permitir no repetir los tests que se han realizado en el pasado, sino que también ayuda a tener un histórico.

De esta forma logramos el que si cambia la persona encargada de realizar los tests, va a saber cuales ya se han implementado y de esa forma no perder tiempo.

Table of Contents

Importar Datos de campañas PPC con la API de Google Analytics

Dani Robledillo

Hace tiempo os hablamos de como importar los costes de distintas fuentes de marketing que no pertenecen a Google directamente a Google Analytics.

Hoy vamos a ir un paso mas allá y vamos a ver como importar no solo los costes, si no que vamos a ver como importar nombres de campañas, grupos de anuncios, clics, impresiones, etc… de otras fuentes PPC como pueden ser Facebook Ads y Bing Ads.

Además vamos a ver como hacer este proceso automático a través de la API de Google Analytics para que los datos se importen diariamente (o como se prefiera).

Obtener el identificador y el esquema

Lo primero que debemos hacer es decirle a Google Analytics que vamos a importar ciertos datos y que se prepare para recibirlos y además nos proporcione una plantilla que deberemos seguir para posteriormente importar los datos.

Para ello nos dirigimos a la cuenta de Google Analytics y vamos a Administrar – Importación de Datos. Una vez en esta vista, hacemos clic en Crear.

En este apartado se nos van a presentar diferentes opciones a seleccionar:

Datos de reembolso: permite importar datos sobre el reembolso de comercio electrónico.
Datos de usuario: cree segmentos y listas de remarketing que incorporen metadatos de usuario importados, como una valoración de la fidelización o el valor del ciclo de vida del cliente.
Datos de campaña: amplíe y reutilice los códigos de campañas que no sean de Google importando dimensiones relacionadas con las campañas publicitarias, como la fuente.
Datos geográficos: Permite crear regiones geográficas personalizadas para generar informes sobre los datos de Analytics.
Datos de contenido: Permite agrupar el contenido mediante los metadatos de contenido importados, como el autor, la fecha de publicación y la categoría del artículo.
Datos de producto: Permite mejorar la información de los productos gracias a los metadatos de producto, como la talla, el color, el estilo u otras dimensiones relacionadas con los productos.
Datos personalizados: permiten importar conjuntos de datos personalizados.
Datos de costes: puede incluir clics de redes publicitarias de terceros (ajenas a Google) y datos de costes e impresiones para hacerse una idea más completa de su inversión publicitaria.

Nosotros vamos a seleccionar la opción «Datos de costes». A diferencia de los datos de campaña, los datos de costes nos permiten agregar mucha mas información relevante sobre las campañas como clics, impresiones y el coste para poder obtener el CTR, ROAS o CPC.

El siguiente paso es indicar un nombre para poder identificar esta importación y seleccionar la vista a la que vamos a importar los datos.

En el último paso debemos indicar que métricas y dimensiones queremos importar. Obligatoriamente debemos indicar la fecha, el medio y la fuente.

Como métricas vamos a indicar clics, coste e impresiones.

Como dimensiones marcamos la casilla de Campaña, si queremos podemos agregar mas dimensiones relacionadas con los anuncios, los grupos de anuncio o las palabras clave.

Por último, debemos indicar qué comportamiento vamos a querer utilizar tras la importación de los datos. Tenemos dos opciones:

Suma: Marcada por defecto, en el caso de encontrar datos con la misma fecha y fuente, sumará los datos.
Sobrescribir: En el caso de encontrar datos con la misma fecha y fuente, reemplazará los datos nuevos por los antiguos.

Seleccionamos «sobreescribir» para evitar que los datos puedan ser duplicados. Con esto ya podemos hacer clic en guardar para poder obtener el esquema.

Si los datos se duplican al utilizar el método de suma, habría que volver a subir los datos pero con numero en negativo, es decir, si tenemos 500 impresiones y se ha duplicado a 1000 deberemos importar -500 impresiones para una campaña, fuente, medio y campaña determinada.

Una vez guardado vamos a tener dos opciones para importar los datos.

Obtener el esquema: Al pulsar este botón, se abrirá un modal donde podremos descargar directamente la plantilla.
Obtener un ID (para la API): Esta opción nos proporcionará un identificador para poder utilizarlo con la API de Analytics.

En este caso vamos a utilizar el ID para usuarios de la API de Google Analytics, si quieres ver como se utiliza el otro metodo puedes acceder a este post donde lo explicamos.

Lo primero que vamos a hacer es seleccionar la opción de obtener un ID y guardarlo para usarlo mas adelante.

Una vez tenemos nuestro identificador hacemos clic en obtener el esquema para obtener las cabeceras de nuestro fichero csv de datos.

Preparar los datos a importar

Para subir los datos, debemos subirlos en un formato CSV delimitado por comas. En este caso vamos a utilizar Google Sheets para obtener los datos y prepararlos, para posteriormente transformarlo a CSV.

Como queremos que todo el proceso se realice de forma automática para no tener que realizar esta acción cada vez que vayamos a importar los datos, es necesario utilizar una herramienta que exporte los datos de nuestras campañas de PPC de manera automática.

Para ello nosotros utilizamos supermetrics for google sheets.

Lo que debemos hacer ahora, es crear una nueva hoja de Google Sheets y escribir en la primera fila de cada columna las cabeceras del esquema que hemos obtenido previamente.

Debajo de cada cabecera es donde deberemos indicar los datos de nuestras campañas de PPC. Los datos deben quedar como la siguiente imagen:

Hay que tener cuidado a la hora de indicar los datos ya que hay ciertos caracteres que generan error cuando importamos los datos.

Un ejemplo es que los números con decimales deben tener como separador decimal un punto y no una coma. Para mas información podéis consultar la documentación de Google.

Obtener los datos en formato CSV

Una vez tenemos todos los datos listos para ser importados, debemos generar estos datos en formato CSV separado por comas.

Como lo esencial es que este proceso sea automatico, vamos a generar una url con los datos ya en el formato necesario.

Esta tarea es muy simple ya que Google Sheets nos va a facilitar el proceso.

Para ello debemos utilizar la herramienta «Publicar en la web» de Google Sheets que nos va a permitir obtener un enlace de nuestros datos en una URL.

Para comenzar vamos a ir a nuestro Spreadsheet en Google Drive, en el menú superior accedemos a Archivo – Publicar en la web.

En el menú que nos aparecerá debemos elegir qué pestañas queremos publicar y en qué formato.

Seleccionamos la pestaña donde tengamos los datos y como formato indicamos valores separados por comas.

Antes de publicar debemos acceder a la configuración de la publicación y marcar la casilla que actualiza automáticamente cualquier cambio realizado en nuestro fichero.

Una vez lo tenemos todo listo le damos a publicar y copiamos la URL que nos va a aparecer. Debe ser parecido a esto:

«https://docs.google.com/spreadsheets/d/e/xxxxxxx/pub?output=csv«

Importar los datos

Para este paso es necesario tener acceso a la API de Analytics, para conseguir el acceso hay que ir a la documentación de la API de Google Analytics.

En nuestro caso hacemos uso de la API mediante PHP, pero también esta disponible para Java, Python y Javascript.

Ya con el acceso, debemos crear un fichero PHP y lo primero que debemos hacer es obtener los datos que hemos creado en Google Sheets.

En PHP esto lo podemos lograr gracias a la función file_get_contents(). Gracias a esta función obtenemos los datos en CSV ya preparados solo con indicar la URL que ha generado el fichero.

Ahora que ya tenemos los datos preparados, nos conectamos a la API de Administración de Google Analytics para enviarle los datos.

Una vez conectados, debemos hacer uso de la función uploadData(). Para ver como hacer uso de esta función debemos dirigirnos a la documentación de la funcion uploadData()

Dentro de esta función debemos indicar el identificador que hemos generado previamente en Analytics para subir los datos.

Ahora que lo tenemos todo listo, ejecutamos el fichero y si todo ha ido bien veremos en Google Analytics que ha habido una subida a la importación de datos que hemos creado.

Analytics revisará el fichero y si encuentra algún error nos lo indicará. En caso de estar todo correcto empezará a importar los datos.

Los datos tardan varias horas hasta que los podamos visualizarlos.

Visualizar los datos

Para visualizar los datos vamos a crear un informe personalizado que contenga las métricas y dimensiones que hemos subido en el fichero.

Para ello vamos al apartado de personalización de Analytics y dentro vamos a Informes personalizados.

Haciendo clic en nuevo informe personalizado veremos un apartado donde indicar un título y seleccionar las métricas y dimensiones que vamos a querer ver en el informe. Además vamos a poder aplicar filtros a los datos indicados.

Por último le debemos indicar la vista de la que vamos a querer ver los datos.

Ahora ya tenemos una tabla donde vamos a poder ver todos los datos de nuestras campañas de PPC en una única plataforma.

Table of Contents

Medición avanzada sobre el píxel de Facebook

Dani Robledillo

Eventos del píxel de Facebook

Gracias a los eventos del píxel de Facebook vamos a poder medir ciertas acciones que ocurren en el sitio web, para un ecommerce podemos crear un funnel desde una vista a un producto, pasando por el carrito y el proceso de compra hasta que se finaliza la transacción.

Por defecto, Facebook nos proporciona ciertos eventos llamados eventos estándar que vienen ya predefinidos por el sistema. Un ejemplo sería el evento purchase para medir las transacciones de nuestra web.

Por otro lado tenemos los eventos personalizados que son todas aquellas acciones que no se incluyen en los eventos estándar. Su creación y utilización es más compleja por lo que solo vamos a centrarnos en los eventos estándar que proporciona Facebook .

Estos son los eventos estándar que podemos configurar con Facebook :

Artículo añadido al carrito: Seguimiento de cuándo se añaden artículos a un carrito de la compra.

Información de pago añadida: Seguimiento de cuándo se añade la información de pago en el proceso de pago.

Artículo añadido a la lista de deseos: Seguimiento de cuándo se añaden artículos a una lista de deseos.

Registro completado: Seguimiento de cuándo se rellena un formulario de registro.

Contactar: Llamada de teléfono, envío de SMS, conversación por chat o cualquier otro tipo de contacto entre el cliente y tu empresa.

Personalizar producto: Personalización del producto mediante una herramienta de configuración u otra aplicación propiedad de la empresa.

Hacer donación: Seguimiento de donaciones realizadas a tu organización o causa.

Buscar ubicación: Seguimiento de cuándo alguien encuentra una de tus ubicaciones en internet o en una aplicación con la intención de visitarla.

Pago iniciado: Seguimiento de cuándo acceden las personas al proceso de pago.

Clientes potenciales: Seguimiento de cuándo alguien muestra interés por tu oferta.

Compra: Seguimiento de las compras y de las personas que completan el proceso de pago.

Programar: Seguimiento de la programación de citas para visitar una de tus ubicaciones.

Búsqueda: Seguimiento de las búsquedas realizadas en tu sitio web, aplicación u otro canal.

Iniciar prueba: Seguimiento del inicio de pruebas gratuitas de un producto o servicio que ofreces.

Enviar solicitud: Seguimiento del envío de solicitudes para acceder a un producto, servicio o programa que ofreces.

Suscribirte: Seguimiento del inicio de suscripciones de pago a un producto o servicio que ofreces.

Contenido visualizado: Seguimiento de las visitas a páginas clave.

Para obtener más información acerca de estos eventos, puedes consultar la documentación de Facebook.

Configurar píxel y eventos

Para configurar los eventos simplemente deberemos agregar un pequeño código en la web. Es recomendable que lo realice una persona que tenga nociones sobre programación y Javascript para poder solventar problemas a la hora de realizar la configuración.

Vamos a ver cómo podemos configurar los eventos dependiendo de cómo tengamos desarrollado nuestro sitio web.

Esta configuración está explicada para entornos web, para realizar la configuración en apps hay que utilizar el SDK de Facebook .

Configuración a través de Tag manager

Como siempre digo, lo ideal es utilizar tag manager por temas de escalabilidad en la configuración de las diferentes etiquetas pero también depende de cómo esté montada la página web.

Lo primero que deberemos hacer es agregar el píxel de Facebook si no lo tenemos aún integrado. Simplemente creamos una nueva etiqueta HTML y pegaremos el píxel que nos proporciona Facebook ads para nuestra cuenta. Como trigger debemos seleccionar Todas las páginas (All pages) ya que esta etiqueta debe aparecer en todas las páginas de nuestro sitio web.

Para realizar la configuración de los eventos deberemos insertar etiquetas HTML ya que no viene por defecto la configuración de Facebook. En la etiqueta HTML agregaremos el código del evento que queramos agregar a la cuenta de Facebook.

Es importante asegurarnos que esta etiqueta se ejecute después del píxel de Facebook, por lo que intentar no utilizar un trigger que se ejecute antes de pageview que es donde se ejecuta el píxel de Facebook.

Si queremos agregarle valores dinámicos a los eventos como el valor de la compra en el caso del evento purchase, tendremos que obtener ese valor a través del datalayer de la web y posteriormente modificar la etiqueta del evento purchase para agregarle este valor.

Si no sabes como funciona el dataLayer en Google Tag Manager, puedes consultar nuestro post.

Configuración a través de CMS

Si estamos utilizando un CMS ya sea Magento, WordPress, Prestashop, etc… y no utilizamos Google Tag Manager deberemos instalar un plugin/módulo al CMS para realizar esta configuración automáticamente.

Personalmente recomiendo utilizar un plugin/módulo que agregue Google Tag Manager con todo el dataLayer configurado para utilizar siempre Google Tag Manager en toda la configuración de etiquetas que queramos.

Configuración directa a la web

Si queremos agregar directamente el código en nuestra web simplemente deberemos agregar los códigos de los eventos en las partes de la web que deben ser ejecutados.

Como buena práctica, Facebook nos dice que agreguemos el código del evento dentro del píxel y no fuera de él.

Como en este caso vamos a poder tener control total sobre el código de la web podemos realizar esta integración de esta manera:

Como vemos en la imagen, hay que agregar el código dentro de las etiquetas <head></head> de HTML. La particularidad del código del ejemplo es que tiene el evento incrustado en mitad del píxel .

No es obligatorio que aparezca dentro del propio píxel pero si que es recomendable. Lo que si es obligatorio es que se agregue después del píxel , ya que necesitamos que la librería fbevents.js este cargada en nuestra web para poder hacer uso de la funcion fbq.

Table of Contents

Conversión de llamada en el sitio web con Google Ads

Dani Robledillo

Las conversiones de llamadas en el sitio web miden las llamadas realizadas a un número de teléfono. Para ello, Google reemplaza el número que aparece en el sitio web por otro relacionado con ellos, de esta manera se redirecciona la llamada al numero oficial del sitio web y se contabiliza una conversión.

Antiguamente si queríamos medir este tipo de conversión, debíamos agregar una linea de código a cada teléfono en nuestra web. Ahora con la implementación de la etiqueta global hay una nueva forma de medir estas conversiones. Vamos a ver como configurar esta conversión con la etiqueta global de Google Ads.

Si aún no utilizas la etiqueta global de Google Ads puedes aprender a actualizarte en este post.

Qué necesitas para configurar la conversión de llamada en el sitio web

Esto es lo que se necesita para configurar el seguimiento de conversiones de llamadas desde un sitio web:

Una extensión de llamada activa: es necesario disponer de, como mínimo, una extensión de llamada.

Una número de teléfono de un país apto: Google no tiene activada esta función para todos los paises. Para ver los paises disponibles podemos ir a su documentación.

Conocimientos sobre HTML y Javascript.

Cómo crear la conversión de llamada en el sitio web

Vamos a explicar como instalar la conversión de llamada de tu sitio web. Para realizar la instalación es necesario tener cierto conocimiento sobre HTML y Javascript.

Recordar que estamos realizando el nuevo tipo de configuración utilizando la etiqueta global de Google Ads.

Crear la conversión de llamada en Google Ads

Antes de empezar tenemos que asegurarnos que cumplimos los requisitos mencionados en este post, una vez comprobado que cumplimos estos requisitos lo primero que debemos hacer es crear la conversión de tipo «Llamadas desde el sitio web» desde la sección de Llamadas telefónicas.

Creacion de la conversión de llamada en el sitio web

El siguiente paso será rellenar la información de la conversión, en esta configuración deberemos indicar los siguientes datos:

Nombre de conversión: Debemos introducir el nombre de la conversión que queramos.
Categoría: Indicamos la descripción de la acción de conversión.
Valor: Podemos introducir un valor predeterminado por cada llamada recibida.
Recuento: Podemos indicar el número de conversiones que se cuentan por cada clic o interacción.
Duración de la llamada: En este campo le indicaremos el tiempo mínimo en segundos que queremos que dure una llamada como mínimo para contabilizar una conversión.
Ventana de conversión: Se puede seleccionar durante cuánto tiempo quieres hacer el seguimiento de las conversiones después de que alguien haga clic en el anuncio o tras otra interacción.
Incluir en Conversiones: Si dejamos esta opción activada, los datos de esta acción de conversión se incluirán en la columna «Conversiones» de los informes en Google Ads. Si le indicamos que no lo queremos incluir, los datos se incluirán en la columna «Todas las conversiones».

Configuración de conversión de llamada en el sitio web

Configurar la conversión de llamada en el sitio web

Lo primero que deberemos hacer es insertar la etiqueta global de Google Ads (en el caso de que ya tengas instalada esta etiqueta ya sea con el código genérico o a través de la etiqueta de Google Analytics no hará falta realizar este paso). Esta etiqueta debe colocarse en la cabecera (<head>) de nuestra página.

Cuando creamos la conversión de llamada, la propia herramienta nos facilita la etiqueta que debemos colocar en todas las páginas de nuestro sitio web:

<script async src="https://www.googletagmanager.com/gtag/js?id=AW-XXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'AW-XXXXXXXX');
</script>

Una vez tengamos el código insertado, debemos introducir la etiqueta que realizara la conversión de llamada.

Por defecto, Google nos va a proporcionar el siguiente código:

<script>
gtag('config', 'AW-CONVERSION_ID/CONVERSION_LABEL', {
'phone_conversion_number': 'NUMERO_TELEFONO'
});
</script>

A este código hay que agregarle el numero de teléfono tal y como aparece en la web.

Una vez colocado el código después de la etiqueta global debería funcionar, y digo debería porque en la mayoría de casos este código no registra conversiones.

¿y por que no registra conversiones si he realizado los pasos que me ha indicado Google?

El problema reside en como tengas indicado tu número en tu web mediante HTML, para encontrar una solución vamos a ver como funciona la etiqueta de conversión mas detalladamente.

Actualmente en la etiqueta estamos indicando la variable phone_conversion_number a la que le indicamos el número de teléfono, pero tenemos otras variables opcionales que podemos configurar:

phone_conversion_callback: A este parámetro le podemos enviar una función de Javascript que recibe dos parámetros. El primer parámetro es el mismo que le indicamos en phone_conversion_number que contiene nuestro teléfono. Como segundo parámetro recibimos el numero formateado para ser usado en móvil.
phone_conversion_css_class: En este parámetro le podemos indicar la clase CSS que contiene nuestro número web. De esta forma solamente cambiarán los teléfonos que se incluyan en los elementos de esta clase.
phone_conversion_options: En este parámetro tenemos dos variables que podemos indicar:
- timeout: Se indica el tiempo de espera en milésimas de segundos para obtener el número de Google. El tiempo de espera predeterminado es de 5000 milésimas de segundo.
- cache: Sirve para indicar si deseamos inhabilitar el almacenamiento en caché del número en una cookie. Admite los valores true y false.

Ahora que ya sabemos los parámetros opcionales que podemos agregar vamos a ver diferentes ejemplos para hacer saltar la conversión correctamente.

1. Solo queremos configurar la conversión en ciertos números de teléfono:

En este caso deberemos aplicar una clase CSS a nuestro numero de teléfono y posteriormente indicarlo en el parámetro phone_conversion_css_class.

Código web del teléfono:

<span class="number">912 345 678</span>

Código de conversión:

<script type="text/javascript">
gtag('config', 'AW-CONVERSION_ID/CONVERSION_LABEL', {
'phone_conversion_number': '912 345 678',
'phone_conversion_css_class':'number'
});
</script>

2. Solo queremos configurar la conversión en un elemento de nuestra web.

Para este caso también podemos utilizar el ejemplo anterior con clases pero no es lo mas adecuado. En este caso vamos a utilizar un identificador ya que va a ser un elemento único, para hacer uso de identificadores vamos a crear una función y atacarla mediante la variable phone_conversion_callback.

Código web del teléfono:

<span id="number">912 345 678</span>

Código de conversión:

<script type="text/javascript">
var callback = function(formatted_number, mobile_number) {
var e = document.getElementById("number");
e.innerHTML = "";
e.appendChild(document.createTextNode(formatted_number));
};

gtag('config', 'AW-CONVERSION_ID/CONVERSION_LABEL', {
'phone_conversion_number': '912 345 678',
'phone_conversion_callback': callback
});
</script>

Lo que estamos realizando en la función es seleccionar el elemento con el identificador «number» y lo reemplazamos por el parámetro formatted_number que es el número de Google.

3. Queremos hacer que los usuarios de móvil puedan hacer clic y llamar directamente al número de Google para realizar la conversión.

Este caso va a ser de los mas utilizados en las páginas web y es que la mayoría de webs tienen su numero de teléfono creado para que pueda hacerse clic sobre el y llamar automáticamente si estamos en móvil. Para ello vamos a utilizar la función de callback y hacer uso del segundo parámetro que es el numero formateado para movil.

Código web del teléfono:

<a href="tel:912345678" id="number">912 345 678</a>

Código de conversión:

<script type="text/javascript">
var callback = function(formatted_number, mobile_number) {
var e = document.getElementById("number");
e.href = "tel:" + mobile_number;
e.innerHTML = "";
e.appendChild(document.createTextNode(formatted_number));
};
gtag('config', 'AW-CONVERSION_ID/CONVERSION_LABEL', {
'phone_conversion_number': '912 345 678',
'phone_conversion_callback': callback
});
</script>

En la función de callback estamos obteniendo nuestro número por el identificaor «number» y reemplazando el parametro href por el número de Google formateado para moviles, ademas agregamos el número de Google como parte visible con el formato normal.

Cómo crear la conversión desde Google Tag Manager

Si estamos utilizando Google Tag Manager para gestionar todas las etiquetas y conversiones, deberemos agregar todo el código generado como una etiqueta HTML personalizado y hacer que se ejecute en todas las páginas.

Si no sabes como funciona Google Tag Manager, puedes informarte sobre ello en este post.

Hay que tener en cuenta que debemos agregar primero la etiqueta global y posteriormente la etiqueta de conversión. Podemos agregarlo todo en la misma etiqueta HTML o separarlo pero agregando un orden de ejecución dándole mas prioridad a la etiqueta global de Google Ads.

Tag Manager conversión de llamada en el sitio web

Table of Contents

Google Signals: Empieza ya a utilizarlo

Dani Robledillo

Gracias al gran volumen de datos generados por los usuarios que han activado la función Personalización de Anuncios, Google puede estimar a partir de ellos el comportamiento de toda su base de usuarios en distintos dispositivos.

Con estos datos, Google ha creado Google Signals para poder analizar toda esa información de nuestros usuarios. Conoce más acerca de esta valiosa herramienta para tus campañas de Ads en este post.

¿Qué es Google signals?

Google signals es el nombre otorgado a la funcionalidad de Google Analytics que permite realizar informes multidispositivo y Remarketing. Habilitar Google Signals te permite aprovechar las funciones mejoradas de publicidad e informes en diferentes dispositivos.

Los datos extraídos de Google Signals nos van a permitir analizar los pasos que van siguiendo los usuarios que acceden a nuestra web a través de los diferentes dispositivos que vayan utilizando.

Por ejemplo, se puede ver cómo un usuario busca un producto en tu sitio web desde su teléfono, y cómo vuelve más tarde para completar la compra desde su tablet o portátil.

Cuando se activa Google Signals, las funciones existentes de Google Analytics se actualizan para incluir más información de los usuarios de Google, pero solo para aquellos que han activado la Personalización de anuncios.

Estas son las áreas donde Google signals aporta una información más precisa (siempre y cuando se active la Personalización de Ads):

Remarketing: publica anuncios en campañas de remarketing elegibles para distintos dispositivos.
Informes de anuncios: Google Analytics recopilará información adicional sobre los usuarios que han activado la personalización de anuncios.
Demografía e informes de interés: se recopilará más información sobre estas variables.
Informes entre dispositivos: según los datos agregados de los usuarios que han activado la personalización de anuncios, Google Analytics modela el comportamiento de toda una base de usuarios en todos los tipos de dispositivos.

Google Signals está disponible para usuarios que hayan activado al Personalización de Google Ads

¿Qué informes nos permite utilizar?

Una vez que se activado Google Signals, vamos a ver un nuevo submenú dentro del apartado de adquisición. Este nuevo apartado se llama Informes multidispositivo (beta). En este nuevo apartado es donde podremos visualizar los nuevos informes:

Superposición de dispositivos: Vamos a poder analizar las diferentes combinaciones entre dispositivos que utilizan los usuarios.

Informe de Superposicion de Dispositivos

Rutas de dispositivos: En este informe podemos analizar los diferentes dispositivos utilizados en base a ciertos objetivos, eventos o páginas determinadas.

Canales: En este informe se representa por canales, la adquisición, comportamiento y conversiones utilizando el modelo de último clic indirecto.

Dispositivo de adquisición: Nos va a indicar los nuevos usuarios obtenidos a través de los diferentes dispositivos.

¿Cómo activar Google Signals?

Para activar Google signals, debes tener el permiso Editar en la propiedad de Google Analytics en la que quieras activarlo.

Google ha elaborado una guía completa sobre cómo activar este producto, pero aquí te mostramos una guía de configuración rápida basada en la documentación de Google, para que puedas acceder fácilmente.

Para activar Signals, inicia sesión en Google Analytics y haz clic en la pestaña ADMIN en la parte inferior del menú de la izquierda.

Una vez dentro de la cuenta, deberás seguir los siguientes pasos:

1. Es posible que en tu cuenta de Analytics aparezca un banner azul dándote la opción de empezar a utilizar Google Signals

Si no aparece este banner puedes dirigirte a la columna Propiedad > Información de seguimiento > Recogida de datos, y seguir las instrucciones que aparecen en el cuadro de diálogo azul.

2. En el siguiente paso deberás leer la información acerca de la plataforma y pulsar en continuar

Asegúrate de leer y comprender el texto de esta página antes de hacer clic en Continuar o haz clic en el enlace “Obtener más información sobre Google Signals” si algo no está claro.

A continuación, haz clic en Continuar y verás la siguiente pantalla, donde seleccionar las propiedades.

3. En este punto deberás seleccionar las propiedades donde activar esta nueva función

De forma predeterminada, esto se establece en «todas las propiedades» en la cuenta que selecciones, pero puedes cambiarlo a «esta propiedad» o seleccionar propiedades específicas asignadas a esa cuenta.

Siempre y cuando todas las propiedades sean para la misma compañía, no deberías tener problema con la habilitación para todos, pero si eres una agencia SEM o simplemente tienes datos de otras compañías en tu cuenta, es posible que debas ser más específico con esta configuración .

Asimismo, necesitarás tener acceso de Administrador al nivel de la cuenta.

4. Por último solo falta hacer clic en el botón “Activar” para poder empezar a utilizar esta nueva función

¡Enhorabuena! Ya puedes comenzar a recopilar datos valiosos para tus campañas.

¿Auditoría SEM? Aire fresco para tus campañas

Consideraciones para instalar Signals

Con Google Analytics puedes administrar varias cuentas y cada cuenta puede tener múltiples propiedades (sitio web, escaparate, blog, aplicación móvil, etc.).

Google Signals se aplica a propiedades individuales, por lo que, si tienes varias propiedades en Google Analytics, debes elegir cuál activar.

Para más información sobre Google Signals y su activación puedes acceder a la web de soporte de Google.

Por qué activar Google Signals

Al igual que muchos datos de Google Analytics, la recopilación de la información solo comienza cuando la activa, por lo que si deseas utilizar esta funcionalidad, debes activarla lo antes posible.

Si ya estás haciendo remarketing o estás utilizando los informes de comportamiento, deberías tenerla ya en marcha.

Te puede interesar: Analítica Web: 18 tips para mejorar la medición web

Qué permiten los informes multidispositivo

Las funciones y los informes de Google Signals te permiten mejorar tus esfuerzos generales de marketing digital a través de la visualización de distintos datos:

Conocer la superposición de usos de dispositivos

¿Qué porcentaje de usuarios accede a tu contenido desde múltiples dispositivos? Esta característica te proporcionará información inmediata sobre cómo las personas interactúan con tu marca.

Puedes ver el porcentaje de usuarios que acceden a cada dispositivo y el porcentaje que usa múltiples funciones.

Con esta información, puedes crear campañas para determinados dispositivos o impulsar los esfuerzos de una campaña concreta en un terminal.

Visualizar qué campañas tienen la mayor superposición

Uno de los mayores problemas que tienen los especialistas en marketing es el seguimiento de las conversiones que llevaron a los consumidores a comprar, pero no fueron necesariamente de primer o último click.

Los informes multidispositivo pueden evitar que las marcas corten ciertos canales y pierdan una parte importante del Customer Journey solo porque no generan ventas inmediatas.

Recuperar clientes con Remarketing en múltiples dispositivos

Mueve a los usuarios a través del embudo de ventas con remarketing en diferentes dispositivos.

Por ejemplo, un usuario que visita tu web desde el teléfono y navega por varias páginas y después se desconecta.

Puedes hacer remarketing para llevarlo de nuevo a tu web desde un dispositivo de escritorio, cuando el usuario está más concentrado y listo para realizar una compra, convirtiendo a un cliente del top-middle of the funnel a bottom of the funnel.

Aprender cómo se comportan determinados Buyer Personas

Debido a que los datos recopilados de Google Signals se basan en el usuario y no en la sesión, puedes comprender mejor cómo se comportan tus audiencias. Esto, junto con mejores informes demográficos y de intereses, te permite alinear diferentes patrones de comportamiento con diferentes perfiles.

Las marcas pueden crear campañas para audiencias específicas en función de su comportamiento y cambiar las campañas en función de la respuesta de la audiencia.

Por ejemplo, una marca podría crear una campaña de remarketing en dispositivos cruzados para audiencias que prefieren usar sus ordenadores para realizar compras.

Centraliza tus datos y visualízalos fácilmente

Si bien Google Signals es una herramienta valiosa para explorar mejor a tu público y su comportamiento, es solo una parte de tu ecosistema de datos.

La gran mayoría de los vendedores tiene un proceso de analítica y configuración de datos desarticulado. Cada canal de marketing individual tiene sus propios informes y datos.

En VIVA! Conversion queremos ir un paso más allá. Trabajamos para aumentar la madurez de tus datos y trabajamos la Analítica Web para unificar los datos en una plataforma que te permita obtener una fuente de información centralizada en la que basar tus decisiones.

Contáctanos para saber cómo puedes mejorar tu análisis de datos web o echa un vistazo a este post para profundizar en este tema.

Table of Contents

Actualizate ya a la Etiqueta global de Google Ads

Dani Robledillo

¿Por qué hemos de implementar la etiqueta global?

Safari anunció en Junio que a finales de este mes se va a implementar el sistema Intelligent Tracking Prevention 2.0 (ITP). ITP es una característica de privacidad que en esta nueva versión va a actuar sobre las cookies para proteger la privacidad del usuario.

En la versión anterior de ITP, las cookies de terceros se mantenían en el sistema por 24 horas por lo que aún era posible medir ciertas conversiones si no llegaban a pasar 24 horas.

En esta versión 2.0, la característica de las 24 horas ha sido eliminada y ya no se van a guardar cookies de terceros. Esto implica que todas las conversiones que se utilizaban con este tipo de cookies van a dejar de funcionar.

Este cambio es un paso hacia la prevención de cualquier intrusión en la privacidad de los clientes y les permite saber cómo y cuándo se les hace un seguimiento.

En lo que respecta a Google Ads, la solución es utilizar cookies propias en el sitio web y para ello necesita implementar la etiqueta global en el sitio.

Ventajas que nos ofrece la nueva etiqueta

Se adapta a cambios: Mejor equipadas para manejar cambios en el ecosistema de medición. Aprovecha las últimas prestaciones e integraciones en cuanto estén disponibles.

Correcta medición de conversiones: Cambios en el comportamiento del usuario y las preferencias en el navegador han hecho difícil el medir conversiones correctamente usando cookies de terceros. Las etiquetas globales de sitio permiten tener una medición correcta usando cookies propias.

Fácil integración: La etiqueta global del sitio y Google tag manager proveen una experiencia mejorada de etiquetación y habilitan una integración rápida y sencilla con Google Ads, Floodlight en Search Ads 360, Display y Video 360, Campaign Manager, y Google Analytics.

¿Cómo realizar el cambio?

Si aún no has actualizado tu etiqueta del sitio web, aquí te indicamos cómo realizar el cambio de manera sencilla.

Hay dos formas de integrar una etiqueta de conversión. A través de código o mediante el uso de Google Tag Manager.

Mediante código

En este caso vamos a tener que insertar 2 etiquetas, una es la etiqueta global y la otra la que va a medir las conversiones.

La etiqueta global deberemos incluirla entre las etiquetas <head></head> de todas las páginas del sitio web.

<!-- Global site tag (gtag.js) - Google Ads: XXXXXX-->

<script async src="https://www.googletagmanager.com/gtag/js?id=AW-XXXXXX"></script>

<script>

  window.dataLayer = window.dataLayer || [];

  function gtag(){dataLayer.push(arguments);}

  gtag('js', new Date());

  gtag('config', 'AW-XXXXXX');

</script>

Una vez incluida esta etiqueta, deberemos incluir la etiqueta de conversión en el momento de realizar la conversión. Esta etiqueta deberá incluirse entre las etiquetas <head></head> y debajo de la etiqueta global que acabamos de incluir.

<!-- Event snippet for conversion page -->

<script>

  gtag('event', 'conversion', {'send_to': 'AW-XXXXXX/XXXXXXXX-XXXX'});

</script>

Mediante Google Tag Manager

Si hacemos uso de Google Tag Manager la integración es más sencilla, primero deberemos incluir la etiqueta de conversión en el momento de la conversión, como se hacía anteriormente. Simplemente le debemos indicar el ID y Etiqueta de conversión.

Una vez tengamos la conversión creada, debemos agregar la etiqueta de Vinculación de conversiones. Esta etiqueta no necesita ser configurada, simplemente la integramos en todas las páginas y listo.

Si no sabes como se utiliza Google Tag Manager y quieres empezar a usarlo, aquí te explicamos su funcionamiento.

Bonus: Unir etiqueta global de Google Analytics con Google Ads

Si tienes la etiqueta global que proporciona Google Analytics insertada mediante código, es necesario que la modifiques para integrar también el funcionamiento de Google Ads y así evitar duplicar el código de la etiqueta global.

La etiqueta global que proporciona analytics es practicamente identica a la de Google Ads, solamente debemos indicarle a esa etiqueta que también sea utilizada para una cuenta específica de Google Ads.

Esta es la etiqueta que proporciona Google Analytics.

<!-- Global site tag (gtag.js) - Google Analytics --> 

<script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script>

 <script>   window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'GA_TRACKING_ID'); </script>

Lo que debemos hacer es incluir el siguiente fragmento de código a esta etiqueta:

gtag('config','AW-CONVERSION_ID');

Por lo que la etiqueta final debería quedar de la siguiente manera.

<!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script> 
<script>   window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} 
gtag('js', new Date()); gtag('config', 'GA_TRACKING_ID'); gtag('config','AW-CONVERSION_ID');
  </script>

Es posible que con el tiempo estas medidas sean adoptadas por navegadores o aplicaciones basadas en webkit, ya que webkit es el motor del navegador de safari y el que ha desarrollado el sistema ITP.

Desde Viva, te recomendamos que si no tienes ya actualizada tu etiqueta de Google Ads, lo hagas lo antes posible.

Table of Contents

5 formulas útiles para tu spreadsheet

Dani Robledillo

Función ArrayFormula

Con esta función vamos a conseguir que los resultados devueltos de una función, sean convertidos a un array o matriz. Si por ejemplo tenemos una columna que es el resultado de una operación entre otra dos, añadimos esta función en la primera celda y el resultado se aplicará para todo el rango que seleccionemos.

=arrayformula(A2:A6/B2:B6)

En este ejemplo vamos a realizar una división entre dos columnas, solo hará falta realizar la división en una celda y automáticamente el resultado se expandirá por toda la columna.

Es muy útil para utilizar con diferentes funciones, podemos realizar un vlookup una única vez y que se replique en toda la columna evitando así tener que estar periódicamente expandiendo la función.

Función Vlookup

Esta función es de sobras conocida. Nos permite realizar una búsqueda de un dato mediante dos índices de diferentes fuentes, y en caso de coincidir, obtener el valor que buscábamos.

En este ejemplo nuestros índices serán las fechas y cuando estos coinciden, obtendremos el valor numérico asociado a esa fecha.

=Vlookup(A2:A; D2:E; 2; FALSE)

En el primer parámetro de la función (A2:A), indicamos el índice de la primera fuente de datos.

En el segundo parámetro (D2:E), indicamos el rango de la fuente que queramos obtener los datos donde la primera columna será el índice, en este caso el índice corresponde a la columna D.

En el tercer parámetro indicamos el número de la columna del dato que queremos obtener. En nuestro caso corresponde al número dos, ya que el número 1 corresponde a la columna D, el 2 a la E y así sucesivamente.

En el último parámetro indicamos si la fuente de datos donde vamos a obtener información está ordenada o no. Si le indicamos que está ordenada y no encuentra el valor del índice, entonces nos devolverá el resultado más próximo al índice que le corresponde. Por el contrario si le indicamos que no está ordenado y no encuentra un resultado, nos devolverá un error.

Función Query

Esta función se asemeja a lo que puede ser una consulta SQL. Nos va a permitir realizar una consulta a un conjunto de columnas y manipular los datos devueltos. Esta función es muy útil para fusionar diferentes fuentes de datos.

Como ejemplo tenemos dos fuentes de datos. En una hoja tenemos datos de adwords y en la otra tenemos datos de bing ads. Lo que vamos a hacer es fusionar estas dos fuentes de datos mediante la función query.

=QUERY({'Hoja 1'!A:C;'Hoja 2'!A:C}; "select Col1, Col2, sum(Col3) where Col2 is not null group by Col1, Col2"; -1)

En el primer parámetro seleccionamos las fuentes de datos, en nuestro caso hemos seleccionado las dos fuentes de datos que tenemos.

En el segundo parámetro indicamos la query, tener conocimientos de SQL hará mas fácil entender este apartado. Lo que hemos indicado es que seleccione las 3 columnas de datos y que las agrupe por las dos primeras columnas.

Como tenemos dos fuentes de datos, indicamos las columnas con el tag Colx (la x indica el número de columna). Si solo tuviéramos una fuente de datos podemos indicar las columnas por letra (A, B, C..).

En el último parámetro indicamos la cabecera que vamos a querer. Si indicamos un -1 tomará por defecto las cabeceras de las fuentes. En la fórmula solo he indicado el label de la tercera columna que es el coste, las demás columnas las tomará automáticamente de las cabeceras de los datos.

Función Regexmatch

Con esta función, vamos a poder saber si existe un texto determinado dentro de una celda. Funciona mediante expresiones regulares por lo que convierte a esta función en una herramienta muy potente.

=REGEXMATCH(A:A; ".*Fb|Face.*")

Esta función sólo tiene dos parámetros, en el primero indicamos la celda en al que vamos a buscar y en el segundo indicamos la expresión regular.

En este caso estoy viendo que en la columna A exista el valor Fb o Face.

Esta función resulta muy útil cuando queremos hacer condicionales junto a la función IF. Podemos ver si en una celda existe un texto, y en caso de ser verdadero realizar una acción diferente.

=IF(REGEXMATCH(A:A; ".*Fb|Face.*");"Es Facebook";"No es Facebook")

Utilizando el ejemplo anterior, vemos que con un IF ya podemos indicar el resultado

Funciones de Fecha

Si tenemos una fuente de datos diaria, vamos a poder crear fácilmente una columna que indique el mes, semana o año para poder filtrar después por estas columnas.

En el caso de querer obtener el año y el mes, tenemos una fórmula muy sencilla que nos va a permitir realizar dicha acción.

=TEXT(A:A; "YYYYMM")

Con la función text podemos cambiar el formato del resultado, por lo que en el primer parámetro indicamos la celda con la fecha, y en el segundo el formato que queremos obtener.

Para el caso de obtener el año y la semana, tenemos la siguiente fórmula.

=YEAR(A:A)&WEEKNUM(A:A; 21)

En este caso nos encontramos con la función YEAR que nos va a indicar el año de una fecha y con la función weeknum que nos va a indicar la semana de una fecha.

En el segundo parámetro de weeknum indicamos el tipo de semana con el formato para España. Para ello debemos obtener las semanas en ISO 8601/European. Esto se consigue utilizando el numero 21 en la función.

Table of Contents

Importar costes en Google Analytics

Dani Robledillo

Esta nueva función nos permite tener una visión general de todas nuestras campañas desde una única plataforma como es Google Analytics. Además, también podemos importar las impresiones y los clics de dichas campañas. Todos estos datos se agrupan por la dimensión fuente/medio. Así, vamos a ver paso a paso cómo se pueden importar costes en Google Analytics.

Obtener el esquema

Para empezar importando los costes, necesitamos obtener la plantilla que nos va a proporcionar Google Analytics, en la que vamos a añadir los datos para posteriormente subirlos y así poder visualizarlos.

Para ello nos dirigimos a la cuenta de Google Analytics y vamos a Administrar – Importación de Datos. Una vez en esta vista, hacemos clic en Crear.

En este apartado debemos indicar qué tipo de datos queremos importar. En este caso vamos a seleccionar la última opción que se denomina Datos de costes.

Al hacer clic en continuar, debemos indicar un nombre para poder identificarlo posteriormente y además seleccionar la vista en la que vamos a querer ver la información.

En el último paso debemos indicar que métricas queremos importar. Obligatoriamente deberemos indicar la fecha, el medio y la fuente. Como métricas debemos indicar una como mínimo, que pueden ser clics, coste o impresiones.

Además vamos a poder indicar más de 10 métricas para seleccionar de manera opcional.

Por último, debemos indicar qué comportamiento vamos a querer utilizar tras la importación de los datos. Tenemos dos opciones:

- Suma: Marcada por defecto, en el caso de encontrar datos con la misma fecha y fuente, sumará los datos.

Sobrescribir: En el caso de encontrar datos con la misma fecha y fuente, reemplazará los datos nuevos por los antiguos.

Una vez finalizado debemos obtener el esquema donde indicaremos los datos que queramos importar.

Para ello veremos dos botones al finalizar:

- Obtener el esquema: Al pulsar este botón, se abrirá un modal donde nos indicará las cabeceras necesarias para incluir en un fichero CSV, o bien podremos descargar directamente la plantilla.

Obtener un ID (para la API): Esta opción nos proporcionará un identificador para poder utilizarlo con la API de Analytics. En este post podéis encontrar la información para hacer uso de esta opción.

Escribiendo los datos

Para subir los datos, debemos subirlos en un fichero CSV delimitado por comas. La opción más cómoda es escribir los datos en un Excel o en un Spreadsheet de Google y posteriormente transformarlo a CSV.

Lo que debemos hacer es indicar en la primera fila las cabeceras del tipo de dato que queremos indicar.

Los datos deberían quedar como en la foto siguiente:

Una vez hemos indicado los datos correctamente, debemos exportarlo como un fichero CSV separado por comas. En mi caso utilizo Google Spreadsheets ya que con Microsoft Excel he tenido varios problemas a la hora de importar el fichero.

Importando los costes

Para importar el fichero que hemos generado con los datos de costes, debemos acceder al menú de importación de datos de Google Analytics y en el tipo de importación que acabamos de crear, hacer clic en Administrar subidas.

Dentro de este apartado debemos hacer clic en el botón de subir archivo y seleccionar el CSV que hemos creado anteriormente.

Analytics revisará el fichero y si encuentra algún error nos lo indicará. En caso de estar todo correcto empezará a importar los datos.

Los datos tardan varias horas hasta que los podamos visualizarlos.

Visualizando los costes

Para visualizar los datos vamos a crear un informe personalizado que contenga las métricas que hemos subido en el fichero.

Para ello vamos al apartado de personalización de Analytics y dentro vamos a Informes personalizados.

Por último le debemos indicar la vista de la que vamos a querer ver los datos.

En mi caso, he seleccionado Fuente/Medio como dimensión y Coste, Clics e Impresiones como métricas.

Ahora ya tenemos una tabla donde vamos a poder ver todos los costes de nuestras fuentes de marketing.

Table of Contents

¿Qué son las webs desarrolladas en AMP?

Dani Robledillo

El objetivo de AMP es lograr que todas las páginas funcionen de la misma manera en todos los dispositivos móviles, dando la mejor experiencia posible a los usuarios (se conecten desde donde se conecten).

AMP crea páginas muy ligeras que simplifica todos sus contenidos y componentes a nivel de código para que sea muy sencillo cargarlas. Este tipo de webs están pensadas para portales de noticias, donde todo es contenido estático y lo que interesa es cargar todo este contenido lo más rápido posible.

¿Qué ventajas nos ofrece la versión web en AMP?

La principal ventaja de las webs desarrolladas en AMP reside en su velocidad de carga. Al estar desarrolladas bajo todo un entorno de google el contenido se ofrece a una velocidad muy alta.

A la hora de desarrollar estas páginas tenemos la ayuda de la consola, que nos va a facilitar todos los errores que vayamos cometiendo en el desarrollo. Para activar este “modo debug” basta con incluir el siguiente hash en la url #development=1. Si la web está bien construida con los formatos válidos de AMP entonces nos notificara por consola que está todo correctamente.

Al estar desarrollada bajo todo el manto de Google hace que el desarrollo se simplifique y de esa forma se gana la velocidad de navegación.

Los usuarios agradecerán que la web sea rápida, pero más lo agradecerán sus datos móviles. Y es que, al ser una web más simplificada, el tamaño de la web se reduce.

El desarrollo de AMP se va actualizando constantemente, y si en un principio no podíamos tener un simple formulario, ahora AMP ya acepta formularios y distintas funcionalidades para darle un toque mas dinámico a la web.

Para comenzar a desarrollar en AMP tenemos una web para desarrolladores donde podemos empezar.

¿Es todo bueno en las versiones AMP?

Como todo en la vida, nada es perfecto y las webs en AMP no iban a ser menos.

Casi todos los problemas en este tipo de webs vienen a la hora de desarrollarlas.

Todo parece muy bonito hasta que sientes que estás encerrado por Google y sus herramientas. Y esto ocurre porque Google no nos permite implementar ninguna herramienta ni código de terceros. Solamente vamos a poder implementar los tags y scripts que ellos tienen creados por defecto para AMP, por lo que si tenemos alguna funcionalidad algo más avanzada simplemente no vamos a poder realizarla.

El otro gran problema está en el diseño de la web. Cuando has terminado de desarrollar la web y vas a darle estilos con CSS de repente ves que has superado un límite de caracteres permitido por AMP para estilos, por lo que estás obligado a reducir estilos para mantenerte en el limite y asi tener una web AMP válida. El límite está en 50.000 caracteres que a priori puede parecer mucho, pero si quieres darle un toque mas alto de diseño lo mas probable es que lo superes.

Como he comentado antes, no podemos utilizar scripts de terceros y aquí tenemos un enorme problema en cuanto a SEM. Vamos a poder tener la oportunidad de utilizar las etiquetas de Adwords, Tag manager y Google Analytics sin ningún problema, pero no vamos a poder incluir ninguna etiqueta más de otra plataforma que no sea Google, ya que estas etiquetas están en javascript y AMP no permite el uso de la etiqueta <script>.

Como último inconveniente comentar que hay que tener mucho cuidado cuando los usuarios vayan a visitar la web desde el buscador de Google ya que puedes tener problemas con alguna funcionalidad.

Cuando nosotros estamos desarrollando la web en AMP vamos a tener nuestra URL como si de cualquier web se tratara, pero los usuarios que accedan a través del buscador van a estar encapsulados en un modo de vista para AMP y esto hay que tenerlo muy en cuenta ya que nos puede causar problemas. Si por ejemplo tenemos un formulario, vamos a tener que incluir las cabeceras de los servidores de Google en la página de destino, ya que al entrar en este modo vista previa necesitamos realizar un cross-domain entre nuestro servidor y el de Google.

Además, si accedemos a nuestra URL con parámetros personalizados (como los que añaden las campañas de adwords), no vamos a ser capaces de poder interceptar estos parámetros de ninguna manera.

¿Sustituye a las versiones móviles?

No directamente, ya que la versión móvil de tu web va a seguir estando en funcionamiento y disponible para el que acceda a tu web, pero cuando Google detecta que tienes una versión AMP de tu web y el usuario hace una búsqueda, se le indicara preferentemente la web en versión AMP.

Nosotros ya tenemos nuestro blog en versión AMP, te recomendamos que le pegues un vistazo 🙂

Table of Contents

Mediciones avanzadas en Google Analytics

Dani Robledillo

Eventos Personalizados

Los eventos son interacciones de una página web o una carga de pantalla. Las descargas, los clics en botones, las reproducciones de vídeo son todos ejemplos de acciones que un usuario puede realizar en una web y podemos tomarlas como eventos.

Existen dos formas de implementar esta característica.

A través de Tag Manager o a través de código mediante la librería de anaytics.js

Tag Manager

Implementar eventos través de Tag Manager es el método mas simple, lo más complicado es generar el trigger o activador necesario para poder medir el evento que queramos medir.

Primero debemos generar el activador, dependiendo de cómo este construida nuestra web podemos simplemente atacar a la clase html del botón mediante la variable Click Classes de Tag Manager.

Para poder utilizar estas variables ya predefinidas en Tag manager, deberemos acceder al menú de variables y en la configuración activar las variables que nosotros queramos.

Una vez activada la variable Click Classes debemos averiguar qué clase html tiene el botón que vamos a medir. Es recomendable tener cierto conocimiento sobre programación para poder encontrar el elemento que deseamos en el código HTML.

Para ello vamos a la web e inspeccionamos elemento con el botón derecho del ratón y localizamos el botón.

Ahora vamos a copiar una clase que sepamos que no se repite más en la web (al no ser que queramos medir todos los botones con una clase) para utilizarla en el activador.

Ya de vuelta en el activador le decimos que sea de tipo Clic en todos los elementos y que la variable Click Classes contiene la clase que hemos copiado anteriormente.

Ya solo nos queda realizar el evento en Analytics, generamos una nueva etiqueta de tipo Universal Analytics y le indicamos que el tipo de seguimiento va a ser de tipo Evento.

En los parámetros de los eventos podemos indicar el nombre que nosotros queramos para posteriormente identificarlo en Analytics. En este caso solo le he indicado categoría y la acción porque con esa información ya voy a poder reconocerlo fácilmente. Después le aplicamos la configuración de analytics y el activador creado anteriormente y ya lo tenemos todo listo.

Después de publicar o entrar en modo prueba, si hacemos clic al botón que hemos indicado y vamos a Analytics en la parte de eventos en tiempo real, veremos cómo registra un nuevo evento.

Si nos fijamos vemos que en categoría de evento y en la acción, aparece el nombre que le hemos indicado y así con los 4 parámetros que podemos configurar.

Esta información podremos visualizarla unas horas después en el menú de Analytics de Comportamiento – Eventos

Mediante código

Para implementar eventos directamente a través de código, debemos tener implementado el script de analytics.js.

Ya con el código implementado deberemos hacer que cuando el botón sea clicado se ejecute el siguiente código:

ga('send', { hitType: 'event', eventCategory: 'Categoria', eventAction: 'Accion', eventLabel: 'Etiqueta', eventValue: 'Valor' });

Una vez implementado ya podremos ver su funcionamiento en Analytics como está explicado anteriormente.

Para más información puedes consultar este enlace donde indican el completo funcionamiento.

Métricas y dimensiones personalizadas

Las dimensiones y métricas personalizadas son como las dimensiones y métricas predeterminadas de la cuenta de Analytics, salvo que las creas tu mismo. Se pueden utilizar para recopilar y analizar los datos de los que Analytics no realiza un seguimiento automáticamente.

Como punto negativo hay que indicar que tenemos un límite de dimensiones y métricas, vamos a poder crear 20 dimensiones y 20 métricas.

Para poder empezar a trabajar con estas métricas personalizadas, lo primero que debemos hacer es crear las métricas y dimensiones directamente desde analytics. Esta configuración la podemos realizar desde el panel de administración – Definiciones personalizadas

Creando Dimensiones Personalizadas

Desde el menú de Dimensiones Personalizadas seleccionamos el botón para crear una nueva dimensión.

En las dimensiones simplemente debemos indicar el nombre de la dimensión y el ámbito que deseemos. Es necesario tener conocimiento sobre como actúa cada ámbito:

Producto: El valor se aplica al producto para el que se ha configurado (solo comercio electrónico mejorado).
Hit: El valor se aplica al hit único para el que se ha establecido.
Sesión: El valor se aplica a todos los hits de una sesión.
Usuario: El valor se aplica a todos los hits en las sesiones actuales y futuras, hasta que cambie el valor o hasta que la dimensión personalizada pase a estar inactiva.

Para más información acerca de los ámbitos, en este enlace se puede consular su funcionamiento.

Una vez lo tenemos seleccionado, simplemente aceptamos. Ahora lo importante es fijarse en el índice que Analytics le asigna a cada dimensión creada, ya que gracias a este índice vamos a enviarle valores posteriormente.

Creando Métricas Personalizadas

Las métricas se crean de la misma manera que las dimensiones, accedemos al menú de métricas personalizadas y creamos una nueva métrica. A diferencia de las dimensiones aquí podemos asignar un valor máximo y uno mínimo. Ahora guardamos y veremos cómo se ha guardado la métrica con un índice proporcionado por Analytics.

Utilizando las métricas y dimensiones a través de Tag Manager

Para poder enviar valores desde Tag Manager a las métricas y dimensiones que se han creado en Analytics debemos utilizar la etiqueta de Universal Analytics que ya tenemos creada y desde la configuración indicar los valores a enviar. Tambien podemos utilizar las etiquetas de Eventos de Analytics para mandar información de métricas y dimensiones.

Para ello vamos a la etiqueta de Universal Analytics y en el desplegable de más opciones veremos Dimensiones personalizadas y Métricas personalizadas. En este apartado deberemos indicarle el índice y el valor que queramos.

También podemos utilizar la capa de datos (dataLayer) para obtener información dinámica desde la web y enviarla a las métricas y dimensiones.

Utilizando las métricas y dimensiones a través de Código

Para enviar información a métricas y dimensiones personalizadas directamente a través de código, debemos tener implementado el script de analytics.js.

Una vez tenemos el script implementado simplemente deberemos indicarle al código de analytics.js que se envíen datos de las métricas y dimensiones. El código que se debe utilizar es el siguiente:
ga('set', { 'dimension1': 'Valor', 'metric1': 'Valor' });
Para más información se puede consular la documentación

Visualizar los datos

Para visualizar las métricas y dimensiones, podemos crear un informe personalizado donde implementemos nuestras métricas y dimensiones. Para ello vamos al menú de Personalización – Informes personalizados y creamos un nuevo informe con las métricas y dimensiones que nosotros queramos.

En el ejemplo que se muestra a continuación muestro variables de todas las acciones que los usuarios han podido realizar en el formulario dimensionados por un identificador de sesión.

Table of Contents