15 exemplos de página de agradecimento com código e próximos passos | We.Inc
Quinze designs originais de página de agradecimento para pedidos, cadastros, agendamentos, downloads e doações, cada um com HTML e CSS editáveis e um próximo passo claro.
Exemplos de página de agradecimento
Uma boa página de agradecimento confirma o que acabou de acontecer, diz o que vem a seguir e quando, e oferece exatamente um próximo passo útil. Abaixo estão quinze designs originais para pedidos, cadastros, agendamentos, downloads, doações e mais, cada um escrito em HTML e CSS simples que você pode editar aqui e copiar para o seu site.
Combine o próximo passo com o que o visitante acabou de fazer
O visitante acabou de...
Confirme
Melhor próximo passo único
Comprar algo
Número do pedido, itens, previsão de entrega
Acompanhar o pedido ou criar uma conta
Assinar uma newsletter
Qual endereço, com que frequência você envia
Conferir a caixa de entrada para confirmar, ou ler um post introdutório
Agendar um horário
Data, hora, local ou link de vídeo
Adicionar à agenda
Baixar um arquivo
Nome do arquivo, um link de download alternativo
Guia ou ferramenta relacionada
Enviar um formulário de contato
Prazo de resposta, uma cópia da mensagem
Ver respostas para perguntas comuns
Fazer uma doação
Valor, recibo por e-mail
Compartilhar ou configurar uma doação mensal
A maioria dos visitantes chega a uma página de agradecimento no momento em que mais confia em você, e depois vai embora porque a página não diz nada. Estes exemplos foram feitos para esse momento. Cada um é um trecho completo e editável para uma empresa fictícia, no tamanho certo para encaixar em uma página, e cada um mostra uma forma diferente de guiar o visitante até o passo que importa em seguida.
Percorra os exemplos por situação: compras, cadastros, agendamentos, downloads e mensagens, depois doações e eventos.
Edite o código ao lado de qualquer exemplo e o quadro de resultado se atualiza enquanto você digita. Os scripts ficam desativados no quadro.
Copie o trecho, troque pelos seus próprios textos e cores, e coloque na página para onde o seu formulário ou checkout envia as pessoas.
Passe pela checklist acima dos exemplos antes de publicar, para que a página responda ao que os visitantes vão querer saber.
Repita o detalhe principal: o endereço de e-mail, o horário agendado ou o número do pedido. Isso tranquiliza as pessoas e pega erros de digitação cedo.
Diga quando a próxima coisa acontece. Um e-mail de confirmação que chega em cinco minutos parece quebrado se ninguém avisou para esperar por ele.
Ofereça uma única ação principal. Um monte de botões sociais, ofertas extras e links divide a atenção e geralmente recebe menos cliques em cada um deles.
Mantenha o cabeçalho do site para que as pessoas possam continuar navegando, mas tire pop-ups e caixas de newsletter para quem acabou de se cadastrar.
Adicione uma meta tag robots noindex às páginas de agradecimento para que elas não apareçam nos resultados de busca para quem nunca converteu.
Perguntas frequentes
O que uma página de agradecimento deve dizer?
Três coisas: uma confirmação exata do que aconteceu, o que o visitante deve esperar a seguir e quando, e uma ação clara para fazer agora. Todo o resto é opcional.
Uma página de agradecimento deve ser indexada pelos buscadores?
Geralmente não. Adicione <meta name="robots" content="noindex"> ao head. O Google avisa que, se o robots.txt bloquear a página, o rastreador nunca vê a regra noindex, então não bloqueie a mesma página no robots.txt também.
Uma página de agradecimento é melhor que uma mensagem de sucesso na própria página?
Uma página separada tem seu próprio endereço, o que facilita o rastreamento de conversões e dá espaço para um próximo passo. Uma mensagem na própria página mantém as pessoas onde estão, o que combina com formulários pequenos como uma caixa de comentário. As duas devem confirmar em palavras o que aconteceu.
O que faz uma boa página de confirmação de pedido?
O número do pedido em letras grandes, um resumo curto dos itens e do total, a previsão de entrega ou retirada, o endereço de e-mail para onde foi o recibo e um único link para acompanhar ou gerenciar o pedido.
Posso fazer upsell em uma página de agradecimento?
Sim, se a oferta tiver relação clara com o que a pessoa acabou de fazer e não empurrar os detalhes da confirmação para baixo. Um acessório que combina ou uma recompensa por indicação é muito mais bem-vindo que um banner de promoção genérico.
Por que a página depois do formulário importa
O envio de um formulário ou um checkout é o único momento em que você sabe exatamente o que alguém queria. A página seguinte pode acalmar dúvidas, evitar e-mails ao suporte e iniciar o próximo passo da relação, ou pode ser um beco sem saída que só diz obrigado.
Escreva a página como a resposta para a próxima pergunta do visitante. Depois de pagar, é quando o pacote chega. Depois de agendar, é para onde ir e como remarcar. Depois de um download, é se o arquivo foi mesmo salvo.
Confirmação acessível
Dê à página um título claro como Pedido confirmado em vez de um ícone sozinho, e não dependa só da cor para indicar sucesso. Se você mostrar a confirmação na própria página em vez de em uma nova, coloque-a em um elemento com role="status" para que os leitores de tela a anunciem com educação, sem mover o foco.
Depois de uma compra
1. Pedido confirmado com número de pedido grande
O número é a primeira coisa que o suporte vai pedir, então ganha o maior tamanho de letra depois do título.
2. Linha do tempo do envio
Três etapas mostram onde o pedido está e definem o prazo de entrega antes que alguém precise perguntar.
3. De checkout como convidado para conta
Um comprador convidado já digitou um e-mail, então a página oferece um campo de senha para guardar o histórico de pedidos.
4. Complemento relacionado, abaixo da confirmação
A oferta fica abaixo dos detalhes da confirmação e tem relação com o que foi comprado, então soa como ajuda e não como venda forçada.
Depois de um cadastro
5. Confira sua caixa de entrada
Listas com confirmação dupla precisam deste passo. Mostrar o remetente e o assunto ajuda as pessoas a encontrar o e-mail rápido.
6. Boas-vindas com uma leitura inicial
Quando alguém se inscreve, aponte para o melhor conteúdo que você já publicou em vez de fazer a pessoa esperar a próxima edição.
7. Teste grátis iniciado
Uma lista curta de configuração em três passos transforma uma conta vazia em progresso, com o primeiro passo marcado como o ponto de partida.
Depois de um agendamento ou de uma mensagem
8. Consulta com adicionar à agenda
Data, hora e local em um bloco compacto, com links para a agenda e para remarcar logo ao lado.
9. Reunião inicial agendada com perguntas de preparação
Uma lista curta de preparação torna a reunião mais útil e define as expectativas dos dois lados sem alarde.
10. Mensagem recebida com prazo de resposta
Repetir a mensagem prova que ela chegou, e um prazo real de resposta evita que as pessoas a enviem duas vezes.
11. Pedido de orçamento com referência
Um número de referência e uma pessoa com nome fazem um pedido de orçamento parecer atendido, e não perdido em uma fila.
Depois de um download, uma doação ou uma inscrição em evento
12. Download com link alternativo
Os navegadores às vezes bloqueiam downloads automáticos, então um link visível e o tamanho do arquivo cobrem o caso em que nada apareceu.
13. Doação com impacto e recibo
Dizer o que a doação faz e confirmar o recibo funciona melhor que um obrigado genérico. A opção mensal é oferecida uma vez, com delicadeza.
14. Inscrição em evento com ingresso
Um bloco em formato de ingresso guarda os detalhes que as pessoas procuram no dia: data, horário de abertura e o nome delas.
15. Lista de espera com incentivo a indicar
Uma lista de espera é o único lugar onde um convite para compartilhar se encaixa, porque convidar amigos dá ao visitante algo que ele quer.
O título diz em palavras o que acabou de acontecer
O detalhe principal é repetido (número do pedido, e-mail, horário)
Diz o que chega a seguir e mais ou menos quando
Há um único próximo passo principal, com estilo de botão principal
Há uma forma de corrigir um erro (e-mail errado, remarcar, cancelar)
A navegação do site continua disponível para seguir navegando
Nenhum pop-up ou caixa de cadastro para quem acabou de se cadastrar
A página tem uma meta tag robots noindex
Checklist da página de agradecimento
{n} de {total} feitos
Tudo pronto. Sua página de agradecimento responde ao que os visitantes vão querer saber.