La integración de GA4 AMP analytics se basa en la etiqueta <amp-analytics> configurada con el tipo googleanalytics. Usted define las mediciones de vistas de página y los disparadores de eventos personalizados directamente dentro de un bloque de configuración JSON incrustado en su plantilla AMP HTML. Esta arquitectura permite que las páginas AMP envíen datos directamente a los puntos finales de Google Analytics 4 mientras cumplen estrictamente con las reglas de validación de AMP y preservan el rendimiento de carga móvil rápida.
¿Por qué el seguimiento de eventos personalizados en páginas AMP es diferente al de los sitios web estándar?
Las páginas web estándar suelen ejecutar Google Tag Manager o la biblioteca estándar gtag.js para gestionar el seguimiento. Estos scripts ejecutan JavaScript personalizado para escuchar eventos DOM, construir cargas útiles y enviar solicitudes. Sin embargo, el marco AMP prohíbe el JavaScript personalizado arbitrario para preservar presupuestos de renderizado estrictos y minimizar el trabajo de CPU en procesadores móviles.
En lugar de ejecutar scripts personalizados, AMP utiliza un marco declarativo. Usted especifica las reglas de seguimiento dentro de un objeto JSON estructurado dentro del elemento <amp-analytics>. El tiempo de ejecución de AMP subyacente interpreta este marcado JSON, adjunta oyentes de eventos a los elementos DOM de destino y formatea las solicitudes de red a los puntos finales de GA4. Capturar un evento personalizado como un clic de llamada a la acción o un umbral de desplazamiento requiere escribir una configuración JSON válida en lugar de agregar controladores JavaScript en línea.
- Scripts de tiempo de ejecución de AMP: La etiqueta <script async custom-element=”amp-analytics” src=”https://cdn.ampproject.org/v0/amp-analytics-0.1.js”></script> debe residir en el encabezado HTML de la página.
- ID de medición: Se requiere una ID de medición de GA4 válida que comience con G- en el objeto de configuración vars.
- Esquema JSON: La carga útil de configuración debe seguir una sintaxis JSON estricta sin comillas sin escape ni comas finales.
- Selectores de disparadores: Las ID de elementos o clases CSS referenciadas en los disparadores de clic deben existir en el marcado del cuerpo.
- Opciones de transporte: El uso de transporte de baliza o imagen garantiza que las solicitudes de análisis se completen incluso durante una navegación rápida.
¿Cómo se configura la medición básica de GA4 dentro de la etiqueta amp-analytics?
Para comenzar el seguimiento, coloque el componente amp-analytics dentro del cuerpo de su documento AMP. Especifique type=”googleanalytics” como un atributo en la etiqueta del componente. Dentro de una etiqueta secundaria <script type=”application/json”>, declare su configuración. Debe definir un diccionario vars que contenga su ga_measurement_id de destino. El seguimiento automático de vistas de página se activa inmediatamente cuando el tiempo de ejecución de AMP inicializa el componente al cargar el usuario.
La configuración base maneja métricas de tráfico generales, como la ubicación de la página, detalles del referente y resolución de pantalla. Debido a que las páginas AMP se ejecutan en entornos aislados restringidos o dentro de cachés AMP, los identificadores de cliente son gestionados automáticamente por el tiempo de ejecución. Esto garantiza que la continuidad de la sesión permanezca intacta cuando los usuarios pasan de URL de caché a dominios de origen.
Google trata las páginas web responsivas y las páginas AMP por igual en la indexación y evaluación de búsqueda.
Google Search Central
¿Cómo activar eventos personalizados en clics de botones AMP y envíos de formularios?
El seguimiento de eventos personalizados en AMP requiere agregar objetos al bloque triggers de su configuración JSON. Cada entrada de disparador contiene un nombre de disparador, una propiedad on que especifica el tipo de interacción, un selector que apunta al elemento específico y un tipo de solicitud. Por ejemplo, para rastrear un clic en un botón de formulario de clientes potenciales, establezca on en click y selector en #submit-btn.
A continuación, asigne el disparador a una solicitud de evento. Dentro del objeto vars de ese disparador específico, especifique event_name junto con cualquier nombre de parámetro personalizado que desee pasar a GA4. Cuando un usuario toca el elemento objetivo, el tiempo de ejecución de AMP construye una solicitud HTTP que coincide con la estructura del Protocolo de medición de GA4 y la envía en segundo plano sin interrumpir la navegación del usuario.
- Identificar elementos de destino: Localice nombres de clase CSS específicos o ID de elementos para botones, formularios o enlaces rastreados.
- Definir nombres de eventos: Elija nombres de eventos estándar o personalizados como generate_lead o select_content que se alineen con su estructura de informes.
- Construir disparadores JSON: Agregue una entrada dedicada dentro del bloque triggers utilizando el selector de elementos elegido.
- Pasar parámetros de eventos: Incluya atributos personalizados como button_location o form_id bajo el bloque de variables del disparador.
- Probar el disparo de eventos: Inspeccione las solicitudes de red en las herramientas de desarrollo del navegador para verificar que los eventos envíen datos de carga útil correctamente.
¿Cuáles son los parámetros de eventos personalizados comunes utilizados en el seguimiento AMP?
Al enviar eventos a GA4, pasar metadatos contextuales ayuda a desglosar las interacciones de los usuarios durante la generación de informes. Los parámetros estándar incluyen título de página, ruta de página y categorías de sección. En las configuraciones JSON de AMP, puede extraer valores dinámicos utilizando la expansión de variables AMP incorporada, como ${title}, ${canonicalPath} o ${documentReferrer}.
Para eventos personalizados, puede pasar parámetros personalizados bajo el objeto vars dentro de cada definición de disparador. Por ejemplo, rastrear un botón de reproducción de video puede pasar video_title y video_provider como claves personalizadas. GA4 registra estas claves cuando se asignan como dimensiones personalizadas en la interfaz de Google Analytics, brindando a su equipo información valiosa sobre la participación móvil sin ejecución de JavaScript personalizada.
Cómo aplica Alien Road GA4 Analytics en AMP
En Alien Road, nuestro equipo integra el seguimiento de análisis personalizado en plantillas AMP a través de un flujo de trabajo de implementación sistemático para proyectos de clientes. En un compromiso típico, comenzamos auditando las configuraciones de etiquetas de escritorio existentes para asignar las dimensiones de evento requeridas directamente a los esquemas JSON de AMP. Esto garantiza que las métricas clave coincidan en las páginas responsivas estándar y las variantes AMP móviles sin crear discrepancias en los informes.
Durante la fase de implementación, construimos plantillas JSON personalizadas que capturan hitos de conversión críticos, incluidos envíos de formularios de contacto, toques de enlaces telefónicos y clics salientes. Implementamos parámetros de baliza de transporte para evitar la pérdida de datos en viajes de usuario de alta velocidad. Una vez publicado, nuestro equipo técnico realiza la verificación en navegadores móviles en vivo y URL de caché AMP para garantizar que los eventos se disparen de manera predecible bajo condiciones de red variables.
Finalmente, configuramos paneles de monitoreo en tiempo real dentro de GA4 para confirmar que los eventos personalizados entrantes completen correctamente los informes de exploración estándar. Al mantener rutinas estrictas de validación de esquemas, evitamos regresiones de seguimiento cuando los equipos de ingeniería de clientes actualizan las plantillas del sitio o introducen nuevas campañas de marketing con el tiempo.
Google Search indexa las páginas AMP al igual que otras páginas web, y aplica el mismo estándar a todas las páginas, independientemente de la tecnología utilizada para construir la página.
Google Search Central
¿Cómo verificar y depurar eventos GA4 personalizados en herramientas de validación AMP?
Validar su configuración de análisis es un paso crítico antes de implementar páginas AMP en producción. Una sintaxis JSON no válida dentro del bloque <amp-analytics> rompe el componente y evita que las solicitudes de seguimiento se disparen por completo. Además, los errores de sintaxis hacen que la página falle en la validación AMP, lo que puede eliminar la página de la distribución de Google AMP Cache.
Para depurar problemas, agregue #development=1 a la URL de su página AMP local y abra las herramientas de desarrollo del navegador. La consola del navegador muestra entradas de registro detalladas del tiempo de ejecución de AMP, mostrando si la extensión amp-analytics se cargó y enumerando cada disparador evaluado. También puede inspeccionar la pestaña Red para monitorear las llamadas de red salientes dirigidas a google-analytics.com/g/collect y revisar parámetros como en para el nombre del evento y ep.* para los parámetros del evento.
Por dónde empezar esta semana con su medición móvil
Comience su trabajo de optimización auditando sus páginas AMP móviles de mejor rendimiento utilizando las herramientas de desarrollo del navegador. Verifique que la dependencia <script async custom-element=”amp-analytics” src=”https://cdn.ampproject.org/v0/amp-analytics-0.1.js”></script> esté incluida correctamente en el encabezado del documento y que su valor actual de ga_measurement_id coincida con su propiedad GA4 activa.
A continuación, elija una acción de usuario clave en su sitio, como un botón de conversión principal, y agregue un disparador de clic simple a su configuración JSON. Implemente el cambio en un entorno de prueba, active la acción manualmente y verifique GA4 DebugView para confirmar la entrega del evento. Una vez verificado, expanda el marcado JSON para cubrir los objetivos comerciales restantes en toda su biblioteca de plantillas.