Hoy vamos a ver qué son las pruebas A/B y, además, cómo hacer una de forma sencilla gracias a una herramienta de Google: Google Optimize.
¿Qué es una prueba A/B?
Una prueba A/B es simplemente un experimento con dos variantes. Imagina que posees una web, y tienes dudas sobre cómo funcionaría mejor algún elemento de la misma. Por ejemplo, hablemos de un supuesto botón de contactar. ¿La gente me contactará más si lo coloco en la cabecera o funcionará mejor si lo coloco en otro lado? Las pruebas A/B nos permiten tener dos versiones de nuestra página web y validar después cuál de las dos ha funcionado mejor.
<<Pero, Pedro, que un botón esté un poco más arriba o un poco más a la derecha no va a cambiar mucho las veces que hagan clic en él.>>
Te sorprenderías lo que puede hacer el cambio de un botón. Ya sea de lugar, ya sea de color, ya sea de texto… Al final, tu web no deja de ser una herramienta de marketing online y, como tal, trabaja con sensaciones y percepciones humanas. He visto casos en los que el simple cambio de un color ha provocado un 1000% de interacciones con los usuarios de la web.
¿Significa eso que tenemos que probar todo de todas las maneras que nos imaginemos? No, por supuesto que no. Pero sí significa que debemos hacer aquellas pruebas que, con criterio, merezcan la pena hacerse. ¿Y cuáles son esas pruebas? Pues depende de tu web y del comportamiento de tus usuarios. No hay una serie de pruebas predefinidas que siempre tengamos que hacer. Debemos estudiar cómo interactúan nuestros visitantes e indagar en aquellos lugares donde veamos que puede haber problemas o, simplemente, se pueden mejorar.
Por ejemplo, si vemos que nuestra página web tiene visitas pero que la gente no pincha en nuestro CTA (ese botón en el que queremos que pinche porque nos lleva al formulario de contacto, o porque nos apunta en la newsletter, o porque hace cualquier cosa que consideramos de valor para nosotros), deberíamos evaluar qué está fallando y realizar pruebas.
Pero no sólo estamos hablando de botones. Podemos hacer pruebas con cualquier elemento de la web e, incluso, con procesos enteros. Imagina lo que sería una compra en tu web, la cual puede tener de uno a tres pasos. A lo mejor quieres probar varias maneras en que se realiza este proceso para ver cuál funciona mejor con tus clientes.
O no sólo procesos, sino también páginas enteras. ¿Quieres que unos usuarios visiten una versión de tu landing page y otros una distinta, y después medir cómo se comportan en cada una? Esto es perfectamente posible con las pruebas A/B.
<<¿Pedro, sólo puedo probar dos alternativas? ¿Botón rojo y botón azul, por ejemplo?>>
No, puedes hacer test con todas las alternativas que quieras. Puedes hacer pruebas A/B/C/D… pero el problema es que llegar a conclusiones a través de varias hipótesis es más complejo y lleva mucho más tiempo. Por eso nos vamos a centrar hoy en un ejemplo sencillo de prueba A/B, con tan sólo dos variantes.
Concretamente, nuestra prueba va a consistir en cambiar un CTA de mi web a otro color. Concretamente, el botón que vamos a testear se encuentra en mi página de servicios de consultoría y podéis verlo a continuación (de color rojo):
¿Cómo realizar una prueba A/B?
Hay muchas maneras de realizar pruebas A/B (o test A/B), pero en este artículo vamos a usar Google Optimizer. ¿Por qué esta herramienta? Por una parte porque no es complicada de manejar y, por otra, porque está integrada con otras herramientas de Google que probablemente utilices, como Google Analytics.
Si tienes un CMS como WordPress es posible que te decantes por algún plugin para evitarte complicaciones, ya que suelen ser más fáciles de configurar que Google Optimize. Pero como no sé qué tipo de gestor de contenidos posees, con Google Optimize me aseguro de que tienes delante una opción que le vale a todo el mundo.
¿Qué necesitamos para usar Google Optimizer?
- Una cuenta de Google (Gmail).
- Una página web.
- Tener implementado Google Analytics en nuestra página web.
- Un navegador Google Chrome.
Si tenemos todo esto, tan sólo tendremos que seguir una serie de sencillos pasos para hacer nuestra primera prueba A/B.
Paso 1: crear cuenta en Google Optimizer
Con nuestra cuenta de Gmail asociada al Google Analytics de nuestra web, nos vamos a la web oficial de Google Optimize y le damos al botón Comenzar gratis.
Nos saldrá una pantalla de bienvenida. Le damos al botón Empezar.
Después Google nos preguntará si queremos que nos informe sobre consejos, anuncios, estudios de mercados, etc. Esto que cada uno ponga lo que considere conveniente:
Inmediatamente después tendremos que configurar la cuenta (puedes cambiar esto luego, si lo prefieres). Personalmente, de primeras marcaría las tres opciones que te dan por defecto, elegiría mi país en y aceptaría las condiciones:
Paso 2: configurar la cuenta
Bien, ya tenemos la cuenta. Vamos a configurarla. Lo primero es ir a la parte de configuración (arriba a la derecha) y desplegarla. Veremos que nos salen nuevas opciones. Lo que debemos hacer es vincular nuestra cuenta de Google Analytics con esta cuenta de Google Optimize. Para ello, tan sólo hemos de hacer clic en el botón Vincular con Analytics.
Nos saldrá un desplegable. En el mismo, tendremos que elegir la cuenta de GA de la web sobre la que queramos hacer experimentos.
Nota: si no te sale en el desplegable la cuenta de Analytics, es posible que el usuario de Google (Gmail) con el que estás dándote de alta en Google Optimize no sea el mismo que usaste para crear la cuenta de Google Analytics en tu web. Asegúrate de que el usuario elegido pueda meter mano en Analytics.
Paso 3: introducir código de Google Optimize en la web
Después, tenemos que integrar en nuestra web el código de Google Optimize. Este código, que nos viene en esta misma pantalla, ha de introducirse justo al principio de la etiqueta <HEAD> de nuestro sitio web.
El código te lo indica Google Optimize, y tendrá una forma parecida a la siguiente:
<script src="https://www.googleoptimize.com/optimize.js?id=OPT-XXXXXXX"></script>
Nota: si cuando instalaste Google Analytics, lo hiciste a través de Google Tag Manager, es mejor que pongas el código de Google Optimize siguiendo estas instrucciones.
Paso 4: instalar extensión de Chrome
Hemos de instalar en nuestro navegador Google Chrome la extensión oficial de Google que nos permitirá hacer las pruebas A/B.
Paso 5: empezar a configurar la prueba
Si hemos realizado los pasos de forma correcta, la cuenta ya está hecha y configurada. Nuestro site ya es capaz de realizar pruebas A/B. Ahora nos tocará crear las primeras pruebas. Para ello debemos darle al botón Empezar:
En esta nueva ventana, nos pedirán la url de la página en la que queremos realizar las pruebas A/B. La ponemos.
También se nos dará una serie de opciones:
- Prueba A/B: esta es uña que nos interesa ahora. Se trata de una variante en nuestra página.
- Prueba multivariable: esto son pruebas para varios elementos de forma simultánea para determinar qué combinación nos ofrece el mejor resultado.
- Prueba de redireccionamiento: nos permite probar páginas web independientes entre sí, identificando por url cada una.
- Personalización: crear pruebas diferentes según qué visitante esté acudiendo a nuestra página. Imagina que quieres hacer pruebas para, por ejemplo, los visitantes de tu página que vienen de Alemania, porque a ellos quieres ofrecerles un producto especial que puede ser de su interés. Esto podrías programarlo aquí.
A nosotros nos interesa la primera de las opciones: Prueba A/B.
Le damos al botón Crear y nos aparece una nueva pantalla. En esta debemos darle al botón Añadir Variante:
Ahora nos pedirá el nombre de la variante. En mi caso, la llamaré CTA -AZUL, puesto que voy a cambiar el color de un botón que es rojo a azul.
Una vez realizado esto, veremos que tenemos un listado de variantes en pantalla. Por una parte la página original, y por otra la variante que acabamos de denominar como CTA – AZUL:
Bien, tenemos una variante… si te fijas, puedes elegir el % de veces que quieres que se ejecute cada variante. Es decir, si dejas el 50%, Google tratará de mostrar la mitad de las veces el botón original y la otra mitad el botón azul. Yo, para la prueba, dejo ambas al 50%, pero tú debes actuar en base a tus pretensiones.
Aún no hemos hecho ningún cambio en mi página web. Sabemos que vamos a cambiar un botón de color, pero aún no lo hemos hecho ni sabemos cómo hay que abordarlo. Y aquí viene lo interesante: para hacer esto, tan sólo tenemos que ir a la variante CTA – AZUL y pinchar en el botón Editar que está a su derecha. Esto nos va a abrir nuestra página web (la que configuramos en pasos anteriores) con un selector de objetos que nos permitirá cambiar el contenido de nuestro site:
¿Has visto el panel de la derecha? Eso viene de la extensión de Google Chrome que hemos instalado antes. Si te fijas, nos permite cambiar muchas cosas, según el objeto en el que hayamos clic con el ratón. En mi caso, he marcado el botón rojo, y automáticamente me permiten cambiarle varias de sus propiedades.
Pero es más, si le damos al botón Editar elemento, se nos abren varias opciones de mucha utilidad:
- Quitar: hacer que no se vea, eliminarlo.
- Editar texto: cambiarle el texto por otro.
- Editar HTML: con esto ahí podríamos hacer cualquier viguería.
- Insertar HTML: idem al anterior.
- Ejecutar javascript: podemos incluso ejecutar código específicamente para esta variante CTA – AZUL.
Sin embargo, yo me voy a conformar con ir al formulario y simplemente cambiar el color del botón a un azul oscuro:
Después, cuando el botón esté a mi gusto, voy a ir a la parte superior derecha de la página y voy a guardar esta variante:
Después le daré al botón Listo y, automáticamente, volveré a Google Optimize.
Paso 6: crear objetivo para la prueba
Tenemos la prueba casi hecha. Pero tenemos que marcar un objetivo para saber qué grado de éxito tiene la misma. Google sabe que tiene que mostrar el botón algunas veces de color rojo y otras veces de color azul, pero esto, por sí mismo no sirve de nada si no sabemos qué hay que medir. Por ello tenemos que crear un objetivo.
Aquí hay dos formas de hacerlo: creando el objetivo aquí mismo, en Google Optimize, o haciéndolo en Google Analytics. Recomiendo hacerlo en GA, sin duda, pues nos vendrá de perlas para tenerlo controlado.
En nuestro ejemplo, el objetivo era que pincharan en el botón (ya fuera azul, ya fuera rojo) para saber cuál de los dos botones invitaba mejor a hacer clic sobre él. Así que nos vamos a Google Analytics y abrimos la cuenta del site donde queremos hacer esta prueba A/B.
Después, le damos a Administrar –> Objetivos:
Le damos a Nuevo objetivo y lo configuramos. Para ello, primero le decimos que va a ser de tipo Personalizar:
Luego, le damos a Continuar y le indicamos el nombre y que va a ser de tipo Destino.
Después sólo queda indicarle qué destino queremos medir (aquel al que rediría nuestro botón), por lo que lo hacemos tal cual muestra la siguiente pantalla (en tu caso, tendrás que poner la url de tu página de destino):
Como queremos asegurarnos de que se llega a la página de contacto, pero que, además, se está haciendo desde mi landing de consultoría, al objetivo le añadimos un embudo de conversión de la siguiente manera:
Nota: en mi caso hago un embudo de conversión porque en mi web hay otros lugares desde los cuales se puede llegar a la página de contacto. Yo quiero medir sólo las veces que se llega desde la landing de consultoría (la que tiene el botón rojo/azul). En tu caso tendrás que plantear un objetivo acorde a tu site.
Guardamos y ya podemos volver a Google Optimize. Allí podremos añadir un objetivo, sólo tenemos que ir a la sección Medición y Objetivos y hacer clic sobre Añadir objetivo.
Seleccionamos la opción Elegir uno de la lista y nos dará un listado de todos los objetivos que tenemos en Google Analytics. Tan sólo tenemos que escoger aquel que nos acabamos de crear.
Y ya está, por fin lo tenemos. Si queremos iniciar la prueba, tan sólo tenemos que darle al botón iniciar que está en la parte superior de Google Optimize. Desde ese momento, tan sólo nos queda esperar a recabar resultados (recordad, que Google Analytics tarda 24 horas en mostrar datos, por lo que los primeros resultados no los veréis hasta pasados un día o dos).
Nota: si ves que tu página parpadea desde que has implementado Google Optimize, sigue estas recomendaciones de Google para evitarlo.
Espero que el artículo haya sido de tu interés. ¡Como siempre, nos leemos en el siguiente!