15 e-mails transacionais, prontos para enviar
Um arquivo HTML por e-mail, em tabelas com estilo inline — sobrevive a Gmail, Outlook e Apple Mail. Copy literal das Seções 25.9 e 26.4, um único CTA primário por mensagem, placeholders {campo} para o seu motor de templates.
Seção 25.9 · transacionais (1–10)
Pré-visualização em 600 px de largura. Clique em “abrir” para ver em tamanho real.
Seção 26.4 · e-mails que faltavam (11–15)
Boas-vindas, aviso ao e-mail antigo, renovação anual D-7, reembolso e equipe — as lacunas registradas em 26.0.
Regras aplicadas em todos os 15
Cruzamento das regras de 25.9 com as obrigações de 26.5 (Termos da API do YouTube) e a compatibilidade exigida por clientes de e-mail.
| Regra | Como está implementada |
|---|---|
| Copy literal em pt-BR | Assunto e corpo reproduzem o texto das Seções 25.9 e 26.4; placeholders mantidos como {nome}, {plano}, {data}, {valor} para o motor de templates. |
| Um único CTA primário | Botão “bulletproof” (td com bgcolor + a display:block), preto do DS, raio 10 px. Links secundários só no rodapé. |
| Números e deltas | Toda cifra em fonte mono ('Courier New' — substituto de e-mail para JetBrains Mono), alinhada à direita, com sinal e unidade: +12,4%, −0,9 pp, ≈ 500 mil. |
| Paleta do design system | Hex literais dos tokens (superfície #ffffff, fundo #f0f0f3, tinta #0a0a0b, terciário IBCS #1e40af, semânticas success/danger/warning). Nenhuma cor nova — CSS variables não sobrevivem em cliente de e-mail. |
| Sem imagem, sem web font, sem JS | Wordmark em texto, blocos construídos com células coloridas e bordas. Nenhum arquivo externo — nada quebra se o cliente bloquear imagens. |
| Preheader | Primeiro elemento do body: span oculto de ~85 caracteres que aparece ao lado do assunto na caixa de entrada. |
| Outlook e Gmail | Larguras explícitas em toda tabela, mso-line-height-rule:exactly em todo texto, condicional mso para a pilha de fontes; cada arquivo tem menos de 20 KB (o corte do Gmail é ~100 KB). |
| Rodapé obrigatório | Endereço postal da empresa, link de preferências e — nos digests — “não receber mais este alerta”. Nenhum e-mail de marketing sem opt-in em Configurações → Notificações. |
| Termos da API do YouTube (26.5) | Todo rodapé traz “Este produto usa os Serviços de API do YouTube” com link para os Termos do YouTube e para a Política de Privacidade do Google. |
| Modo escuro | meta color-scheme light dark e nenhum fundo #000/#fff puro no corpo: a inversão de cliente mantém o texto legível. |
Antes de enviar
- conteúdo
Trocar os placeholders pelas variáveis do seu provedor
Os campos estão no formato {nome}, {plano}, {data}, {valor}, {token}. Substitua pela sintaxe do Resend, SendGrid ou Postmark antes de subir.
- domínio
URLs de exemplo apontam para www.rivalindex.io
Ajuste os hrefs de CTA, preferências e ajuda para o seu domínio real, com token assinado por e-mail.
- legal
Endereço postal do rodapé é exemplo
Substitua “Av. Paulista, 1000, cj. 42 · São Paulo/SP” pelo endereço registrado — obrigatório em qualquer envio em massa.
- teste
Rodar em Litmus ou Email on Acid
Os arquivos seguem as regras de compatibilidade, mas a validação por cliente real (Outlook 2016/365, Gmail app, Apple Mail) fica para a implementação.