Confira o HTML do seu e-mail

Os programas de correio interpretam um subconjunto pequeno e antigo de HTML, e cada um de um jeito. Aqui você vê as partes que não vão sobreviver à viagem — antes de descobrir por um colega.

Carregando a ferramenta…

Como funciona

  1. Cole o HTML da mensagem — da visão de código da sua ferramenta de newsletter, ou do arquivo que você está prestes a enviar.
  2. Leia os achados, e depois as tabelas de links e de imagens.
  3. Use a prévia para conferir as larguras estreitas, o modo escuro e, acima de tudo, como fica com as imagens bloqueadas.

Por que nada é enviado

Tudo o que esta página faz é executado por código que roda dentro da aba do seu navegador, com o mesmo motor que desenha as páginas web. O arquivo é lido do disco para a memória da aba, transformado ali e escrito de volta como um download. Ele nunca é enviado a lugar nenhum — nem para nós, nem para terceiros.

Comprove você mesmo

  1. Abra as ferramentas de desenvolvedor do navegador (F12) e escolha a aba Rede.
  2. Carregue o seu arquivo e rode a ferramenta.
  3. As únicas requisições que você vai ver baixam o código da própria ferramenta — e, em algumas ferramentas pesadas, o motor de código aberto delas a partir de um CDN público — mais um pequeno aviso de visita para loreatec.jp (endereço e título da página, nada mais). Nenhuma delas leva o seu arquivo.

Comprove você mesmo →

Perguntas frequentes

Por que o meu bloco <style> é um problema?

O Gmail guarda a maior parte dele, o Outlook no Windows guarda uma parte, vários webmails o removem inteiro, e nenhum deles busca uma folha de estilo externa. Tudo que precisa sair certo tem que ser um atributo style em linha; um bloco <style> serve para as media queries, que não têm como ser postas em linha. O inliner de CSS deste site faz a parte mecânica.

O que é o limite de 102 KB?

O Gmail para de renderizar uma mensagem por volta de 102 KB e mostra um link de “View entire message” (ver a mensagem inteira). Tudo depois do corte fica escondido — normalmente o rodapé, que é onde ficam o link de descadastro e o endereço postal. Isso faz disso um problema legal, além de um problema de design. Enxugue o HTML, não o conteúdo: a maior parte do peso são estilos em linha repetidos e o andaime de tabelas.

Por que ele não me diz se os meus links funcionam?

Porque um navegador não consegue ler a resposta de outro domínio — a política de mesma origem proíbe, e nenhuma esperteza contorna isso sem um servidor repassando a requisição. Em vez disso, os links são listados para você conferir; um verificador que “valida” links ou tem um servidor, ou está chutando.

O que a visão com as imagens bloqueadas mostra?

O que a maioria dos destinatários vê primeiro. Gmail, Outlook e Apple Mail bloqueiam imagens remotas por padrão em pelo menos algumas situações, e um design que é uma imagem grande só vira um retângulo vazio. Se a sua mensagem fica ilegível nessa visão, ela está ilegível para boa parte da sua lista.