É assim que suas empresas favoritas usam pop-ups de sites para crescer (e você também pode!)

Publicados: 2020-04-02

Existem dois tipos de pessoas.

Aqueles que amam pop-ups de sites e aqueles que os odeiam.

O primeiro grupo sabe como os pop-ups de sites podem ser ridiculamente eficazes. O segundo grupo os considera ridiculamente irritantes.

Mas qual é a diferença real entre um pop-up de um site bom e um ruim?


Examinando centenas deles, concluímos o seguinte. Tudo se resume a três coisas:

  • Qual é a aparência desses pop-ups

  • Que valor eles entregam

  • Quando exatamente eles aparecem

Quer dizer, sim, alguns popups são interruptores de experiência irritantes, desagradáveis ​​e feios.

Mas isso é porque eles foram configurados da maneira errada.

Por exemplo, dê uma olhada neste surpreendente pop-up no site da Nike:

Pop-up do site no site da Nike anuncia uma venda em todo o site

Alguém diria que é desagradável ou irritante?

Foi bem o que pensei.

O pop-up da Nike parece elegante e agrega valor (descontos aplicados automaticamente na finalização da compra, yay!). E certamente também não interrompe a experiência. Se qualquer coisa - é uma parte integrante dela.

Existem milhares de empresas grandes e conhecidas usando pop-ups de sites para coletar e-mails, anunciar vendas e exibir frases de chamariz. Pegue o The New York Times, Adidas, The Guardian, Century 21 ou Slack como um exemplo - e a lista pode continuar indefinidamente!

Então, por que não aprender com os melhores e aplicar sua abordagem para expandir seus negócios?

Você provavelmente acha que precisa de um desenvolvedor ou do orçamento dessas grandes empresas para adicionar um pop-up com aparência profissional ao seu site. Bem, isso não é verdade.

Nesta postagem do blog, mostraremos 15 exemplos de pop-ups de sites usados ​​por algumas das empresas mais conhecidas em vários nichos. Também explicaremos por que cada pop-up é tão eficaz.

A melhor parte? Mostraremos exatamente como recriá-los em seu site em minutos usando Getsitecontrol.

Para ajudá-lo a navegar, dividimos a lista em 3 categorias. Você está prestes a ver pop-ups de sites que ajudam:

  • Obtenha assinantes de e-mail

  • Exibir frases de chamariz

  • Anuncie quaisquer atualizações

Sinta-se à vontade para pular para a categoria na qual você mais tem interesse.

Pop-ups de sites que ajudam as marcas a criar listas de e-mail

Todo mundo está louco para aumentar suas listas de e-mail agora. E você também deveria estar!

Caso você tenha perdido, o e-mail tem um ROI colossal de $ 44 para cada dólar gasto.

Ter pessoas em sua lista de e-mail significa que você possui a permissão exclusiva para encontrá-los diretamente em suas caixas de entrada, desenvolver um relacionamento e transformá-los em clientes recorrentes.

Espere, mas qual é a melhor maneira de aumentar uma lista de e-mail? Aposto que você já sabe a resposta.

São pop-ups de sites.

Vamos ver como as marcas das quais você certamente já ouviu falar (e provavelmente até das quais comprou) usam pop-ups para coletar endereços de e-mail.

1. Loja do New York Times - 10% DE DESCONTO em seu primeiro pedido

O New York Times foi um dos primeiros a evoluir para uma mídia online de assinatura paga.

Hoje, este é o site do jornal mais visitado. E eles usam pop-ups de sites para vários fins.

Por exemplo, veja este formulário minimalista de assinatura de e-mail que aparece assim que você acessa a loja online do The New York Times.

A loja do New York Times usa um pop-up de site para coletar e-mails

Aqui está o que torna este pop-up ótimo:

  • Design coeso
    O pop-up tem o mesmo tema de cor e a mesma fonte do resto da The NYT Store. Ele aparece como parte integrante e confiável do site.

  • Ímã de chumbo
    Você não é apenas convidado a se inscrever em novas ofertas, mas também ganha um desconto de 10% no seu primeiro pedido se entrar na lista.

  • Aparência instantânea
    Sempre não está claro se os pop-ups de um site devem aparecer imediatamente ou depois que um visitante passa algum tempo em uma página. Nesse caso, exibir o formulário instantaneamente é certamente melhor do que depois que um cliente em potencial faz uma compra, não é?

Quer adicionar um pop-up de inscrição semelhante ao seu site?

Seguimos o espírito criativo do The New York Times para construir um formulário de assinatura semelhante. Clique no pop-up do site abaixo para vê-lo em ação. Em seguida, siga as instruções simples que aparecerão no lado direito da página.

Pop-up minimalista de construção de lista de e-mail alimentado por Getsitecontrol Ver visualização ao vivo →

O modelo de visualização ao vivo será adicionado diretamente ao seu painel Getsitecontrol. A partir daí, você poderá ajustar os detalhes como a porcentagem de desconto, o título e o tema da cor para torná-lo uma combinação perfeita para o seu site.

Então, você será capaz de usar o Alvejando configurações para especificar a página onde deseja que o pop-up apareça.

2. Century 21 - desbloqueie $ 25 OFF ou pague o preço total

Century 21, a gigante do varejo de moda com preços acessíveis, entrou na Internet há alguns anos e também entrou no jogo de construção de listas de e-mail. Verifique o pop-up exibido alguns segundos após você chegar ao site.

Century 21 usa um botão de opt-out negativo em seu pop-up

Aqui está o que é ótimo sobre o pop-up deste site:

  • Microcópia de formato de email
    A Century 21 escolheu especificar a aparência de um endereço de e-mail para garantir que os clientes o entendam corretamente. Saber que seu público é muito amplo e inclui pessoas que não são necessariamente conhecedoras de tecnologia, esta é uma ótima decisão.

  • Botão de desativação negativo
    Claro, você não precisa se inscrever se não quiser. Mas isso significa que você está disposto a pagar o preço total, certo? O botão de cancelamento é um pequeno detalhe que o faz pensar duas vezes antes de recusar a oferta.

  • Escolha inteligente de cores
    Observe, não apenas as cores deste pop-up se correlacionam com o tema do site, mas o botão “Continuar” também é enfatizado em vermelho. Enquanto isso, o botão opt-out apenas se mistura com o plano de fundo.

Quer um pop-up com um botão de desativação para o seu site?

Se você gosta do pop-up deste site, recriá-lo é tão fácil quanto 1-2-3. Basta clicar no modelo abaixo e seguir as instruções.

Um pop-up de inscrição de e-mail com botões de Getsitecontrol Ver visualização ao vivo →

Assim que chegar ao painel, vá até o Contente configurações para ajustar a cópia e o tema de cores, se necessário. Seguindo o exemplo da Century 21, você também pode adicionar seu logotipo ao topo.

3. Marie Claire - o efeito FOMO em ação

Se você acha que os botões de opt-out negativos podem funcionar apenas para lojas online, pense novamente.

Ao oferecer conteúdo de alta qualidade por e-mail, você também pode lembrar as pessoas sobre as consequências de não se inscrever. Basta observar como a revista Marie Claire usa o efeito FOMO em seu botão de desativação.

Marie Claire oferece um lead magnet em troca de assinatura

Aqui está o que gostamos no pop-up deste site:

  • O botão negativo de desativação
    Além do efeito FOMO, observe como Marie Claire transformou o botão de cancelamento em uma declaração de amor próprio.

  • A cópia do CTA de inscrição de e-mail
    Existem tantos apelos à ação de incentivo que você pode colocar no botão de inscrição em vez de apenas "Inscrever-se". “Mostre-me o que está dentro!” é um deles.

  • A escolha de uma imagem
    E, neste caso, não é qualquer imagem. É uma foto de Saoirse Ronan, uma atriz talentosa que a maioria dos leitores certamente reconhecerá.

Por que a imagem é tão importante aqui?

Ter um visual que corresponda às expectativas dos seus assinantes é crucial para aumentar a taxa de inscrição no e-mail. Porque eles não estão apenas aderindo a algumas tendências de cabelo. Eles estão se inscrevendo para receber a receita para parecer uma estrela de Hollywood no tapete vermelho.

Acha que pode querer um pop-up de site como este?

O construtor de pop-up Getsitecontrol tem um modelo que o ajudará a recriar facilmente o exemplo acima. Confira abaixo.

Um modelo de pop-up de site com uma imagem ocupando metade do espaço Ver visualização ao vivo →

Depois de adicioná-lo ao seu painel, você poderá substituir facilmente a imagem pelo seu visual ou escolher uma imagem alternativa na galeria.

4. Adidas - ganhe 15% DE DESCONTO em troca de assinatura de e-mail

A Adidas oferece um desconto de 15% para novos assinantes com um pop-up que aparece depois que você passa algum tempo no site deles.

Pop-up do site da Adidas com uma caixa de seleção de consentimento

Agora, aqui está o que é especialmente interessante sobre o pop-up do site da Adidas:

  • A microcópia na parte inferior Para aliviar o medo de receber spam de e-mails irrelevantes, a Adidas especificou exatamente o que você está assinando.

  • A caixa de seleção de confirmação de idade Seguindo a Lei de Proteção à Privacidade Online das Crianças (COPPA), cada assinante deve confirmar que tem mais de 13 anos. Essa caixa de seleção também pode ser usada para coletar consentimento explícito para receber e-mails de marketing.

  • Segmentação baseada em gênero Com base em sua resposta, a Adidas aplicará posteriormente as regras de segmentação para enviar a você o conteúdo mais relevante. No entanto, também é inteligente definir esse campo como opcional, considerando quantos itens de gênero neutro a Adidas produz.

  • Confirmação de inscrição Depois de se inscrever, você verá uma chamada “mensagem de sucesso do envio” informando o que esperar.

Mensagem de sucesso de envio do formulário no site da Adidas

Uma opção alternativa aqui seria exibir o código de desconto para as pessoas copiarem e colar no caixa. Dessa forma, eles poderiam continuar comprando sem sair da loja para abrir o e-mail.

5. Ahrefs - não perca o próximo artigo

Vamos passar para o mundo da TI.

Ahrefs, um conhecido desenvolvedor de software de SEO, usa este lindo slide-in para sugerir a assinatura de seu boletim informativo assim que chegar ao final de uma postagem no blog.

Ahrefs usa um pequeno slide lateral para exibir um formulário de inscrição por e-mail

Aqui está o que é tão bom sobre isso:

  • Um formato diferente
    Ao contrário dos pop-ups modais, os slides são menos intrusivos, mas atraentes o suficiente para serem notados. Eles podem ser a escolha perfeita para projetos de conteúdo em que você deseja manter a experiência de leitura o mais tranquila possível.

  • Gatilho de comportamento na página
    O formulário só aparece quando você chega ao final de uma postagem no blog. É o momento perfeito para sugerir uma assinatura porque o nível de engajamento é alto.

  • O princípio FOMO
    Se você chegou ao final de um dos longreads de Ahref, há grandes chances de você ter gostado. E você não vai querer perder outra grande peça como esta.

Deseja adicionar um slide-in semelhante ao seu site?

É fácil recriar este formulário de inscrição. Construímos um slide-in do lado direito semelhante, para que você possa instalá-lo rapidamente em seu site.

Um modelo deslizante de assinatura de e-mail da Getsitecontrol Ver visualização ao vivo →

Clique no widget para vê-lo em ação e siga as instruções.

Quando estiver pronto, use o Alvejando configurações para selecionar páginas específicas em seu site onde você deseja que o slide-in apareça, bem como as condições para quando ele deve aparecer.

6. Product Hunt - assine o boletim informativo diário

Product Hunt é uma das maiores comunidades online onde produtos de tecnologia incríveis são lançados todos os dias. Aqueles que não têm tempo para verificar o site diariamente podem obter resumos das atualizações mais importantes por meio de assinatura de e-mail.

Para aumentar o número de assinaturas, o Product Hunt apresenta uma barra flutuante de inscrição de e-mail na parte inferior da página.

O Product Hunt usa uma barra de opção de e-mail flutuante para coletar e-mails

Aqui está o que é ótimo sobre este formulário de inscrição:

  • Distração mínima
    Barras flutuantes são as menos intrusivas de todos os pop-ups de sites. Eles ficam na parte superior ou inferior de uma página da Web enquanto você rola o conteúdo e aguardam pacientemente até que você esteja pronto para se inscrever.

  • Frequência do boletim informativo
    A cópia informa exatamente com que frequência você receberá e-mails do Product Hunt.

  • Design autêntico
    O emoji e a cor do botão são os elementos de assinatura do Product Hunt. É uma ótima decisão usá-los no formulário.

Quer uma barra flutuante de inscrição de e-mail para você?

Você pode adicionar um widget semelhante ao seu site e exibi-lo em todo o site ou em páginas específicas. Use o modelo pronto abaixo para começar.

Barra flutuante simples com um campo de e-mail por Getsitecontrol Ver visualização ao vivo →

A cópia e o design do modelo são bastante versáteis, então sinta-se à vontade para usá-lo em seu site da maneira que está.

Pop-ups do site para exibir sua frase de chamariz

É hora de passar para a próxima categoria!

O segundo grande motivo pelo qual as empresas usam pop-ups de sites é para incentivar os visitantes a obter um desconto, verificar uma nova postagem do blog, participar de um sorteio - em outras palavras, agir .

Vamos ver como as empresas da vida real estão fazendo isso.

7. Century 21 - ganhe um desconto antes de ir

Se você começar a navegar na loja online Century 21, você precisa ter uma imensa força de vontade e resistir ao impulso de pegar ofertas especiais que estão esperando por você em cada esquina.

Primeiro, eles estão pedindo que você assine em troca de um cupom de desconto de $ 25. E então, se você estiver tentando sair sem fazer uma compra, verá este pop-up do site:

Century 21 usa a tecnologia de intenção de saída para oferecer um desconto

Se você clicar no botão “Sim, por favor!” botão, o código do cupom é exibido à direita no pop-up. Você pode copiar o código e colá-lo na finalização da compra. Simples. Eficaz.

Aqui está porque a abordagem de intenção de saída funciona tão bem:

  • Atenção garantida
    Não há como perder uma oferta de desconto que surge na frente de seus olhos quando você está navegando para sair.

  • Último recurso
    Os pop-ups de intenção de saída praticamente oferecem a oportunidade única de converter as pessoas que estão prestes a sair. Claro, nem todo visitante abandonado responderá. Mas alguns deles vão - e todo esforço conta, certo?

Quer colocar um pop-up de intenção de saída no seu site?

Confira o modelo abaixo. Já está configurado para aparecer quando seus visitantes começarem a navegar para sair da página.

Um modelo de pop-up de intenção de saída com uma oferta de desconto da Getsitecontrol Ver visualização ao vivo →

Coloque-o em seu site com apenas alguns cliques e vá para o Alvejando configurações para especificar a página onde deve aparecer. Por exemplo, você pode querer colocá-lo em páginas de produtos, páginas de categorias ou até mesmo na finalização da compra para evitar o abandono do carrinho de compras.

8. Skillshare - promoção do programa de referência

Skillshare, uma plataforma de aprendizagem online, está executando um programa de referência que permite que você ganhe meses de aulas grátis convidando amigos. Observe a barra flutuante que eles colocaram no topo de cada página.

Skillshare usa uma barra flutuante superior para promover seu programa de indicações

O que a Skillshare fez bem aqui:

  • Cor contrastante
    A Skillshare escolheu o branco porque chama a atenção devido ao tema de cor azul escuro do site.

  • Detalhes suficientes
    Apesar da falta de espaço, a cópia fornece informações suficientes para você decidir se está interessado ou não.

  • Botão Limpar CTA
    O botão “Convidar amigos” define expectativas claras. Ele o leva para a página dedicada, onde você pode aprender os detalhes e obter seu link de indicação.

9. The New York Times - leia as atualizações importantes agora

Se o seu projeto é focado em conteúdo, você pode usar pop-ups para promover a última peça do blog, atualizações importantes sobre tópicos selecionados ou apenas materiais relevantes.

Por exemplo, é assim que o The New York Times estava chamando a atenção de seus leitores para atualizações ao vivo sobre o surto de COVID-19.

O New York Times instalou uma barra flutuante para chamar a atenção para as notícias importantes

Barras de call to action na parte inferior de uma página da web são usadas por vários veículos de mídia para diversos fins. Basta verificar nosso próximo exemplo com um pop-up de aparência semelhante.

10. The Guardian - apoie o Guardian hoje

Ao contrário do The New York Times, o The Guardian optou por manter todos os seus materiais em acesso aberto, enquanto os leitores podem participar do financiamento do jornal na forma de doações. Veja como eles comunicam essa mensagem usando um pop-up na parte inferior da página.

The Guardian usa uma barra adesiva amarela para incentivar os visitantes a fazerem doações

Quer usar um pop-up semelhante em seu site?

Quando você deseja enfatizar a mensagem, claramente, essas barras adesivas são perfeitas para chamar a atenção. Confira o modelo abaixo se desejar adicionar um ao seu site.

Um modelo de barra aderente inferior por Getsitecontrol Ver visualização ao vivo →

Depois de adicioná-lo ao painel de controle Getsit, vá para o Contente guia e abra as configurações do botão para colocar o link para a página desejada.

Pop-ups do site para fazer anúncios em todo o site

A última categoria de pop-ups de sites tem como objetivo informar os visitantes, em vez de incentivá-los a agir.

Se você deseja manter seu público atualizado com as notícias e os termos atuais, os pop-ups do site são perfeitos.

Você pode usá-los para espalhar a palavra sobre as mudanças nas operações de negócios, ofertas atuais ou novas políticas - como a política de consentimento de cookies, por exemplo.

Vamos dar uma olhada em como Reebok, Tiffany, Nespresso, Intercom e Slack lidam com esse tipo de comunicação.

11. Reebok - anúncio de venda em todo o site

Para garantir que todos que acessam seu site sejam informados sobre a venda em todo o site, a Reebok colocou uma barra de anúncio flutuante no topo da página.

A Reebok anuncia uma venda em todo o site usando uma barra adesiva preta na parte superior da página

Este anúncio não requer nenhuma ação do visitante do site. Você pode pensar nisso como uma boa surpresa e um incentivo para continuar navegando na loja.

12. Tiffany & Co. - lembrete de serviço gratuito

Veja como a Tiffany & Co. informa aos visitantes da loja online que o envio e a devolução são gratuitos para todos os pedidos. Eles estão usando uma barra flutuante azul da Tiffany no topo de uma página da web.

Tiffany & Co escolhe sua cor de assinatura para a barra de anúncio pegajosa

Se você tiver os códigos de cores para o tema do seu site, poderá usá-los no pop-up Aparência / CSS configurações para criar uma barra de anúncio perfeitamente correspondente, assim como a da Tiffany.

13. Nespresso - possível anúncio de atraso na entrega

O último exemplo de barra flutuante pertence ao site da Nespresso. Eles estão avisando os clientes online, notificando-os sobre o atraso na entrega.

A Nespresso notifica os clientes sobre atrasos na entrega usando um sticky par

Novamente, você deve ter notado que a cor da barra flutuante não foi escolhida aleatoriamente - ela combina perfeitamente com o botão “Pesquisar” abaixo.

Quer recriar esses pop-ups de sites?

Para alcançar seu público com uma mensagem breve, mas importante, as barras flutuantes são ótimas. Para adicionar um ao seu site, basta clicar no modelo abaixo e editar a cópia.

Getsitecontrol fornece um modelo de barra de anúncio aderente minimalista Ver visualização ao vivo →

Sinta-se à vontade para mudar a cor para uma que fique melhor em seu site. O tema de cores está disponível no Aparência guia do painel de controle Getsit.

14. Slack - banner de consentimento de cookie

Os dois últimos exemplos em nossa lista são banners de cookies.

Como você provavelmente sabe, a partir de 2018, todos os sites que recebem visitantes da UE precisam obter seu consentimento informado para usar cookies que rastreiam os dados do usuário.

Essa é a aparência da mensagem do cookie no site do Slack.

O Slack usa um pop-up do site para exibir a mensagem de consentimento do cookie

O Slack optou por usar um slide-in do lado direito que leva à política de consentimento de cookies e fecha ao clicar.

Se você quiser colocar um semelhante, use o modelo abaixo.

Getsitecontrol permite que você instale e personalize um banner de cookie Ver visualização ao vivo →

Você pode adicionar esse pop-up ao seu site como ele está ou inserir um link para a página da Política de cookies na cópia do widget, assim como o Slack fez.

15. Intercom - barra aderente de consentimento de cookies

A Intercom, um popular desenvolvedor de plataforma de mensagens, optou por uma barra adesiva menos intrusiva no topo de uma página da web para notificar seus visitantes sobre a política de cookies.

A Intercom optou por exibir a notificação de cookie em uma barra flutuante

Se você preferir esta opção, vá em frente e clique aqui para verificar o modelo Getsitecontrol para uma barra de consentimento de cookies.

Pronto para usar pop-ups de sites para expandir seus negócios?

Se você sempre teve curiosidade de saber se os pop-ups de um site podem ajudar a expandir seus negócios, hoje é o dia de descobrir.

Não sabe com o que começar?

Aqui estão nossos 3 pop-ups de sites mais populares:

  • formulário de inscrição por e-mail,

  • banner de consentimento de cookies,

  • promoção de oferta especial.

Escolha o mais relevante para o seu negócio (ou adicione todos eles ao seu site de uma vez) usando Getsitecontrol e experimente gratuitamente.

Você está lendo o blog Getsitecontrol, onde especialistas em marketing compartilham táticas comprovadas para expandir seus negócios online. Este artigo faz parte da seção de engajamento do cliente.

Assine nossa newsletter → Ilustração principal de Icons8