Rendimiento de Google Tag Manager: 9 consejos para una velocidad más rápida del sitio

Publicado: 2023-10-28

Actualizado en octubre de 2023

¿Google Tag Manager está ralentizando su sitio? GTM es útil para fines de seguimiento de códigos, pero no si hace que su sitio web sea lento.

Si no está familiarizado con las mejores prácticas de optimización del rendimiento de GTM, puede afectar negativamente el rendimiento de su página.

En este artículo, compartiré nueve consejos para optimizar la configuración de GTM y mejorar la velocidad de su sitio web, garantizando una experiencia de usuario eficiente y fluida. También cubriré los errores comunes que se deben evitar.

Para obtener un repaso sobre la configuración de etiquetas, activadores, eventos y variables (macros) en GTM, haga clic aquí para ir al final.


Jaqueline Foster
Marketing de generación de demanda, Lever.co

Podemos contar con ellos para traer nuevas ideas a la mesa de manera constante.

Trabaja con nosotros

9 consejos de GTM para una velocidad del sitio más rápida

No hace falta que le digamos que la velocidad del sitio web es fundamental para brindar una experiencia de usuario óptima y mejorar la clasificación en los motores de búsqueda. Google Tag Manager ofrece una gran cantidad de funciones que se pueden aprovechar para mejorar el rendimiento del sitio web.

Repasemos 9 consejos esenciales de optimización de GTM que pueden reducir significativamente los tiempos de carga y hacer que su sitio funcione de manera más eficiente.

1) Minimizar el número de etiquetas

Uno de los factores clave para mejorar la velocidad del sitio web con Google Tag Manager es minimizar la cantidad de etiquetas. Cada etiqueta agregada a su sitio viene con su propio código y recursos, lo que puede contribuir a aumentar los tiempos de carga de la página.

Al revisar cuidadosamente su inventario de etiquetas y eliminar las etiquetas innecesarias o redundantes, puede reducir significativamente el peso total de su sitio web y mejorar su velocidad.

Para minimizar el número de etiquetas:

  • Comience por realizar una auditoría exhaustiva de su contenedor GTM.
  • Identifique etiquetas que ya no son necesarias o que tienen fines redundantes.
  • Considere si alguna etiqueta se puede consolidar o combinar en una sola etiqueta para reducir la cantidad de solicitudes de red.

Al optimizar la implementación de sus etiquetas y conservar solo las etiquetas esenciales, puede crear una configuración de GTM sencilla y eficiente que optimice el rendimiento del sitio web. Recuerde, menos etiquetas significan tiempos de carga más rápidos y una experiencia de usuario más fluida.

Contenido relacionado: Por qué los vídeos de marketing en su página de inicio pueden no ser una buena idea

2) Optimice los activadores de activación de etiquetas

En Google Tag Manager, su etiqueta se activa según un evento personalizado, como la carga de la página u otro comportamiento del usuario, como clics en ciertos elementos. Revisar y optimizar la forma en que activa las etiquetas es importante para garantizar que se configuren de manera eficiente.

Algunos de los principales tipos de desencadenantes incluyen:

  • Activadores de vista de página
  • Activadores de clic
  • Activadores de eventos personalizados
  • Desencadenantes del cambio histórico
  • Desencadenantes de errores de JavaScript

Opciones de activación de etiquetas

Puede encontrar las opciones de activación de etiquetas en la Configuración avanzada de cualquier definición de etiqueta dentro de un contenedor web.

Estas son las tres opciones de activación de etiquetas:

  • Ilimitado : esta opción se utiliza junto con la secuenciación de etiquetas. Las etiquetas se activan cuando los activadores así lo indican, sin ninguna limitación.
  • Una vez por evento : con esta opción, la etiqueta se activa solo una vez cuando ocurre un evento específico.
  • Una vez por página : con esta opción, la etiqueta se activará solo una vez cuando se cargue la página.

Creando un disparador

Puede crear un activador GTM siguiendo los pasos a continuación:

  • Haga clic en Etiquetas > Nuevo .
  • Haga clic en Configuración del activador .
  • Seleccione el tipo de activador que desea crear.
  • Complete la configuración para el activador seleccionado.

3) Utilice secuenciación de etiquetas

Ciertas etiquetas que dependen entre sí pueden afectar la velocidad de su sitio web si no están secuenciadas correctamente.

La buena noticia es que GTM proporciona una práctica función de secuenciación de etiquetas que le permite controlar el orden en que se ejecutan estas etiquetas dependientes.

Con la secuenciación de etiquetas, puede activar etiquetas inmediatamente antes o después de una etiqueta "primaria" designada. Esta funcionalidad está disponible dentro de los contenedores web y se puede aplicar a cualquier configuración de etiquetas desde Configuración avanzada > Opciones de secuenciación de etiquetas .

Imagen1

4) Habilitar variables integradas

Google Tag Manager ofrece una variedad de variables integradas que proporcionan datos valiosos sin necesidad de etiquetas adicionales. Estas variables le permiten acceder a información importante sobre el contexto de navegación del usuario y el propio sitio web.

Por ejemplo, la variable {{Page URL}} proporciona la URL de la página actual que se está viendo. Esto puede resultar útil para realizar un seguimiento del comportamiento del usuario o pasar la URL de la página como parámetro a otras etiquetas.

De manera similar, la variable {{Referrer}} captura la URL de la fuente de referencia, que indica la página o fuente anterior que dirigió al usuario a la página actual.

Imagen2

Por ejemplo, si desea realizar un seguimiento de la URL de la página y pasarla como parámetro a una etiqueta específica, en lugar de extraerla manualmente utilizando bibliotecas de JavaScript, puede utilizar la variable incorporada {{Page URL}} proporcionada por GTM.

El uso de la variable incorporada {{Page URL}} elimina la necesidad de escribir código JavaScript para extraer la URL de la página manualmente.

Debe utilizar estas variables siempre que sea posible, ya que eliminan la necesidad de etiquetas adicionales, lo que reduce el número total en su sitio web.

5) Implementar una política de seguridad de contenido (CSP)

La política de seguridad de contenido es un mecanismo de seguridad implementado en servidores web para proteger los sitios web de diversas amenazas a la seguridad.

Al implementar un CSP bien definido, establece una barrera sólida que evita que se carguen scripts de terceros innecesarios en su sitio web. Esto mejora la seguridad de su sitio web y puede afectar positivamente el rendimiento.

Al reducir el riesgo de scripts externos maliciosos y códigos no autorizados, su sitio web puede funcionar de manera más eficiente, lo que resulta en una velocidad mejorada y una experiencia de navegación más segura para el usuario.

Contenido relacionado: Cómo la mala seguridad del sitio web afecta negativamente las clasificaciones SEO

6) Evite manipulaciones intensas de DOM (como solución a largo plazo)

La manipulación DOM implica realizar cambios en la estructura o el contenido de una página web utilizando JavaScript. Si bien puede resultar útil en determinadas funcionalidades dinámicas, la manipulación excesiva puede provocar retrasos en la renderización y afectar el rendimiento general del sitio web.

Considere si enfoques alternativos lograrán el mismo objetivo. Esto podría implicar utilizar otras funciones nativas del navegador o trabajar con su equipo de desarrollo para encontrar soluciones optimizadas.

Colaborar con su equipo de desarrollo es valioso para implementar estrategias a largo plazo para mejorar la velocidad del sitio web. Pueden ayudar a identificar áreas donde se produce una fuerte manipulación de DOM y sugerir técnicas u optimizaciones alternativas.

7) Explore el etiquetado del lado del servidor con Google Tag Manager

Considere implementar el etiquetado del lado del servidor con Google Tag Manager, especialmente para etiquetas que no requieren ejecución del lado del cliente. Esta implementación puede tener un impacto positivo sustancial en el rendimiento del sitio web.

La siguiente figura muestra el funcionamiento del seguimiento del lado del servidor con GTM:

Imagen3

Esto descarga el procesamiento de etiquetas del dispositivo del usuario a un servidor, que tiene más recursos y puede manejar las tareas de manera más eficiente. El sitio web puede cargarse más rápido minimizando la cantidad de código JavaScript que se ejecuta en el lado del cliente, lo que mejora el rendimiento.

Al decidir implementar el etiquetado del lado del servidor con GTM, es esencial identificar las etiquetas que no dependen de la interacción del lado del cliente o de datos específicos del usuario. Estas etiquetas, como las relacionadas con análisis internos o eventos del lado del servidor, se pueden transferir sin problemas al lado del servidor.

8) Mantenga siempre optimizado el contenedor de Google Tag Manager

Las etiquetas, variables o activadores no utilizados que permanecen en su contenedor GTM contribuyen a un procesamiento innecesario y pueden ralentizar su sitio web. Si se toma el tiempo para revisar su contenedor con regularidad, podrá identificar y eliminar estos componentes innecesarios. Este mantenimiento garantiza que solo estén presentes los elementos esenciales, lo que agiliza el funcionamiento general de su configuración GTM.

El mantenimiento regular de su cuenta GTM debe ser una práctica continua. Reserve tiempo periódicamente para evaluar y limpiar cualquier elemento no utilizado o redundante. Este enfoque proactivo ayuda a garantizar que su implementación de GTM siga siendo eficiente, actualizada y alineada con las necesidades de su sitio web.

9) Utilice un proxy de almacenamiento en caché para cargar GTM

El uso de un proxy de almacenamiento en caché para cargar Google Tag Manager implica utilizar un mecanismo de almacenamiento en caché del lado del servidor para mejorar la entrega y carga de recursos GTM en un sitio web. Cuando un usuario visita una página web con GTM implementado, su navegador envía una solicitud para recuperar el contenedor GTM y sus scripts asociados del servidor.

Sin embargo, este proceso puede introducir latencia y afectar los tiempos de carga inicial de la página, especialmente si el servidor está geográficamente distante o experimenta mucho tráfico.

Se puede implementar un proxy de almacenamiento en caché entre el navegador del usuario y el servidor GTM para mitigar estos problemas. El proxy de almacenamiento en caché actúa como intermediario, interceptando solicitudes de recursos de GTM y entregando versiones en caché de esos recursos en lugar de recuperarlas del servidor de GTM cada vez.

Contenido relacionado: Estrategias de Google Ads que aumentarán las conversiones y mejorarán su ROI

Consejos para optimizar el rendimiento del Administrador de etiquetas de Google

Aquí hay un cuadro rápido de todos los consejos de optimización de GTM que cubrimos aquí:

Cuadro de consejos de optimización del Administrador de etiquetas de Google

Trabaja con nosotros

Tres errores que se deben evitar para limitar el impacto de GTM en el rendimiento de la velocidad de la página

Por muy útil y eficaz que pueda ser Google Tag Manager, no es raro que los recién llegados a la plataforma se dejen llevar y lo utilicen de tal manera que afecte negativamente el rendimiento de su sitio web.

Para evitar que esto le suceda, aquí le presentamos algunos de los errores más comunes cometidos por los usuarios de Tag Manager que sería prudente evitar:

1) Uso excesivo de etiquetas

Cuantas más etiquetas agregue, más probabilidades tendrá de encontrar problemas de rendimiento en su sitio web.

Para evitar la hinchazón y los tiempos de carga lentos, considere cuidadosamente el uso de sus etiquetas. Priorice las etiquetas esenciales que más se alineen con sus metas y objetivos y elimine las etiquetas que ya no sean relevantes.

2) Carga sincrónica

Una de las principales causas de los problemas de rendimiento de Google Tag Manager es el uso de la carga sincrónica.

Permitir que las etiquetas se carguen sincrónicamente, una tras otra, agota los recursos del servidor, lo que a menudo resulta en tiempos de carga de páginas significativamente mayores.

Por eso es tan importante cargar etiquetas de forma asincrónica siempre que sea posible. Al hacerlo, se pueden cargar varios recursos simultáneamente, lo que significa que su página tarda menos en renderizarse por completo.

3) Falta de pruebas

No probar exhaustivamente las etiquetas y su implementación puede provocar errores que ralenticen su sitio web o afecten negativamente a la experiencia del usuario.

Como tal, vale la pena implementar un riguroso proceso de prueba y depuración para detectar y corregir cualquier problema de rendimiento causado por sus etiquetas.

Actualización: configuración de etiquetas, activadores, eventos y macros

Para aquellos de ustedes que son nuevos en GTM y desean un repaso, aquí hay un desglose rápido sobre cómo configurar etiquetas, activadores, etc.

1) ¿Qué son las etiquetas en Google Tag Manager?

Las etiquetas de Google son pequeños fragmentos de código que facilitan la adición de seguimiento de conversiones, análisis, etiquetas de remarketing y más. Estas etiquetas no sólo se utilizan para productos de Google como Google Analytics y Search Console, sino también para herramientas de terceros como Facebook Pixel.

A continuación se muestra un ejemplo de una etiqueta que utilizamos para rastrear quién hace clic en nuestra página "Servicios" para nuestra agencia de marketing digital:

Imagen16

Cómo configurar una etiqueta

Para configurar una etiqueta, inicie sesión en Tag Manager, asegúrese de estar en el panel de descripción general y haga clic en Nueva etiqueta :

Imagen20

A continuación, reemplace la etiqueta sin título con el nombre fácilmente identificable de su nueva etiqueta:

Imagen24

Luego puede hacer clic en la pestaña Configuración de etiqueta para elegir el tipo de etiqueta que desea usar:

Imagen23

Para simplificar las cosas, configuraremos una etiqueta de Google Analytics , aunque hay docenas de opciones para elegir y, si no ve la etiqueta que necesita en la lista, siempre puede crear una usando la etiqueta HTML personalizada. :

Imagen6

Hay varias etiquetas de análisis que podemos utilizar. Para este tutorial, seleccionaremos "Evento GA4".

Imagen14

Esto abre la ventana Configuración de etiqueta , donde su primera tarea es agregar el ID de seguimiento relevante en el campo ID de medición :

Imagen19

A continuación, especifique un nombre de evento:

Imagen13

Para mejorar los resultados, puede hacer clic en el icono al lado de este campo para que aparezca una lista de nombres de etiquetas preestablecidos. Simplemente haga clic en el que desea seleccionar:

Imagen11

Una vez hecho esto, haga clic en la pestaña Activación :

Imagen5

Luego seleccione Todas las páginas :

Imagen21

Finalmente, presiona Guardar y ¡listo! ¡Acabas de configurar tu primera etiqueta!

Imagen15

Esta es una implementación muy simple de una etiqueta. Ciertamente, puede agregar complejidades en el futuro para cualquier cosa que esté tratando de hacer.

Mire este vídeo para comenzar con etiquetas personalizadas en GTM:

Trabaja con nosotros

2) ¿Qué son los activadores en Google Tag Manager?

Los activadores determinarán si una etiqueta se activa o no. En pocas palabras, se trata de "reglas". Así es como se ve uno de nuestros desencadenantes. Para los Triggers, existe la opción de seleccionar diferentes eventos. En nuestro caso, optamos por buscar personas que estén haciendo clic en un texto específico (“Marketing de contenidos”):

Administrador de etiquetas de Google

Cómo configurar un disparador

Una vez más, asegúrese de haber iniciado sesión en Tag Manager y en el panel de descripción general y luego, en la barra lateral izquierda, haga clic en Activadores .

Para este ejemplo, vamos a realizar un seguimiento de alguien que hizo clic en un enlace específico, así que seleccione Hacer clic :

Administrador de etiquetas de Google

Seleccione Solo enlaces en Destinos , anule la selección de "Esperar etiquetas" y "Verificar validación" y luego presione Continuar :

Administrador de etiquetas de Google

En la sección Disparar , seleccione Algunos clics y seleccione Texto de clic :

Administrador de etiquetas de Google

Ingrese texto ficticio por ahora y guarde el activador. Volveremos a ello en un segundo.

Ahora es el momento de descubrir cómo se ve realmente el "Texto de clic". Primero, debemos presionar el menú desplegable del botón Publicar cerca de la esquina superior derecha de la pantalla. Luego seleccionaremos el modo Vista previa y Depuración :

Administrador de etiquetas de Google

Aquí hay una explicación detallada sobre cómo usar la consola de depuración:

3) ¿Qué son los eventos en Google Tag Manager?

Un evento es una acción. Por ejemplo, si alguien hace clic en su número de teléfono, puede etiquetarlo como un evento y activarlo en Google Analytics. Al hacer esto, podrá medir consistentemente las acciones que considere importantes.

Cómo configurar un evento:

Una vez más, vaya a Activadores en el lado izquierdo del panel de descripción general en GTM.

Haga clic en el botón rojo Nuevo .

Luego elija Evento personalizado :

Administrador de etiquetas de Google

Para este evento, estamos intentando realizar un seguimiento de todas las personas que terminaron en nuestra "Página de agradecimiento". Usamos la consola "Vista previa y depuración" para encontrar un evento específico para rastrear y terminamos con el siguiente resultado:

Administrador de etiquetas de Google

Después de guardar este activador, iré a Etiquetas y crearé una etiqueta específicamente para rastrear una conversión de Facebook en esta página:

Administrador de etiquetas de Google

¿Qué son las variables en Google Tag Manager?

A medida que continúe agregando a GTM, agregará tareas repetitivas. ¿Qué pasaría si tuvieras la posibilidad de crear atajos para estas tareas? Eso es lo que son las variables.

Nota : Las variables suelen llamarse " Macros ".

Esto es un poco más detallado, por lo que le indicaremos una excelente explicación en video:

¿Cuáles son algunos casos de uso práctico de GTM?

Algunos de los casos de uso práctico de GTM incluyen:

  • Consolidar todas sus etiquetas web (como análisis y seguimiento de conversiones)
  • Seguimiento de eventos en secciones específicas de su sitio web (como números de teléfono o completar un formulario de contacto)
  • Seguimiento seguimiento de dimensiones multicanal (múltiples fuentes de donde proviene un usuario)
  • Seguimiento del comportamiento específico del usuario (como el tiempo dedicado a la página, la profundidad de desplazamiento, las tasas de clics)
  • Seguimiento de eventos de comercio electrónico (como vistas de productos, agregar al carrito, finalizar compra)
  • Seguimiento de la eficacia de sus campañas de marketing (de muchas fuentes, como búsquedas pagas, redes sociales, marketing por correo electrónico)
  • Personalizar la experiencia del usuario (según la ubicación, intereses u otros factores)
  • Seguimiento del formulario de origen del cliente potencial (como un usuario que vino de un anuncio pago y luego completó un formulario de contacto)
  • Filtrar el tráfico interno (como excluir visitas de las direcciones IP de su propia organización)
  • Eliminar el spam de referencias (bloquear o filtrar el tráfico de referencias falso)
  • Seguimiento de vídeos de YouTube (interacciones del usuario como reproducción, pausa o duración de la visualización)

Bonificación: Asistente de etiquetas de Google

Google tiene una extensión de navegador llamada Google Tag Assistant que permite a los usuarios ver etiquetas específicas que se encuentran en cada página. Esto ayuda con las pruebas/implementación.

Para obtener capacitación más detallada sobre cómo configurar Google Tag Manager , recomiendo ver videos de GTM Training en YouTube.

Últimas palabras sobre Google Tag Manager y el rendimiento del sitio web

Google Tag Manager ofrece una solución conveniente para administrar múltiples etiquetas y códigos de seguimiento, pero optimizar su implementación es crucial para maximizar el rendimiento del sitio web. ¡Tómese el tiempo adecuado para ajustar su configuración de GTM y obtenga los beneficios de un sitio web más rápido y eficiente!

Si está listo para optimizar su configuración GTM, ¡ los expertos de Google Tag Manager de Single Grain pueden ayudarlo!

Trabaja con nosotros

Contenido adicional aportado por David Borgogni.

Preguntas frecuentes sobre la optimización del rendimiento de Google Tag Manager

  • ¿GTM ralentiza mi sitio web?

    Google Tag Manager no ralentiza inherentemente su sitio web. Sin embargo, si se configura incorrectamente o se agregan demasiadas etiquetas, puede afectar el rendimiento de su sitio web.

  • ¿Cómo puedo mejorar la velocidad de la página de mi sitio web?

    Empiece por utilizar menos etiquetas en Google Tag Manager y optimizar los activadores de activación de etiquetas. Utilice la función de secuenciación de etiquetas de GTM y habilite variables integradas para agilizar la operación. Implemente una política de seguridad de contenido para mejorar la seguridad y evitar la ejecución innecesaria de scripts.

    Evite manipulaciones pesadas de DOM, explore el etiquetado del lado del servidor con GTM, mantenga su contenedor GTM optimizado y considere usar un proxy de almacenamiento en caché para cargar recursos GTM.

  • ¿Cómo afectan las variables JavaScript personalizadas de GTM al rendimiento de la página?

    Las variables de JavaScript personalizadas en GTM afectan significativamente el rendimiento de la página dependiendo de cómo se implementen. El código JavaScript complejo o mal optimizado dentro de variables personalizadas puede ralentizar la carga de la página. Es importante revisar y optimizar cuidadosamente las variables de JavaScript personalizadas para garantizar que se ejecuten de manera eficiente y no tengan un impacto negativo en el rendimiento.

  • ¿El uso de etiquetas HTML personalizadas puede afectar el rendimiento de GTM?

    Sí, el uso de demasiados códigos HTML puede afectar negativamente al rendimiento. Evite el uso de demasiadas etiquetas de marketing. Además, debe utilizar una etiqueta HTML personalizada que esté optimizada, sea eficiente y no introduzca complejidades ni retrasos innecesarios.

  • ¿Cuál es el papel de las etiquetas de Google Analytics en GTM y cómo afectan el rendimiento del sitio web?

    Una etiqueta de Google Analytics en GTM recopila y envía datos a la plataforma GA. Estas etiquetas de análisis universales son cruciales para rastrear y analizar las interacciones de los usuarios, las conversiones y otras métricas importantes en su sitio web. Cuando se implementan y configuran correctamente, las etiquetas de Google Analytics en GTM pueden proporcionar información valiosa.

    Sin embargo, la configuración inadecuada de las etiquetas, el uso excesivo de etiquetas o las reglas de activación ineficientes pueden causar problemas de rendimiento, lo que genera tiempos de carga de página más lentos y posibles interrupciones en la experiencia del usuario.

  • ¿Cómo puedo asegurarme de que las etiquetas GTM se activen en el orden deseado?

    GTM ofrece la función de secuenciación de etiquetas que le permite especificar el orden de activación de etiquetas. Al configurar para activar etiquetas antes o después de una etiqueta principal, puede asegurarse de que se ejecuten en la secuencia deseada, considerando dependencias o requisitos de pedido específicos.

  • ¿Existen herramientas o técnicas para medir el impacto de GTM en el rendimiento del sitio web?

    Sí, existen varias herramientas y técnicas para medir el impacto de GTM en el rendimiento del sitio web. Las herramientas de monitoreo del rendimiento como Google Lighthouse, PageSpeed ​​Insights o herramientas de desarrollo de navegadores web (por ejemplo, Chrome DevTools) pueden ayudar a evaluar los tiempos de carga de la página, las solicitudes de red e identificar posibles cuellos de botella causados ​​por GTM u otros factores.

    Además, realizar pruebas manuales y comparar los tiempos de carga de las páginas con y sin GTM puede proporcionar información sobre su impacto en el rendimiento. Aproveche estas herramientas y aplique pequeñas mejoras para impulsar sus esfuerzos de marketing.

  • ¿Google Tag Manager es bueno para SEO?

    Google Tag Manager en sí no tiene un impacto directo en el SEO. Sin embargo, puede beneficiar los esfuerzos de SEO al proporcionar una plataforma centralizada para administrar varios códigos y etiquetas de seguimiento. Permite una fácil implementación de herramientas de seguimiento y análisis, que pueden proporcionar datos valiosos para el análisis y la optimización de SEO.

    Además, la flexibilidad y facilidad de uso de GTM pueden agilizar la adición y administración de etiquetas relacionadas con SEO, lo que la convierte en una herramienta valiosa en una estrategia de SEO.

Si no has podido encontrar la respuesta que estabas buscando, no dudes en ponerte en contacto y preguntarnos directamente.