A/B testing, multivariate testing, usabilidad, analítica web… ¿Qué es todo eso?

WordPress hace algún tiempo que dejó de ser un simple gestor de blogs y gracias a su versatilidad, a su optimización SEO y a sus infinitos plugins para aumentar sus posibilidades es el CMS preferido por bloggers y empresas.

De la mano de FutureNow y Content Robot, nos llega otro plugin para WordPress que nos permitirá introducir el control script, el tracking script i el conversion script sin tener que tocar el código del template.

Instalación

  1. Descargarse el Google Website Optimizer plugin
  2. Extraer la carpeta “google-website-optimizer-for-wordpress” y subirla en el directorio wp-content/plugins.
  3. Activar el plugin llamado “Google Website Optimizer for WordPress” en el panel de WordPress.
  4. Desactivar el editor WYSIWYG en el apartado de opciones de WordPress.

Para utilizarlo simplemente tenéis que rellenar el apartado de “custom fields” de vuestros artículos o páginas como os detallo a continuación:

En la página de test pondremos:

  • key: go_control_script    value: Control script proporcionado por GWO.
  • key: go_tracking_script_test    value: Tracking script proporcionado por GWO.
  • Deberemos marcar tambien todas nuestras zonas a modificar colocandolas ente las etiquetas <script> y </noscript>.

Si todo esto os suena a chino podeis leer el tutorial “Tu primer experimento en Google Website Optimizer paso a paso” :)

En la página de conversión pondremos:

  • key: go_tracking_script_conversion    value: Conversion script proporcionado por GWO.

Listo! Ya podemos volver a GWO, validar nuestras páginas y empezar a realizar variaciones.

El Kiosco de WebAnalytics

Hoy mismo (hace un rato en realidad) hemos creado el Kiosco de WebAnalytics.es. La idea es aglutinar, en la medida de lo posible, todas aquellas noticias y artículos que tengan relación con la analítica web.

Es un sistema al estilo de digg o meneame en el que se pueden votar y comentar vuestras noticias favoritas.

Desde aquí os invito a que publiqueis vuestras noticias o aquellas que encontreis que sean de interés para compartirlas con todo el mundo.

Calculadora de ratios de conversión

Esta calculadora os permitirá ver de forma cuantificada cuanta pasta podéis llegar a obtener mejorando el ratio de conversión :D

Introduce tus visitas y ventas actuales y juega a deslizar la barra de la tasa de conversión.

Conversion Rate Calculator

Hay algunas, por no decir muchas veces en el que un sitio web tiene diferentes subdominios. Microsites, carritos de compra, reservas o procesos particulares suelen tener su subdominio propio.

¿Podemos utilizar Google Website Optimizer para realizar experimentos entre ellos?

Esta suele ser una pregunta bastante recurrente y la respuesta es sí, sin ningún problema.

Para ello deberemos realizar unas pequeñas modificaciones en los códigos de GWO de nuestras páginas:

  1. Deberemos añadir _udn=”nuestrodominio.es”; en el tracking script (el que se coloca justo antes de la etiqueta </body>) de las páginas de prueba y conversión, de modo que el código nos quede de la siguiente manera:
    <script>
    _uacct='UA-XXXXXX-X';
    _udn=”nuestrodominio.es”
    urchinTracker(”/xxxxxxxxxx/xxxx”)
    </script>

  2. En la página en la que realizamos el testeo deberemos añadir estas líneas justo antes del control script (el que se coloca en el header)
    <script>
    _udn=”nuestrodomino.es”
    </script>

    <script>
    function utmx_section(){}function utmx(){}
    (function(){var k=’0151221625′,d=document,l=d.location,c=d.cookie;function f(n){
    if(c){var i=c.indexOf(n+’=’);if(i>-1){var j=c.indexOf(’;’,i);return c.substring(i+n.
    length+1,j<0?c.length:j)}}}var x=f(’__utmx’),xx=f(’__utmxx’),h=l.hash;
    d.write(’<sc’+’ript src=”‘+
    ‘http’+(l.protocol==’https:’?’s://ssl’:’://www’)+’.google-analytics.com’
    +’/siteopt.js?v=1&utmxkey=’+k+’&utmx=’+(x?x:”)+’&utmxx=’+(xx?xx:”)+’&utmxtime=’
    +new Date().valueOf()+(h?’&utmxhash=’+escape(h.substr(1)):”)+
    ‘” type=”text/javascript” charset=”utf-8?></sc’+’ript>’)})();
    </script>

Añadiendo estas pequeñas modificaciones permitiremos a GWO que compruebe que el formato de las secuencias de comandos sea la correcta y poder testear normalmente.

Este viernes 25 de Julio Pere Rovira va a impartir un curso de Google Analytics de 4 horas en Barcelona.

¡Quedan ya muy poquitas plazas!

Si os interesa apuntaros, poneros en contacto con el Instituto Internacional de Marketing, con quien organizamos el curso.

  • Nombre de la persona de contacto: Hakima Castro
  • Email: hakima@internacionaldemarketing.com
  • Tel: 902 884 206

También os podéis poner en contacto para información sobre futuros cursos.

Últimamente he tenido algunos problemas de visualización en el blog y esta mañana he decidido investigar como ven mis usuarios el blog en función del navegador que usan.

Por un momento he pensado en el horrible trabajo de comprobar uno a uno todos los navegadores que conozco así que he dedicado eso tiempo a ver si podía realizar ese trabajo más cómodamente.

Como no, en internet uno encuentra casi siempre lo que busca y para el caso que nos ocupa existe Browsershots.

Esta fantástica herramienta gratuita te permite visualizar tu web (o la que quieras) en hasta 65 combinaciones posibles de sistemas operativos y navegadores. Todo tan fácil como introducir la URL.

Dada la multitud de posibilidades a escoger y el tiempo de procesado que requiere, personalmente aconsejo darle un vistazo al Google Analytics, SiteCatalyst, Indextools o la herramienta de medición que se tenga para chequear aquellos navegadores, sistemas operativos, resoluciones y otras características que utilizan nuestros usuarios. Aún así, no deja de ser curioso darse una vuelta por la totalidad de posibilidades y ver como nos ven.

El único detalle a comentar es que sólo disponemos de 30 minutos para generar las imágenes, de modo que si queremos ver todas las capturas tendremos que estar al loro e ir pulsando “extend” de vez en cuando.

El último paso después de generar todas las variaciones de nuestros elementos es la pantalla que os muestro a continuación:

En esta página simplemente se nos muestra información referente a las páginas de testeo y conversión (urls y vista previa de las combinaciones) y se nos permite definir la cantidad de tráfico que se dirigirá a la prueba.

Podemos escoger el % de tráfico que creamos oportuno, aunque el 10%, 25%, 50%, 75% y 100% ya vienen predefinidos. El volumen de tráfico deberemos escogerlo según nuestro modelo de negocio, el tráfico que llega a nuestra web, el revenue que generamos, la agresividad de nuestros cambios, etc… Cada sitio web tiene sus particularidades aunque por norma general, y siempre que tu sitio web tenga un volumen de tráfico elevado, podemos aplicar cambios alrededor del 20% de la gente que nos visita siendo ésta una buena muestra para el total de nuestros usuarios. Aún así, insisto en que cada web y sus cambios planteados son escenarios distintos.

Después de esto ya lo tendremos todo listo. Guardamos los cambios y el testeo pasará a ejecutar-se y a recopilar datos… y un poco de paciencia! Que a los dos días aún no tendremos resultados :)

Ir a:

< Anterior paso

¡Por fin nos disponemos a crear variaciones de nuestra página!

El proceso continua siendo muy simple aunque aqui tendrás que tener unas mínimas nociones de html para poder modificar el código. Aun así modificar imágenes, textos, botones u otros elementos básicos resulta muy sencillo, asi que no hay que alarmarse.

En nuestro experimento de iniciación proponíamos comprobar distintas versiones de textos en la pestaña “About” para ver cual de ellas nos proporcionaba un mejor click throught hacia esa página.

En el paso anterior lo que hemos hecho ha sido identificar todas aquellas zonas de las que queríamos hacer modificaciones mediante la inclusión de unos tags javascript en el código de la página. En este paso, Google Website Optimizer detecta esas zonas y nos permite modificar los trozos de código a nuestro antojo sin preucuparnos del archivo original. Google es quien guarda, gestiona y sirve las modificaciones.

Los pasos a seguir son bien simples:

  1. Hacemos click en “Añadir variaciones nuevas”
  2. Nos aparece una ventana en la que le daremos un nombre a la variación
  3. Modificamos el código como nos parezca
  4. Le damos al botón “Guardar”

Tan simple como eso. Generaremos tantas variaciones de nuestras zonas como queramos y Optimizer se encargara de hacer todas las combinaciones posibles entre ellas. También disponemos de la posibilidad de ver las combinaciones que estamos creando pulsando en “Vista previa”.

A continuación os adjunto un pequeño video que he creado a modo de ejemplo:

Cuando hayamos terminado el trabajo, pulsamos el botón “Guardar y continuar” situado en la parte inferior y nos dirigiremos al 4º y último paso antes de poner en marcha el test.

Ir a:

< Anterior paso

Siguiente paso >

A través del blog de Javier Godoy descubro una herramienta que permite ver que sitios web están realizando multivariate testing así como las zonas que se estan probando.

MVT Vendor Detector es un script para el pluguin Greasemonkey de Firefox que es totalmente compatible con la reciente versión 3 del navegador.

Cada vez que visitamos una página web que esta realizando un testeo multivariante, nos aparece un alert en la esquina superior izquierda de nuestra pantalla y nos resalta las zonas en las que se está testeando contenido.

Es capaz de detectar tags javascript de Google Website Optimizer, Offermatica (Omniture Test&Target) y Optimost por citar algunos ejemplos.

Será genial ir comprobado como avanzan estas técnicas en el mercado.

El script puedes conseguirlo aquí.

Si no dispones del plugin Greasemonkey puedes descargarlo aquí.

Gracias Javier!

Bravo ya estamos a punto de empezar a poner tags en nuestro código y a ralizar modificaciones… La parte más agradable para unos y la más odiada para otros.

A aquellos que al ver una línea de código os coge urticaria deciros que calma, es fácilisimo ;) Google Optimizer nos presenta una página donde nos da los codigos a inserir y explica paso a paso que tenemos que hacer:

  1. En la página donde realizaremos las pruebas: Tenemos que colocar el código de control en cualquier lugar entre las etiquetas <head>…</head>. Este código se encarga de conectar con los servidores de Google, recoger las variaciones creadas y servir una (si, aún no hemos creado las variaciones, ya llegaremos ahi jeje). Os tiene que quedar algo parecido a esto:
    <head>
    …
    <script>
    function utmx_section(){}function utmx(){}
    (function(){var k=’0151221625′,d=document,l=d.location,c=d.cookie;function f(n){
    if(c){var i=c.indexOf(n+’=');if(i>-1){var j=c.indexOf(’;',i);return c.substring(i+n.
    length+1,j<0?c.length:j)}}}var x=f(’__utmx’),xx=f(’__utmxx’),h=l.hash;
    d.write(’<sc’+'ript src=”‘+
    ‘http’+(l.protocol==’https:’?’s://ssl’:'://www’)+’.google-analytics.com’
    +’/siteopt.js?v=1&utmxkey=’+k+’&utmx=’+(x?x:”)+’&utmxx=’+(xx?xx:”)+’&utmxtime=’
    +new Date().valueOf()+(h?’&utmxhash=’+escape(h.substr(1)):”)+
    ‘” type=”text/javascript” charset=”utf-8″></sc’+'ript>’)})();
    </script>
    </head>

    También es necesario un codigo de seguimiento para trackear los resultados del experimento. En este caso debemos colocarlo justo antes de la etiqueta </body>.

    …
    <script>
    if(typeof(urchinTracker)!=’function’)document.write(’<sc’+'ript src=”‘+
    ‘http’+(document.location.protocol==’https:’?’s://ssl’:'://www’)+
    ‘.google-analytics.com/urchin.js’+'”></sc’+'ript>’)
    </script>
    <script>
    _uacct = ‘XX-XXXXXXX-X’;
    urchinTracker(”/0151221625/test”);
    </script>
    </body>

    Sólo nos falta detectar las zonas a modificar. Para ello las encerraremos dentro del siguiente tag, <script>utmx_section(”Nombre del elemento”)</script>CODIGO</noscript>. En nuestro ejemplo nos quedaría el código de la siguiente manera:

    <script>utmx_section(”Pestaña About”)</script>
    <a title=”About href=”http://www.trucosoptimizacion.com/index.php/about/>About</a>
    </noscript>

    La idea consiste en “marcar” todas aquellas zonas de las que luego queremos realizar modificaciones. Ahora no realizamos ningún tipo de cambio, simplemente le estamos diciendo a Google Optimizer que elementos luego modificaremos

  2. En la página de conversión: Aquí debemos colocar otro tracker que se nos proporciona a fin de hacer seguimiento de cuales son las versiones que han derivado en una conversión o consecución de objetivo. Del mismo modo que el tracker de la página de testeo, debemos colocarlo justo antes de la etiqueta </body>
    <script>
    if(typeof(urchinTracker)!=’function’)document.write(’<sc’+'ript src=”‘+
    ‘http’+(document.location.protocol==’https:’?’s://ssl’:'://www’)+
    ‘.google-analytics.com/urchin.js’+'”></sc’+'ript>’)
    </script>
    <script>
    _uacct = ‘XX-XXXXXXX-X’;
    urchinTracker(”/0151221625/goal”);
    </script>
    </body>

    Ya tenemos el experimento configurado… Empecemos a crear variaciones!

    < Anterior paso

    Siguiente paso >

 
 

About Me

Trucosoptimizacion.com pretende ser un lugar donde aprender, comentar y compartir todo aquello relacionado con la experiencia de usuario, asi como landing page optimitzation y conversion ratios.