Direcionamento de página
Tabela de conteúdo
Curto e agradável
Com a ajuda da segmentação por página, você pode determinar em quais páginas do seu site um experimento é exibido. Nas configurações do experimento, você encontrará várias opções em „Segmentação de página“ para controlar a exibição com base em regras. A segmentação de páginas configurada corretamente também é um pré-requisito para iniciar um experimento.
Opções de segmentação de página
Com a ajuda de regras no Page Targeting, você determina em quais páginas ou tipos de página os visitantes se tornam participantes do experimento. Vários métodos estão disponíveis para você identificar páginas de forma exclusiva. Um experimento só é realizado se as condições definidas forem atendidas.
Também é possível vincular várias regras e usar as condições AND e OR.
| Método | Quando faz sentido |
|---|---|
| Regras de URL | Se as páginas puderem ser claramente distinguidas por domínio, caminho ou parâmetros, ou se apenas um URL específico tiver que ser direcionado. |
| Regex | Se vários URLs semelhantes tiverem que ser cobertos por um padrão. |
| Seletor CSS | Se você deseja segmentar várias páginas que não podem ser claramente distinguidas por meio de regras de URL, mas compartilham um elemento exclusivo. |
| JavaScript | Se você precisar de condições complexas que vão além do URL e do DOM, por exemplo, lógica, estados ou entradas de DataLayer. |
Você pode usar regras para definir as páginas ou os tipos de página em que seus visitantes se tornam participantes do experimento. Você tem várias opções para identificar páginas.
O uso do CSS Selector é útil se você quiser direcionar várias páginas, mas elas não podem ser claramente identificadas por meio de regras de URL.
Você pode usar JavaScript para definir regras de direcionamento mais complexas. Por exemplo, você também tem a opção de verificar se há entradas especiais no DataLayer.
Correspondência de URL
Com o URL Match, você usa regras de URL para determinar as páginas nas quais seu experimento é exibido. Você pode combinar várias regras de URL e definir quais devem ser aplicadas e quais devem ser excluídas.
Vinculação de várias regras de URL
Você pode criar várias regras de URL ao mesmo tempo e vinculá-las entre si. Use o símbolo de mais para adicionar outras regras. Use „matches“ ou „does not match“ para especificar se o experimento deve ser reproduzido nos URLs especificados ou excluído.
Se quiser mapear regras mais complexas, você pode combinar várias correspondências de URL. Por exemplo, você pode especificar que um experimento seja exibido em https://www.demo.de, exceto em https://www.demo.de/impressum.
Tipo de correspondência
À direita do campo de entrada, você pode especificar o tipo de correspondência da sua condição de direcionamento. Dependendo da seleção, o URL no campo de entrada próximo a ele é verificado quanto a várias condições. Você tem as seguintes condições para escolher:
- Correspondência simples
- Correspondência exata
- Contém
- Regex
As condições de direcionamento com exemplos de aplicação são explicadas em mais detalhes abaixo.
Correspondência simples
Com o Simple Match, todos os URLs inseridos são direcionados, inclusive os parâmetros de URL associados.
No exemplo a seguir, você pode ver quais variantes de URL são consideradas ocorrências para o URL www.demo.de no direcionamento de página „Simple Match“:
| URL | A segmentação se aplica |
|---|---|
| www.demo.de | ✅ aplica-se |
| www.demo.de#about | ✅ aplica-se |
| www.demo.de?color=red | ✅ aplica-se |
| www.demo.de/category | ❌ não se aplica |
| www.demo.com | ❌ não se aplica |
| subdomínio.demo.de | ❌ não se aplica |
| URL | A segmentação se aplica |
|---|---|
|
www.demo.de |
aplica-se |
|
www.demo.de#about |
aplica-se |
|
www.demo.de?color=red |
aplica-se |
|
www.demo.de/category |
Não se aplica |
|
www.demo.com |
Não se aplica |
|
sub.demo.de |
Não se aplica |
Se você quiser direcionar várias páginas, tipos de página ou subdomínios ao mesmo tempo, poderá usar regex para isso. Como alternativa, o direcionamento também é possível por meio de um seletor CSS, por exemplo, se um elemento específico estiver presente na página. Continue lendo.
Correspondência exata
Use a condição „Exact Match“ (Correspondência exata) se a segmentação de página se aplicar somente a um URL específico, ou seja, sem parâmetros de URL.
No exemplo a seguir, você pode ver quais variantes de URL são consideradas ocorrências para o URL www.demo.de no direcionamento de página „Exact Match“:
| URL | A segmentação se aplica |
|---|---|
| www.demo.de | ✅ aplica-se |
| www.demo.de#about | ❌ não se aplica |
| www.demo.de?color=red | ❌ não se aplica |
| www.demo.de/category | ❌ não se aplica |
| www.demo.com | ❌ não se aplica |
| subdomínio.demo.de | ❌ não se aplica |
| URL | A segmentação se aplica |
|---|---|
|
www.demo.de |
aplica-se |
|
www.demo.de/ |
Não se aplica |
|
www.demo.de#about |
Não se aplica |
|
www.demo.de?color=red |
Não se aplica |
|
www.demo.de/category |
Não se aplica |
|
www.demo.com |
Não se aplica |
|
sub.demo.de |
Não se aplica |
Contém
Você usa a condição de direcionamento de página „Contém“ se quiser direcionar várias páginas de um grupo específico. O pré-requisito é que as páginas possam ser delimitadas usando uma estrutura de URL consistente. Por exemplo, se você quiser testar somente páginas de produtos, poderá usar „Contains“ com „/products/“ para direcionar exatamente essas páginas. A expressão especificada deve aparecer pelo menos uma vez por completo no URL.
No exemplo a seguir, você pode ver diferentes variantes de URL em que o direcionamento de página „/products/“ se aplica.
| URL | A segmentação se aplica |
|---|---|
| www.demo.com | ❌ não se aplica |
| www.demo.com/products | ❌ não se aplica |
| www.demo.com/products/t-shirts | ✅ aplica-se |
| www.demo.com/products/pants | ✅ aplica-se |
| www.demo.com/blog/products-reviews | ❌ não se aplica |
| www.demo.com/blog/products/tests | ✅ aplica-se |
| URL | A segmentação se aplica |
|---|---|
|
www.demo.de |
Não se aplica |
|
www.demo.de/produkte |
Não se aplica |
|
www.demo.de/produkte/t-shirts |
aplica-se |
|
www.demo.de/produkte/hosen |
aplica-se |
|
www.demo.de/blog/produkte-reviews |
Não se aplica |
|
www.demo.de/blog/produkte/tests |
aplica-se |
Expressões regulares (Regex)
As expressões regulares permitem que você direcione seus testes A/B para páginas individuais ou grupos de páginas específicos. Em muitos casos, isso é mais preciso do que as condições de direcionamento apresentadas acima.
Essa opção destina-se principalmente a usuários avançados que já têm experiência com regex ou que desejam mapear regras muito precisas. Para facilitar o seu início, criamos este guia de segmentação de páginas com regex. Em muitos casos, é suficiente copiar um de nossos exemplos e simplesmente substituir seu próprio URL.
Para validar suas expressões regulares, você pode usar editores de regex, como regexr.com.
Exemplo de criação de uma regex
Na Plomo-o-Plata, todas as páginas de detalhes do produto na categoria Venda em outlet os preços de venda são exibidos em vermelho. As páginas de detalhes de produtos em outras categorias devem permanecer inalteradas.
Ao usar regex na segmentação de URL, você tem a opção de mapear explicitamente essa condição de segmentação.
Aqui está um exemplo de um URL que está localizado na categoria de venda de outlet.
A estrutura dos URLs é a mesma para todas as páginas de detalhes de produtos que podem ser encontradas nessa categoria:
https://plomo-o-plata.de/collections/plomo-o-plata-outlet-sale/products/…
Na tabela Aplicativos úteis você encontrará uma regex predefinida que pode ser transferida para a estrutura de URL do seu site usando este exemplo. Em nosso caso, aplica-se o caso de uso 3.
-> Direcionamento de todas as páginas que seguem o caminho www.demo.de/category/.
-> ^.*www\.demo\.de\/category\/.+
Em primeiro lugar, acessamos https://regexr.com/ e transferimos o caso de uso semelhante.
Agora podemos nos orientar sobre esse caso de uso e transferi-lo para o nosso exemplo de Plomo-o-Plata.
Aplicativos úteis
| Caso de uso | Página de exemplo | Expressão regular |
|---|---|---|
| Direcionamento para exatamente uma página | www.demo.de/product-list | ^.*www\.demo\.de\/product-list$ |
| Direcionamento para exatamente uma página, incluindo links de âncora, parâmetros e „/“ opcional“ | www.demo.de/?utm_source=google_cpc | ^.*www\.demo\.de(#.*|\/#.*|$|\/$|\/\?.*) |
| Direcionamento de todas as páginas que estão suspensas no caminho www.demo.de/category/ | www.demo.de/category/product | ^.*www\.demo\.de\/category\/.+ |
| Segmentação global de uma página sem „www“.“ | demo.de/ | ^.*demo.de\/.* |
| Segmentação global em todo o domínio www.demo.de/ | www.demo.de/ | ^.*www\.demo.de\/.* |
| Segmentação em um subdomínio blog.demo.de/ | blog.demo.de/category/article | ^.*blog\.demo.de\/.* |
| Segmentação em um domínio inteiro, incluindo subdomínios demo.de/ |
blog.demo.de/category/article www.demo.de/category/product |
^.*demo.de\/.* |
| Segmentação em duas categorias específicas de produtos |
www.demo.de/shirts/product www.demo.de/pants/product |
^.*www\.demo.de\/(shirts|pants)\/.* |
| Caso de uso | Página de exemplo | Expressão regular |
|---|---|---|
|
Direcionamento para exatamente uma página |
www.demo.de/product-list |
^.*www\.demo\.de\/product-list$ |
|
Direcionamento para exatamente uma página, incluindo links de âncora, parâmetros e "/" opcional |
www.demo.de/?utm_source=google_cpc |
^.*www\.demo\.de(#.*|\/#.*|$|\/$|\/\?.*) |
|
Direcionamento de todas as páginas que estão suspensas no caminho www.demo.de/category/ |
www.demo.de/category/product |
^.*www\.demo\.de\/category\/.+ |
|
Segmentação global de uma página sem "www". |
demo.de/ |
^.*demo.de\/.* |
|
Segmentação global em todo o domínio www.demo.de/ |
www.demo.de/ |
^.*www\.demo.de\/.* |
|
Segmentação em um subdomínio blog.demo.de/ |
blog.demo.de/category/article
|
^.*blog\.demo.de\/.* |
|
Segmentação em um domínio inteiro, incluindo subdomínios demo.de/ |
blog.demo.de/category/article
www.demo.de/category/product |
^.*demo.de\/.* |
|
Segmentação em duas categorias específicas de produtos |
www.demo.de/shirts/product
www.demo.de/pants/product |
^.*www\.demo.de\/(shirts|pants)\/.* |
Precisa de ajuda para configurar seu regex? Não tem problema!
Basta nos escrever uma mensagem com o grupo de páginas que você gostaria de segmentar. Nós lhe enviaremos o regex apropriado assim que possível.
Seletor de CSS
Direcionar somente páginas ou tipos de página nos quais um elemento específico com um seletor CSS exclusivo esteja presente. Isso é particularmente útil se as páginas não puderem ser diferenciadas de forma confiável usando regras de URL. Exemplo: você deseja direcionar todas as páginas de detalhes de produtos da sua loja, mas a estrutura de URL não contém uma referência clara, como „/products/“. Nesse caso, você pode usar um elemento que só aparece nas páginas de detalhes do produto, por exemplo, o botão „Adicionar à cesta“. Em seguida, você armazena o seletor CSS para esse elemento em Page Targeting.
A maneira mais fácil de encontrar um seletor CSS adequado é diretamente no editor visual do Varify: abra uma página adequada, clique no elemento que só aparece nesse tipo de página e copie o seletor CSS exibido. Em seguida, você pode inseri-lo no Page Targeting em „CSS Selector“.
JavaScript
Você pode usar o JavaScript para uma segmentação de página mais complexa. Dessa forma, você também pode pesquisar quaisquer tags ou atributos no DOM do seu site. O JavaScript também permite que você verifique dados de variáveis da camada de dados.
Exemplo de aplicativo - Entrada de camada de dados
Para direcionar apenas os usuários que têm um parâmetro específico ou um valor específico na camada de dados, você pode percorrer a camada de dados. No exemplo a seguir, apenas os usuários que visualizaram anteriormente um produto específico com ID 1111 ou ID 2222 são direcionados.
Exemplo de código - Direcionamento da camada de dados
return dataLayer?.some(item => item?.ecommerce?.checkout?.products?.[0]?.id==='1111' || item?.ecommerce?.checkout?.products?.[0]?.id==='2222');
Configurações avançadas
Experiência de limpeza na mudança de URL
Os sites que recarregam conteúdo dinamicamente, como aplicativos de página única (SPAs) ou lojas on-line que oferecem diversas variantes de produtos na página de detalhes do produto, comportam-se de forma diferente das páginas estáticas tradicionais. Nas páginas estáticas, todo o conteúdo é completamente recarregado a cada alteração de URL. Com SPAs e sites dinâmicos semelhantes, por outro lado, somente o conteúdo que muda é atualizado.
Comportamento com alterações de URL
Por padrão, a Varify executa uma redefinição da reprodução de variantes para cada alteração de URL, ou seja, todas as variações na página são redefinidas, a URL é verificada novamente e todas as variações aplicáveis à nova URL são reaplicadas.
Desativação da função padrão
Desativar a função "Cleanup Experiment on URL change" pode ser particularmente útil em páginas de produtos de lojas on-line em que você pode selecionar diferentes variantes de produtos, como cores. Com essa seleção, o URL pode mudar para refletir a cor selecionada. Entretanto, se houver uma variação relacionada a um conteúdo que não muda (por exemplo, o botão "Adicionar à cesta"), não seria desejável excluir e reaplicar essa variação. Isso poderia levar a efeitos indesejáveis, como a cintilação da tela.
Reaplicar o experimento na alteração do DOM
Quando a configuração é ativada, o DOM do site é monitorado permanentemente para garantir que a otimização da variante permaneça ativa. Se a otimização for substituída por scripts ou elementos de página no site, o sistema reconhecerá esse fato e reaplicará a otimização. Isso pode ocorrer, por exemplo, ao filtrar determinadas variantes de produtos.
Se a configuração for desativada, a otimização será aplicada apenas uma vez - o monitoramento contínuo não ocorrerá.