Inserir imagens corretamente no seu template de e-mail é essencial para garantir que elas sejam exibidas para todos os destinatários, independentemente do provedor (Gmail, Outlook, celular, etc.).
Atualmente, na CX, existem duas formas de envio de e-mails:
Pelo atalho rápido
Pela ação de envio de e-mail em playbooks
A seguir, veja como inserir imagens em cada uma dessas opções e confira boas práticas para evitar problemas de carregamento ou bloqueio.
_________________________________________________________________________
Localize o botão de atalho rápido (botão vermelho com o símbolo de “+”), no canto inferior direito da tela, ao clicar, será aberta a janela lateral de “Enviar e-mail”.
No campo de edição do corpo do e-mail, você verá uma barra com vários ícones:
Clique no ícone de imagem (representado por uma foto).
Uma janela será exibida para que você insira a URL da imagem e configure suas propriedades:
_________________________________________________________________________
Acesse o playbook que está sendo configurado.
Na seção de Ações, selecione a ação de envio de e-mail.
No campo de template, você verá o editor de texto com os ícones de formatação. Clique no ícone de imagem (foto):
Será aberta a janela para inserir a URL da imagem e ajustar as configurações necessárias:
_________________________________________________________________________
Agora que você já sabe como inserir imagens, siga estas recomendações para garantir uma boa exibição e evitar impactos no envio das mensagens:
1. Utilize uma URL direta da imagem
Ao inserir uma imagem, informe uma URL pública e direta para o arquivo. Uma forma simples de validar:
Copie o link da imagem
Abra em uma aba anônima do navegador
Se a imagem carregar corretamente, a URL está acessível publicamente
Formatos recomendados:
.png
.jpg
.jpeg
.gif
Exemplo:
https://seudominio.com/imagens/logo.png
Evite:
Links do Google Imagens;
Links do OneDrive ou similares com restrição de acesso;
URLs com parâmetros que não apontam diretamente para a imagem;
Links temporários ou protegidos.
Esses formatos podem impedir que a imagem seja carregada corretamente no e-mail.
2. Evite incorporar imagens em Base64
Não recomendamos inserir imagens diretamente no HTML do e-mail utilizando Base64 (data URI).
Esse formato incorpora o conteúdo da própria imagem dentro do e-mail, aumentando consideravelmente o tamanho da mensagem. O impacto é ainda maior em disparos realizados para uma grande quantidade de destinatários.
Por exemplo, uma imagem de aproximadamente 3MB incorporada em base64 pode fazer com que cada e-mail enviado tenha vários megabytes. Em disparos em massa, isso pode aumentar significativamente o volume de dados processados e contribuir para problemas de desempenho e falhas na entrega.
Recomendamos: hospedar a imagem em um servidor público ou CDN e inseri-la no template utilizando sua URL.
Em vez de “data:image/png;base64,...”, prefira https://seudominio.com/imagens/logo.png
Importante: quanto menor o tamanho da imagem, melhor. Evite utilizar imagens de vários megabytes em templates de e-mail, especialmente em playbooks com grande quantidade de destinatários.
3. Hospede a imagem em um local confiável
A imagem precisa estar disponível publicamente para que os provedores de e-mail consigam carregá-la.
Recomendado:
* Seu próprio site/servidor;
* CDN (Content Delivery Network);
* AWS S3;
* Cloudflare;
* Outros serviços seguros de hospedagem de arquivos públicos.
Evite:
* Links que exigem login;
* URLs privadas;
* URLs que possam expirar;
* Arquivos hospedados em ambientes que bloqueiem acessos externos.
4. Utilize imagens com tamanho adequado
Para garantir boa visualização e evitar mensagens desnecessariamente grandes:
Largura recomendada: 200px a 600px;
Mantenha a proporção original da imagem;
Comprima as imagens antes de utilizá-las;
Evite arquivos muito grandes;
Como referência, procure manter cada imagem em até 200 KB, sempre que possível.
5. Preencha o texto alternativo (Alt Text)
O texto alternativo é exibido quando a imagem não pode ser carregada e também melhora a acessibilidade do conteúdo. Por exemplo, se uma imagem tiver o texto alternativo “Logo - CustomerX”, esse texto poderá ser exibido caso a imagem não seja carregada.
Se utilizar código, prefira HTML simples com CSS inline;
Evite layouts complexos, pois nem todos os clientes de e-mail oferecem o mesmo suporte;
Prefira alinhamentos simples, como centralizado;
Comprima as imagens antes de hospedá-las;
Utilize URLs públicas e estáveis;
Faça um teste interno antes de realizar disparos para grandes quantidades de destinatários.
Imagem não aparece no e-mail
Possíveis causas:
URL inválida ou temporária;
Imagem hospedada em ambiente privado;
Link quebrado ou expirado;
Servidor bloqueando o acesso externo;
Formato ou configuração incompatível com o cliente de e-mail.
E-mail muito grande ou falhas em disparos
Possíveis causas:
Imagens com tamanho muito elevado;
Imagens incorporadas diretamente em Base64;
Grande quantidade de imagens no template;
Template muito pesado para um disparo em massa.
Utilize imagens pequenas, comprimidas e hospedadas em um servidor público e confiável. Evite incorporar imagens grandes diretamente em Base64. Para templates utilizados em playbooks e disparos em massa, essa recomendação é especialmente importante para reduzir o tamanho das mensagens e evitar impactos no processamento e na entrega dos e-mails.
