Manual de uso UN PRODUCTO

Transcripción

1 Manual de uso UN PRODUCTO

2 Manual de Uso 2 Introducción 2 Requisitos de ejecución 2 Instalación 3 Instalar Java 4 Configuración 5 Configuración de la herramienta 6 Instalación de certificados (SSL) 8 Configuración de los navegadores en tu ordenador 9 Configuración de los dispositivos móviles 10 Ventana Principal de Tag Checker. 11 Uso Básico 12 Validación de etiquetas 13 Validación de Flujos 15 Aviso legal 16 1

3 MANUAL DE USO Introducción Tag Checker es una aplicación con base en Java cuya función es mostrar y facilitar la validación de los datos (etiquetas) enviados, por cualquier página web o aplicación móvil, a distintas herramientas como Google Analytics, Adwords, Google Remarketing, píxeles de Facebook y Adobe Analytics. Su objetivo principal es reducir el tiempo y aumentar la fiabilidad de las validaciones del etiquetado de webs y aplicaciones, que de otra manera se realizarían de forma completamente manual. Tag Checker cuenta con varias funcionalidades entre las que se incluyen: Mostrar los datos de las etiquetas en tiempo real. La interpretación y muestra de los parámetros de cada etiqueta. La validación de estos parámetros contra expresiones regulares. La comprobación de una sucesión de datos para validar un flujo de navegación. Importar y exportar los datos visualizados para poder consultarlos en cualquier momento. Requisitos de ejecución Para ejecutar Tag Checker, el equipo debe tener instalado Java Runtime Environment (JRE), necesario para ejecutar cualquier aplicación Java. Si no se tiene la versión necesaria instalada, durante la propia instalación de Tag Checker, se informará y se realizará la misma. También se puede descargar la última versión de Java directamente desde la página web oficial: 2

4 Instalación La aplicación dispone de un instalador que se puede descargar desde la página su página oficial El proceso se detalla en las siguientes pantallas: Ventana principal de la instalación. Haz clic en Siguiente para continuar. Escoge donde quieres instalar Tag Checker. Por defecto se instalará en la dirección que se muestra en la imagen. Pulsa el botón Instalar. 3

5 Pulsa Siguente. Si tienes la versión correcta de Java, habrá finalizado la instalación y se abrirá Tag Checker. En caso contrario, se deberá instalar Java. Instalar Java Si no tienes la versión de Java correcta, se mostrará un aviso y se procederá a su instalación. Se iniciará la instalación de Java. Completa el proceso de instalación de Java hasta el final. 4

6 CONFIGURACIÓN Tag Checker funciona como un proxy, es decir, se hace pasar el tráfico de red a través de la propia herramienta y se van mostrando las etiquetas de las aplicaciones que se ejecutan tanto en ordenadores como en dispositivos móviles. Si se desea visualizar las etiquetas de una página web o una aplicación instalada en el mismo ordenador que se está ejecutando Tag Checker, será suficiente con instalar el certificado de Tag Checker en tu equipo y pulsar el botón de iniciar. Si lo que se prefiere es ver las etiquetas de un teléfono o Tablet, habrá que instalar el certificado y configurar el dispositivo móvil. 5

7 Configuración de la herramienta Tag Checker está configurado por defecto, pero es posible cambiar esta configuración de la siguiente manera: Acceder a las opciones básicas en el menú Opciones -> Opciones básicas. En la pestaña Opciones Básicas se encuentran las siguientes opciones: Puerto: El puerto en el que Tag Checker espera recibir el tráfico. Tiempo de espera: El tiempo en milisegundos (30000 = 30 segundos) que Tag Checker esperará a que se resuelva una petición. Si es 0, no hay límite de tiempo. Configurar proxy del sistema/firefox: Esta opción sirve para que Tag Checker configure automáticamente las opciones de proxy de los navegadores del ordenador para empezar a visualizar los datos. En la pestaña Captura se pueden seleccionar los tipos de etiquetas que se deseen visualizar: Modificar Propiedad: Si esta casilla está marcada, el valor de la propiedad de las etiquetas visualizadas se cambiará por el valor aquí detallado. Esto permitirá enviar los datos que se están visualizando a contenedores de prueba y no contaminar los datos de producción. 6

8 En la pestaña SSL seleccionarás las direcciones de las cuales queremos descifrar el tráfico seguro. Hay cierta información que se envía a través de protocolos seguros y que es necesario descifrar para poder visualizarla. Cualquier conexión segura a una dirección que no se encuentre aquí permanecerá cifrada. Por defecto, Tag Checker incluye los hosts a los que envían datos las herramientas de etiquetado que soporta. Por último, en la pestaña de Proxy Externo se puede seleccionar Usar proxy externo. Al marcar esta esta casilla el tráfico saliente se enviará a través de la IP y puerto aquí descritos. 7

9 Instalación de certificados (SSL) Tras haber realizado la configuración de la herramienta con éxito, se deberá instalar un certificado SSL para las etiquetas que se envían a través de protocolos de red seguros. La instalación del certificado no supone ningún riesgo para la información enviada a través de la red. La única finalidad es que el navegador o dispositivo móvil confíe en Tag Checker y le permita visualizar los datos de las etiquetas. Para más información, consultar Aviso legal. Para configurar el equipo donde se encuentra instalado Tag Checker: Abre un navegador y escribe en la barra de direcciones la IP que te muestra Tag Checker para la red a la que te encuentres conectado. Se mostrará un enlace para descargar el certificado en tu equipo. Pasos a seguir según el navegador: - Chrome/IE: Haciendo doble clic en el fichero de certificado -> Instalar certificado -> Colocar certificados en el siguiente almacén -> Entidades de Raíz de Confianza -> Aceptar. - Firefox: Opciones -> Avanzado -> Certificados -> Ver Certificados -> Pestaña autoridades -> Importar y seleccionar el fichero de certificados. Pasos a seguir para su instalación en dispositivos móviles: Abre un navegador y escribe en la barra de direcciones la IP que te muestra Tag Checker para la red a la que te encuentres conectado. Una vez descargado al dispositivo, al abrir el fichero, se iniciará el proceso de instalación del certificado. Una vez completado, el dispositivo está listo para usarse con la herramienta. 8

10 Configuración de los navegadores en tu ordenador Por defecto, al pulsar el botón de iniciar captura, el navegador del equipo se configura automáticamente siempre y cuando en las opciones básicas esté dicha configuración activada: No obstante, es posible modificar la configuración de los distintos navegadores de forma manual tal y como se indica a continuación. Para validar las etiquetas desde un equipo distinto al que está ejecutando Tag Checker, se debe configurar el navegador de la siguiente forma: Chrome: Opciones -> Configuración -> Opciones avanzadas -> Cambiar Configuración del proxy -> pestaña conexiones -> Configuración de la LAN -> Marcar la casilla Usar un servidor proxy para la LAN y escribir la dirección IP y el puerto (8888 por defecto) que muestra Tag Checker. Opciones Avanzadas poner la misma IP y Puerto para todos los protocolos. Internet Explorer: Opciones -> Opciones de Internet -> pestaña conexiones -> Configuración de la LAN -> Marcar la casilla Usar un servidor proxy para la LAN y escribir la dirección IP y el puerto (8888 por defecto) que muestra Tag Checker. Opciones Avanzadas poner la misma IP y Puerto para todos los protocolos. Firefox: Opciones -> Avanzado -> Red -> Opciones de conexión -> Configuración de proxy manual -> Escribir la dirección IP y el puerto (8888 por defecto) que muestra Tag Checker. Safari: Menú Safari -> Preferencias -> Avanzado -> Cambiar Ajustes -> Escribir la dirección IP y el puerto (8888 por defecto) que muestra Tag Checker. 9

11 Configuración de los dispositivos móviles Para utilizar esta herramienta con un dispositivo móvil, éste debe estar conectado a la misma red que el ordenador que ejecuta Tag Checker. El caso más habitual es que estén conectados a la misma red wifi. Los pasos que se deben seguir son los siguientes: Android: Ajustes -> Wifi -> Conectar a la red que corresponda -> Modificar Red -> Opciones avanzadas -> Proxy Manual -> Introducir dirección IP mostrada en Tag Checker para esa red y el puerto (8888 por defecto). ios: Ajustes -> Wifi -> Conectar a la red -> Proxy HTTP Manual -> Introducir dirección IP mostrada en Tag Checker para esa red y puerto (8888 por defecto). 10

12 VENTANA PRINCIPAL DE TAG CHECKER Al iniciar Tag Checker podrás ver la siguiente ventana: Esta ventana se divide en dos partes principales: La tabla de Etiquetas: Donde se muestran las etiquetas enviadas. La zona de información: Donde se incluye en varias pestañas los datos sobre los parámetros de cada etiqueta, validadores de etiquetas, validador de flujos, filtros para aplicar a las etiquetas visualizadas y demás información. Además, en el menú superior se encuentran los siguientes submenús: Archivo: Funciones de importación y exportación de ficheros de etiquetas recogidos anteriormente. Acción: Operaciones sobre la tabla de etiquetas. Opciones: Desde donde se pueden configurar las opciones de Tag Checker. Ayuda: Ayuda de la aplicación. 11

13 USO BÁSICO Tag Checker permite añadir etiquetas a la tabla, bien capturándolas en tiempo real, o cargando ficheros de etiquetas obtenidos y guardados previamente. Una tabla con etiquetas cargadas tiene el siguiente aspecto: Se pueden observar los datos en las columnas de la tabla de etiquetas, siendo estos los siguientes: Número de etiqueta: El orden en el que se enviaron las etiquetas. Herramienta: La herramienta a la que pertenece la etiqueta (Universal Analytics, Adobe Analytics, Adwords, etc.) Tipo: El tipo de etiqueta, según lo define la herramienta (Pageview, event, etc.) Vista: El nombre de la vista asignado a esta etiqueta (Parámetro vista de herramientas de analítica o la URL cuando aplica) Categoría, Acción, Etiqueta: Columnas para mostrar los respectivos parámetros de etiquetas de Google Analytics. En la sección derecha, se ven las siguientes pestañas: General: Información general sobre las etiquetas de la tabla. Parámetros: Nombres y valores de los parámetros presentes en la etiqueta seleccionada. También muestra la validación de parámetros si hay una plantilla de validación seleccionada. Validar: Pestaña que permite seleccionar, crear y modificar una plantilla de validación. Flujos: Aquí se encuentran las opciones de creación y evaluación de flujos de etiquetas. Filtros: Filtros que se pueden aplicar a la tabla de etiquetas. Log: Registro de la actividad de la aplicación. 12

14 VALIDACIÓN DE ETIQUETAS La validación de etiquetas tiene el siguiente aspecto: En la tabla a la derecha de la imagen se muestra un ejemplo de validación de parámetros. La tabla se divide en las siguientes columnas: Nombre: Nombre de los parámetros. Valor: El valor del parámetro en la etiqueta. Regex: La expresión regular contenida en la plantilla, con la que se compara el parámetro de la etiqueta. Los parámetros que coincidan con el valor esperado se colorearán en verde, y los que no coincidan se pintarán en rojo. Además de estos, los parámetros definidos en la plantilla de validación que no aparezcan en la etiqueta se mostrarán en amarillo. 13

15 Las plantillas de validación pueden ser creadas y editadas desde Tag Checker y se almacenarán en ficheros XML. Haciendo clic en la pestaña Validar mostramos lo siguiente: En la parte superior de la pestaña Validar verás la lista de validadores que hayas definido para las etiquetas, mientras que en la parte inferior tendrás los parámetros definidos para cada uno de esos validadores. Cada parámetro incluye la siguiente información: Nombre: El nombre del parámetro. Regex: La expresión regular con la que se comparará el valor del parámetro. Peso: El valor relativo de este parámetro a la hora de escoger el validador (explicado más adelante). Global: Una casilla que indica si este parámetro está incluido en todos los validadores o solamente en éste. Cuando esté cargada una plantilla de validación, el programa comparará cada etiqueta con la lista de validadores y escogerá para cada uno el validador que mejor se ajuste, comparando el número de coincidencias de parámetros y usando el peso de cada uno para indicar su importancia relativa. 14

16 VALIDACIÓN DE FLUJOS Tag Checker incorpora la capacidad de validar una secuencia de etiquetas de forma que se pueda comprobar que las etiquetas de la tabla aparezcan en el orden correcto y que no falten etiquetas en tu flujo de navegación. La pestaña de flujos tiene el siguiente aspecto: En la parte derecha de la imagen podrás observar un flujo siendo aplicado sobre la tabla de etiquetas. Las opciones para nombrar el flujo, guardar o cargarlo y definir la herramienta para la que se define. La tabla de etiquetas de flujo. Podrás sumar etiquetas directamente desde la tabla de etiquetas haciendo clic derecho en ellos y seleccionando Añadir a etiquetas a flujo, o bien creando etiquetas desde cero. También podrás modificar el orden de las etiquetas del flujo. La tabla de parámetros, donde se pueden añadir, eliminar y modificar parámetros de la etiqueta del flujo. Cuando se hace clic en el botón Evaluar Flujo se contrastará la tabla de etiquetas con la tabla de flujo y el resultado aparecerá con colores en las etiquetas. Las etiquetas verdes se corresponden con los parámetros y posición, las rojas no coinciden con lo esperado y las amarillas indican que faltan parámetros esperados. 15

17 AVISO LEGAL A los efectos previstos en la Ley Orgánica 15/1999, de 13 de diciembre, de Protección de Datos de Carácter Personal, así como en la Ley 34/2002 de 11 de julio de Servicios de la Sociedad de la Información y de Comercio Electrónico, se informa al usuario de que la herramienta software Datail Tag Checker no almacena, clasifica, trata, ni accede, o de cualquier otro modo analiza, filtra o consigna en el equipo datos de carácter personal propios del usuario o pertenecientes a terceros. 16

18 La verificación de tu etiquetado a un solo click.