Criar um e-mail com HTML personalizado
As mensagens de e-mail são ótimas para entregar conteúdo aos seus usuários nos termos deles. Também são excelentes ferramentas para reengajar usuários que podem até ter desinstalado seu app. Enviar mensagens de e-mail personalizadas e sob medida vai melhorar a experiência dos seus usuários e ajudá-los a extrair o máximo valor do seu app.
Para ver exemplos de campanhas de e-mail, confira nossos Casos de uso.
Se esta é a primeira vez que você cria uma campanha de e-mail, recomendamos fortemente conferir estes cursos do Braze Learning:
Etapa 1: Escolha onde criar sua mensagem
Use Campaigns para envios de mensagens simples e únicos. Use Canvas para jornadas de usuários com múltiplas etapas.
- Acesse Messaging > Campaigns e selecione Create Campaign.
- Selecione Email ou, para Campaigns direcionadas a múltiplos canais, selecione Multichannel.
- Dê à sua Campaign um nome claro e significativo.
- Adicione equipes e tags conforme necessário.
- Tags facilitam a busca de suas Campaigns e a criação de relatórios. Por exemplo, ao usar o Report Builder, você pode filtrar por tags específicas.
- Adicione e nomeie quantas variantes forem necessárias para sua Campaign. Para saber mais sobre esse tópico, consulte Testes multivariantes e A/B.
Se todas as mensagens da sua Campaign forem semelhantes ou tiverem o mesmo conteúdo, crie sua mensagem antes de adicionar variantes adicionais. Depois, escolha Copy from Variant no menu suspenso Add Variant.
- Crie seu Canvas usando o criador de Canvas.
- Depois de configurar seu Canvas, adicione uma etapa no construtor de Canvas. Dê à sua etapa um nome claro e significativo.
- Escolha um cronograma de etapa e especifique um delay conforme necessário.
- Filtre seu público para esta etapa conforme necessário. Você pode refinar ainda mais os destinatários desta etapa especificando Segments e adicionando filtros adicionais. As opções de público serão verificadas após o delay, no momento em que as mensagens forem enviadas.
- Escolha seu comportamento de avanço.
- Escolha quaisquer outros canais de envio de mensagens que você deseja combinar com sua mensagem.
Se você pretende criar HTML personalizado e precisa que os planos de fundo permaneçam consistentes no app móvel do Gmail com o modo escuro do dispositivo ativado, consulte App móvel do Gmail e cores de fundo no modo escuro.
Para obter acesso ao editor de HTML, entre em contato com o administrador de TI para verificar se seu firewall está *.bz-rndr.com na lista de permissões.
Etapa 2: Selecione sua experiência de edição
A Braze oferece duas experiências de edição ao criar uma campanha de e-mail: nosso editor de arrastar e soltar e nosso editor de HTML padrão. Escolha o bloco apropriado para a experiência de edição que você preferir.
Depois, você pode selecionar um modelo de e-mail existente, fazer upload de um modelo a partir de um arquivo (somente editor de HTML) ou usar um modelo em branco.
Se você usar o editor de HTML e precisar que as cores de fundo permaneçam consistentes no app móvel do Gmail quando o dispositivo estiver no modo escuro, consulte App móvel do Gmail e cores de fundo no modo escuro.
Recomendamos selecionar uma experiência de edição por campanha de e-mail. Por exemplo, escolha HTML Classic ou Block editor em uma única campanha de e-mail em vez de alternar entre editores.
Etapa 3: Componha seu e-mail
Depois de selecionar seu modelo, você verá uma visão geral do seu e-mail, onde pode acessar diretamente o editor em tela cheia para redigir seu e-mail, alterar suas informações de envio e ver alertas sobre entregabilidade ou conformidade legal. Você pode alternar entre as guias HTML, clássica, texto simples e AMP enquanto compõe.
A Braze atualiza automaticamente a versão em texto simples a partir da versão HTML até detectar uma edição no texto simples. Depois que a Braze detecta uma edição, ela para de atualizar o texto simples porque presume que você fez alterações intencionais. Para restaurar a sincronização automática, acesse Texto simples e selecione Regenerar do HTML (visível apenas quando o texto simples não está sincronizando).
Para adicionar movimento a um e-mail com uma prévia precisa, use GIFs em vez de elementos que exigem JavaScript, pois a maioria das caixas de entrada não oferece suporte a JavaScript.
A Braze remove automaticamente os manipuladores de eventos HTML referenciados como atributos. Isso modifica o HTML, então revise o e-mail após concluir. Saiba mais sobre manipuladores HTML.
Precisa de ajuda para criar textos incríveis? Experimente usar o Assistente de Copywriting com IA. Insira um nome ou descrição do produto e a IA gerará textos de marketing semelhantes aos escritos por humanos para uso nas suas mensagens.
Precisa de ajuda para criar mensagens da direita para a esquerda para idiomas como árabe e hebraico? Consulte Criar mensagens da direita para a esquerda para conhecer as práticas recomendadas.
App móvel do Gmail e modo escuro
O app móvel do Gmail (Android e iOS) pode inverter as cores de fundo quando o dispositivo está no modo escuro. Isso pode quebrar layouts em que o fundo do e-mail deve corresponder à borda de uma imagem ou a uma cor específica da marca.
Para evitar isso, na célula da tabela que precisa de um fundo estável, use um linear-gradient CSS de cor única em vez de background-color. O Gmail tem menos probabilidade de inverter esse tratamento do que uma cor de fundo plana.
Por exemplo, para manter um fundo branco em uma célula, use isto:
<td style="background-image: linear-gradient(#ffffff, #ffffff);">
Substitua #ffffff pela cor desejada.
Essa abordagem não se aplica de forma confiável apenas a elementos <table aria-label="App móvel do Gmail e modo escuro #gmail-dark-mode">, então defina o gradiente na célula em vez de apenas na tabela.
Para saber mais sobre a sintaxe de gradientes, consulte Gradientes CSS no W3Schools.
Etapa 3.1: Adicione suas informações de envio
Depois de terminar de projetar e construir sua mensagem de e-mail, adicione suas informações de envio em Configurações de envio.
- Em Informações de envio, selecione um e-mail como Nome de exibição do remetente + Endereço. Você também pode personalizar isso selecionando Personalizar nome de exibição do remetente + Endereço.
- Selecione um e-mail como Endereço de resposta. Você também pode personalizar isso selecionando Personalizar endereço de resposta.
- Em seguida, selecione um e-mail como Endereço CCO para tornar seu e-mail visível para esse endereço.
- Adicione uma linha de assunto ao seu e-mail. Opcionalmente, você também pode adicionar um pré-cabeçalho. Para adicionar espaço em branco após o pré-cabeçalho, marque a caixa de seleção Adicionar espaço em branco após o pré-cabeçalho.
Você pode usar Liquid nos campos Nome de exibição + Endereço do remetente e Endereço de resposta para criar modelos dinâmicos com base em atributos personalizados. Isso permite que você envie de diferentes marcas, regiões ou departamentos usando uma única campanha de e-mail ou etapa do Canvas.
Uma prévia no painel à direita será preenchida com as informações de envio que você adicionou. Essas informações também podem ser atualizadas acessando Configurações > Preferências de e-mail > Configuração de envio.
Avançado
Em Configurações de envio > Avançado, ative o CSS inline para o mais amplo suporte de clientes. Se as mensagens estiverem sendo cortadas ou as imagens estiverem se esticando até a altura da linha, tente desativar temporariamente o CSS inline. Alguns modelos funcionam melhor sem inlining.
Você também pode adicionar personalização para cabeçalhos de e-mail e extras de e-mail para enviar dados adicionais de volta a outros provedores de serviços de e-mail.
Anexos de e-mail
Você também pode adicionar anexos de e-mail pelos seguintes métodos:
- Fazer upload de um arquivo: Arraste e solte ou navegue para fazer upload de um arquivo diretamente do seu computador para o e-mail. A Braze valida o tipo e o tamanho do arquivo (até 2 MB por padrão) antes do upload. Em seguida, esses arquivos são carregados na biblioteca de mídia. Arquivos maiores que o limite de 2 MB não podem ser carregados.
- Usar a biblioteca de mídia: Navegue e selecione ativos já armazenados na biblioteca de mídia. PDFs, documentos do Word, arquivos do Excel e apresentações do PowerPoint são todos compatíveis.
- Adicionar a partir de URL: Insira uma URL apontando para o arquivo e forneça um nome de exibição. Como a Braze não consegue verificar URLs arbitrárias para tamanho durante a composição do e-mail, o tamanho do arquivo é validado no momento do envio.
Liquid não é compatível no campo Adicionar a partir de URL.
Consulte as Diretrizes de e-mail para conhecer práticas recomendadas específicas.
Cabeçalhos de e-mail
Para adicionar cabeçalhos de e-mail, selecione Adicionar novo cabeçalho. Os cabeçalhos de e-mail contêm informações sobre o e-mail que está sendo enviado. Esses pares de chave-valor normalmente incluem remetente, destinatário, protocolo de autenticação e informações de roteamento. A Braze adiciona automaticamente as informações de cabeçalho exigidas pela RFC para que os e-mails cheguem aos provedores de caixa de entrada.
A Braze oferece a flexibilidade de adicionar cabeçalhos de e-mail adicionais conforme necessário para casos de uso avançados. Existem alguns campos reservados que a plataforma Braze substituirá durante o envio.
Evite usar as seguintes chaves:
| Campos reservados | ||
|---|---|---|
| BCC | dkim-signature | Reply-To |
| CC | From | Subject |
| Content-Transfer-Encoding | MIME-Version | To |
| Content-Type | Received | x-sg-eid |
| DKIM-Signature | received | x-sg-id |
Adicionando extras de e-mail
Extras de e-mail permitem enviar dados adicionais de volta a outros provedores de serviços de e-mail. Isso se aplica apenas a casos de uso avançados, então você só deve usar extras de e-mail se sua empresa já tiver isso configurado.
Para adicionar extras de e-mail, acesse Informações de envio e selecione Adicionar novo extra.
O total de pares de chave-valor adicionados não deve exceder 1 KB. Caso contrário, as mensagens sofrerão interrupção.
Os valores de extras de e-mail não são publicados no Currents ou Snowflake. Se você deseja enviar metadados adicionais ou valores dinâmicos para o Currents ou Snowflake, use message_extras.
Etapa 3.2: Prévia e teste da sua mensagem
Depois de terminar de compor seu e-mail, teste-o antes de enviar. Na parte inferior da tela de visão geral, selecione Prévia e teste.
Aqui, você pode visualizar como seu e-mail aparecerá na caixa de entrada do cliente. Com a opção Pré-visualizar como usuário selecionada, você pode visualizar seu e-mail como um usuário aleatório, selecionar um usuário específico ou criar um usuário personalizado. Isso permite testar se suas chamadas de Connected Content e personalização estão funcionando corretamente.
Em seguida, você pode Copiar link de prévia para gerar e copiar um link de prévia compartilhável que mostra como o e-mail ficará para um usuário aleatório. Para saber mais, consulte Prévia compartilhável.
Você também pode alternar entre visualizações de desktop, dispositivo móvel e texto simples para ter uma ideia de como sua mensagem aparecerá em diferentes contextos.
Quer saber como seu e-mail fica para usuários no modo escuro? Selecione o botão Prévia do modo escuro localizado na seção Prévia e teste (somente no editor de arrastar e soltar). Se você usa o editor de HTML, ainda pode resolver a renderização do modo escuro do app móvel do Gmail com App móvel do Gmail e modo escuro.
Quando estiver pronto para uma verificação final, selecione Envio de teste e envie uma mensagem de teste para você mesmo ou para um grupo de testadores para confirmar que o e-mail é exibido corretamente em diferentes dispositivos e clientes.
Se você identificar algum problema com seu e-mail ou quiser fazer alterações, selecione Editar e-mail para retornar ao editor.
Os clientes de e-mail que oferecem suporte a texto de prévia sempre puxam caracteres suficientes para preencher todo o espaço disponível para o texto de prévia. No entanto, isso pode deixar você em situações em que o texto de prévia está incompleto ou não otimizado.
Para evitar isso, você pode criar espaço em branco após o texto de prévia desejado para que os clientes de e-mail não puxem outros textos ou caracteres que possam distrair para o conteúdo do envelope. Na seção Configurações de envio, você pode marcar a caixa de seleção Adicionar espaço em branco após o pré-cabeçalho para adicionar espaço em branco automaticamente.
Alternativamente, se você precisar de mais controle, pode adicionar manualmente uma sequência de zero-width non-joiners (‌) e espaços não separáveis ( ) após o texto de prévia que deseja exibir.
Quando adicionado ao final do texto de prévia na seção de pré-cabeçalho, o seguinte trecho de código para o editor de HTML adicionará o espaço em branco que você procura:
<div style="display: none; max-height: 0px; overflow: hidden;"> ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ </div>
Para o editor de arrastar e soltar, adicione apenas os zero-width non-joiners (‌) sem a formatação <div> diretamente no pré-cabeçalho na seção Configurações de envio.
No app Apple Mail, os links de imagem em e-mails HTML devem usar URLs https:// para serem clicáveis. Use links seguros para qualquer imagem envolvida em uma tag de âncora quando esperar cliques de destinatários que usam o Apple Mail.
Etapa 3.3: Verifique se há erros no e-mail
Antes do envio, o editor sinaliza problemas comuns:
- Nome de exibição do remetente e cabeçalho não definidos juntos
- Endereços de remetente ou de resposta inválidos
- Chaves de cabeçalho duplicadas
- Erros de sintaxe Liquid
- Content Blocks que incluem um
<!DOCTYPE html>completo - O corpo do e-mail tem mais de 400 KB
- Procure manter menos de 102 KB para evitar cortes.
- Corpo ou assunto em branco
- Link de cancelamento de inscrição ausente
- Domínio do remetente não está na lista de permissões (envios com limitação severa)
Etapa 4: Construa o restante da sua campanha ou Canvas
Em seguida, construa o restante da sua campanha. Consulte as seções a seguir para saber como usar as ferramentas da Braze para criar sua campanha de e-mail.
Escolha o cronograma de entrega ou o disparo
Entregue e-mails com base em um horário agendado, uma ação ou um disparo por API. Para saber mais, consulte Agendando sua campanha.
Para campanhas disparadas por API, quando a ação-gatilho é definida como Interagir com a Campaign, selecionar a opção Receber como interação fará com que sua nova campanha seja disparada assim que a Braze marcar a Campaign selecionada como enviada, mesmo que essa mensagem sofra bounce ou não seja entregue.
Você também pode definir a duração da campanha, especificar o horário de silêncio e configurar regras de limite de frequência.
Escolha os usuários-alvo
Em seguida, direcione os usuários escolhendo segmentos ou filtros. A Braze exibe uma prévia em tempo real da população do Segment, incluindo quantos usuários podem ser alcançados por e-mail. A composição exata do Segment é calculada imediatamente antes do envio.
Sua mensagem será enviada apenas para usuários que já atendem às condições que você definiu na etapa Público-alvo. Depois disso, eles ainda precisam atender ao gatilho que você definir na etapa Programar Entrega. Pense no público-alvo como uma sala de espera — apenas as pessoas que já estão dentro podem avançar quando a próxima ação acontecer.
Você também pode optar por enviar sua campanha apenas para usuários que tenham um status de inscrição específico, como aqueles que estão inscritos e aceitaram receber e-mails.
Opcionalmente, você também pode limitar a entrega a um número específico de usuários dentro do Segment, ou permitir que os usuários recebam a mesma mensagem duas vezes em uma recorrência da campanha.
Ao criar uma nova campanha de e-mail, o grupo de controle é configurado como 20% por padrão e pode ser ajustado ou removido conforme necessário para sua campanha.
Campanhas multicanais com e-mail e push
Para campanhas multicanais que abrangem tanto e-mail quanto canais push, convém limitar sua campanha para que apenas os usuários que aceitaram explicitamente recebam a mensagem (excluindo usuários inscritos ou não inscritos). Por exemplo, digamos que você tenha três usuários com diferentes status de aceitação:
- Usuário A está inscrito para e-mail e está com push ativado. Esse usuário não recebe o e-mail, mas receberá o push.
- Usuário B fez a adesão (opt-in) ao e-mail, mas não está com push ativado. Esse usuário receberá o e-mail, mas não receberá o push.
- Usuário C fez a adesão (opt-in) ao e-mail e está com push ativado. Esse usuário receberá tanto o e-mail quanto o push.
Para isso, em Resumo do público, selecione enviar esta campanha para “somente usuários que aceitaram”. Essa opção garante que apenas os usuários que aceitaram receberão seu e-mail, e a Braze enviará push apenas para os usuários que têm push ativado por padrão.
Com essa configuração, não inclua nenhum filtro na etapa Públicos-alvo que limite o público a um único canal (por exemplo, Foreground Push Enabled = True ou Email Subscription = Opted-In).
Escolha os eventos de conversão
A Braze permite rastrear a frequência com que os usuários realizam ações específicas, os eventos de conversão, após receberem uma campanha. Você pode especificar qualquer uma das seguintes ações como evento de conversão:
- Abre o app
- Realiza uma compra (pode ser uma compra genérica ou de um item específico)
- Executa um evento personalizado específico
- Abre o e-mail
Você pode permitir uma janela de até 30 dias durante a qual a Braze contabiliza uma conversão se o usuário realizar a ação especificada. Embora a Braze rastreie aberturas e cliques automaticamente, você pode definir o evento de conversão como abertura ou clique para usar o recurso Otimizar com BrazeAITM.
Se ainda não tiver feito isso, conclua as seções restantes dos seus componentes do Canvas. Para saber mais sobre como construir o restante do seu Canvas, incluindo testes multivariantes e Otimizar com BrazeAITM, consulte Construir seu Canvas.
Etapa 5: Revisar e implantar
A seção final resume a campanha que você criou. Confirme todos os detalhes relevantes e selecione Launch Campaign.
Para saber como acessar os resultados das suas campanhas de e-mail, confira Relatórios de e-mail.