Adicionando Analytics em páginas AMP

Analisando o trafego de uma página amp

Accelerated Mobile Pages (AMP) é uma plataforma usada para construir conteúdo estático de forma rápida. Na biblioteca de componentes AMP, temos um componente que permite mensurar as interações do usuário com Google Analytics em páginas AMP.

Para esse post iremos focar no framework AMP, caso queria adicionar AMP para seu site AMP WordPress, o caminho mais fácil é com o plugin site kit by google ou indo em configurações do plugin de AMP e adicionado o ID do seu Google Analytics

Google Analytics

O Google Analytics é uma ferramenta gratuita que ajuda você a acompanhar o tráfego do seu site e melhorar o seu desempenho. É uma ótima maneira de ver como as pessoas estão usando o seu site, incluindo analytics em páginas AMP. Com relatórios gerenciais detalhados, você pode descobrir rapidamente onde estão os seus visitantes e o que eles estão fazendo no seu site.

Isso te ajudará a entender melhor como os usuários interagem com o seu conteúdo e a melhorar o design do seu site para atrair mais visitantes. Use o Google Analytics para monitorar não só o tráfego, mas também as conversões e os objetivos do seu site. Dessa forma, você terá todos os dados necessários para melhorar o desempenho dele.

Você pode então usar estas informações para melhorar a experiência do usuário do seu site ajustando o conteúdo ou layout de certas páginas, facilitando para as pessoas encontrarem o que querem de forma rápida e fácil.

Como adicionar analytics em páginas AMP

Configuração básica para adicionar Analytics em páginas AMP

Para criar uma instalação básica do Google Analytics em páginas AMP, copie e cole o código base a seguir e substitua <GA_MEASUREMENT_ID> pela propriedade ID do seu Google Analytics.

<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script> <amp-analytics type="gtag" data-credentials="include"> <script type="application/json"> { "vars" : { "gtag_id": "<GA_MEASUREMENT_ID>", "config" : { "<GA_MEASUREMENT_ID>": { "groups": "default" } } } } </script> </amp-analytics>
Code language: HTML, XML (xml)

Como funciona Google Analytics em páginas AMP?

O componente <amp-analytics> é um extended component para habilita-lo precisamos carregar o script responsável para carregar o componente:

<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
Code language: HTML, XML (xml)

Após incluir o script precisamos configurar o nosso componente amp-analytics, primeiro atributo é o type, define qual o tipo de tracking iremos trabalhar nesse caso vamos utilizar o gtag, mas o componente aceita uma lista extensa de ferramentas de tracking:

O segundo atributo é o data-credentials ele ativa a capacidade de leitura de cookies numa solicitação específica por meio de um atributo config.

AMP não permite JavaScript fora do seu controle ou por bibliotecas não aprovadas; portanto, a configuração das ferramentas de monitoramento precisa ser realizadas através de um JSON. No caso do Google Analytics dentro do nosso JSON precisamos de uma propriedade gtag_id(o id do nosso Google Analytics) válida e as configurações para definir como iremos realizar o monitoramento definido pelo atributo config

Tráfego AMP vs. Tráfego não-AMP

O tráfego AMP utiliza IDs de clientes diferentes daquele para o tráfego da Web por padrão. As páginas AMP são carregadas mais rapidamente e mostram padrões de tráfego diferentes dos correspondentes de uma página web padrão, o que geralmente significa que você irá obter métricas diferentes entre páginas AMP e não-AMP.

O uso de uma propriedade separada pode ajudar a medir o tráfego AMP com uma melhor análise das métricas. Se você precisar usar uma única propriedade para medir o tráfego AMP e ano AMP, use uma dimensão de fonte de dados ou uma dimensão personalizada para distingui-los.

Por padrão, o Google Analytics envia o valor “AMP” pela dimensão da fonte de dados. Use esse valor para segmentar, filtrar ou analisar o conteúdo AMP versus o conteúdo não-AMP.

Assim conseguimos adicionar Google Analytics em páginas AMP. Para ver mais conteúdo sobre AMP acesse a página da categoria ou deixe um comentário.

Por Fellyph Cintra

Fellyph Cintra é um Google Developer Expert focado em tecnologias web, com participação ativa na comunidade WordPress. Com mais de 14 anos de experiência no mercado, Fellyph já palestrou em mais de 30 eventos ao redor do Brasil e Europa, sempre abordando as boas práticas de desenvolvimento na web.

Deixe um comentário

O seu endereço de e-mail não será publicado.