AMP

Analytics: the basics

Conheça os conceitos básicos da análise de AMP.

Usar amp-pixel ou amp-analytics?

O AMP oferece dois componentes para atender às suas necessidades de análise e medição: amp-pixel e amp-analytics. As duas opções enviam dados de análise para um endpoint definido.

Se você quiser um comportamento semelhante ao de um simples pixel de rastreamento, o componente amp-pixel fornecerá um rastreamento básico de exibições de página. Os dados de exibição de página são enviados para uma URL definida. Algumas integrações com fornecedores podem precisar desse componente. Nesse caso, elas especificarão o endpoint exato da URL.

Na maioria das soluções de análise, use amp-analytics. O rastreamento de exibições de página também funciona em amp-analytics. No entanto, também é possível rastrear o engajamento dos usuários com qualquer tipo de conteúdo da página, incluindo cliques em links e botões. Além disso, você pode medir até onde o usuário rolou a página, se ele interagiu ou não com mídias sociais e muito mais.

Como parte da integração com a plataforma AMP, os fornecedores ofereceram configurações predefinidas de amp-analytics para que seja mais fácil coletar dados e movê-los para suas ferramentas de rastreamento. Acesse a documentação de fornecedores na lista Fornecedores de análise.

Você pode usar amp-pixel e amp-analytics nas suas páginas: amp-pixel para rastreamento simples de exibições de página e amp-analytics para todo o restante. Também é possível adicionar várias instâncias de cada tag. Se estiver trabalhando com vários fornecedores de análise, será necessário usar uma tag por solução. As páginas AMP mais simples são melhores para os usuários, portanto se você não precisar de tags adicionais, não as use.

Criar uma configuração de análise simples

Saiba como criar uma configuração simples de amp-pixel e amp-analytics .

Configuração simples de amp-pixel

Para criar uma configuração simples de amp-pixel, insira no corpo da página AMP algo como o seguinte :

<amp-pixel src="https://foo.com/pixel?RANDOM"></amp-pixel>

Neste exemplo, os dados de exibição de página são enviados para a URL definida, juntamente com um número aleatório. A variável RANDOM é uma entre as muitas variáveis ​​de substituição na plataforma AMP. Saiba mais sobre a substituição de variáveis.

O componente amp-pixel é integrado, de modo que não é necessário fazer uma declaração de inclusão, como ocorre com os componentes estendidos de AMP, incluindo amp-analytics. Entretanto, é necessário colocar a tag amp-pixel o mais perto possível do início de <body>. O pixel de rastreamento será acionado somente quando a tag for exibida. Se amp-pixel estiver posicionado perto da parte inferior da página, talvez ele não seja acionado.

Configuração simples de amp-analytics

Para criar uma configuração simples de amp-analytics, primeiro é necessário incluir esta declaração custom-element no <head> documento AMP (consulte também Declaração de inclusão de componente):

<script
  async
  custom-element="amp-analytics"
  src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"
></script>

O exemplo a seguir é semelhante ao exemplo de amp-pixel. Todas as vezes que uma página estiver visível, o evento será acionado e enviará os dados de exibição de página para uma URL definida, juntamente com um código aleatório:

<amp-analytics>
  <script type="application/json">

      {"requests":
        {"pageview": "https://foo.com/pixel?RANDOM
      ", },"triggers":
        {"trackPageview":
          {"on": "visible",
          "request": "pageview"

    } } }
  </script>
</amp-analytics>

No exemplo acima, definimos uma solicitação chamada "pageview" como https://foo.com/pixel?RANDOM. Como visto anteriormente, RANDOM é substituído por um número aleatório, de modo que a solicitação será algo parecido com https://foo.com/pixel?0.23479283687235653498734.

Quando a página se tornar visível (como especificado pelo uso da palavra-chave de acionamento visible), um evento será acionado, e a solicitação pageview será enviada. O atributo "triggers" determinará quando a solicitação "pageview" será acionada. Saiba mais sobre solicitações e acionamentos.

Substituição de variáveis

Tanto o componente amp-pixel quanto amp-analytics permitem todas as substituições de variáveis ​​de URL padrão (consulte Substituições de variáveis ​​de AMP HTML). No exemplo abaixo, a solicitação de exibição de página é enviada à URL juntamente com a URL canônica do documento AMP atual, o title e um código de cliente:

<amp-pixel
  src="https://example.com/analytics?url=${canonicalUrl}&title=${title}&clientId=${clientId(site-user-id)}"
></amp-pixel>

Por ser bastante simples, a tag amp-pixel só pode incluir variáveis ​​definidas pela plataforma ou que possam ser analisadas pelo runtime AMP a partir da página AMP. No exemplo acima, a plataforma preenche os valores de canonicalURL e clientId(site-user-id). A tag amp-analytics pode incluir as mesmas variáveis que amp-pixel, assim como as variáveis ​​definidas de modo exclusivo dentro da configuração da tag.

Use o formato ${varName} em strings de solicitação para variáveis definidas pela página ou pela plataforma. As variáveis amp-analytics substituirão o modelo por seu valor real no momento da construção da solicitação de análise (consulte também amp-analytics.

No exemplo de amp-analytics abaixo, a solicitação de pageview é enviada à URL com dados adicionais extraídos de substituições de variáveis, algumas fornecidas pela plataforma, outras definidas inline, dentro da configuração de amp-analytics:

<amp-analytics>
  <script type="application/json">
    {
      "requests": {
        "pageview": "https://example.com/analytics?url=${canonicalUrl}&title=${title}&acct=${account}&clientId=${clientId(site-user-id)}"
      },
      "vars": {
        "account": "ABC123"
      },
      "triggers": {
        "someEvent": {
          "on": "visible",
          "request": "pageview",
          "vars": {
            "title": "My homepage"
          }
        }
      }
    }
  </script>
</amp-analytics>

No exemplo acima, as variáveis account e title são definidas na configuração de amp-analytics. As variáveis canonicalUrl e clientId não são definidas na configuração, por isso os valores delas são substituídos pela plataforma.

IMPORTANTE – A substituição de variáveis é flexível. As mesmas variáveis ​​podem ser definidas em locais diferentes, e o runtime AMP analisará os valores nessa ordem de precedência (consulte Ordem da substituição de variáveis).

Identificação do usuário

Os websites usam cookies para armazenar informações específicas dos usuários no navegador. Os cookies podem ser usados ​​para informar que um usuário já visitou um site antes. No AMP, as páginas podem ser veiculadas pelo site de um editor ou por um cache (como o cache de AMP do Google). O website do editor e o cache provavelmente terão domínios diferentes. Por motivos de segurança, os navegadores podem limitar o acesso a cookies de outros domínios (consulte também Rastrear usuários em diferentes origens).

Por default, o AMP fornecerá um código de cliente, seja a página acessada pelo site original do editor ou por um cache. O código de cliente gerado pelo AMP tem o valor da string codificada "amp-" seguido por um base64 aleatório e permanece o mesmo para o usuário, caso ele volte a acessar a página.

O AMP administra a leitura e a gravação do código de cliente em todos os casos. Isto é importante principalmente no caso de páginas servidas por meio de um cache ou de alguma outra forma fora do contexto de exibição do site original do editor. Nestas circunstâncias, o acesso aos cookies do site do editor não estará disponível.

Quando uma página AMP é servida pelo site do editor, é possível fazer com que o framework de identificação do cliente usado pelo AMP busque e use um cookie de fallback. Nesse caso, o argumento cid-scope-cookie-fallback-name da variável clientId será interpretado como o nome do cookie. A formatação pode aparecer como CLIENT_ID(cid-scope-cookie-fallback-name) ou ${clientId(cid-scope-cookie-fallback-name)}.

Por exemplo:

<amp-pixel
  src="https://foo.com/pixel?cid=CLIENT_ID(site-user-id-cookie-fallback-name)"
></amp-pixel>

Se o AMP descobrir que o cookie está definido, a substituição da identificação do cliente retornará o valor do cookie. Se o AMP descobrir que esse cookie não está definido, ela gerará um valor no formato amp- seguido de uma string aleatória codificada base64.

Saiba mais sobre a substituição da identificação do cliente, incluindo como adicionar um código de notificação de ID de usuário opcional em Variáveis ​​suportadas em AMP Analytics.

Continue seu aprendizado sobre análises em Aprofunde-se no AMP Analytics e Casos de uso.