Facebook
Twitter
Copiar link
10/04/2017
06/08/2024 
Milhares já recebem nossa news. Vai ficar de fora?
Cadastre-se e receba os melhores conteúdos sobre e-mail marketing e e-commerce.
Compartilhe via:
- 3 dicas de HTML para criar peças de e-mail de alta performance
Voltar
3 dicas de HTML para criar peças de e-mail de alta performance
- 10/04/2017
- 2 min de leitura
Mailbiz
Siga no Linkedin
O uso de HTML para criar peças de e-mail é fundamental se você quiser assegurar que sua mensagem realmente chegue à sua lista de contatos sem ruídos.
Isso porque a maior parte dos serviços de e-mail disponíveis bloqueiam a exibição de arquivos de imagem dentro do corpo dos e-mails, a fim de prevenir o spam. Logo, se você sempre achou mais fácil transformar seu e-mail marketing em um grande arquivo de imagem no Photoshop, pense duas vezes!
O problema é que não é só Hotmail, Gmail, MS Outlook e outros que deixarão de exibir o conteúdo do seu e-mail, mas seus contatos certamente não terão interesse de aguardar o carregamento, ler e clicar numa estrutura complexa.
Mas não se preocupe! Neste post, vamos apresentar algumas dicas para que você seja capaz de recorrer à linguagem HTML para criar peças e e-mails de alta performance. Confira.
Conteúdo
O que fazer ao usar HTML para criar peças e e-mails?
1. Evite o Word
Isso mesmo. Usar o Word ou editores mais simples para a geração do HTML pode fazer com que o seu código não seja interpretado corretamente pelos e-mails, já que não seguem os padrões da web. Adote editores avançados, como o Dreamweaver da Adobe.
2. Tenha o layout sob controle
O principal desafio ao se apostar em um e-mail na linguagem HTML é tentar prever como o design dele será visto pelo usuário em cada um dos inúmeros serviços de e-mail, além dos dispositivos móveis, é claro. O ideal é que você mantenha o layout sob controle, via código!
– Use tabelas
Sim, as tabelas são o primeiro passo para garantir que seu e-mail será lido sem distorções. Elas possibilitam dimensionar o espaço entre colunas e rodapé, posicionando logo, imagens e texto de forma definitiva. O número de colunas é regulado pela tag “colspan=(?)”, dentro da tag <body></body>.
– Estilize o e-mail ou a peça com CSS
Além de dimensionar cada elemento, é preciso ter controle sobre a estilização, para que usuários não tenham a leitura comprometida por e-mails ou peças com cores distorcidas. Ao ser inserido no conteúdo, o CSS cria um link para uma página de estilos que definirão a cor do background e das fontes.
Mas, atenção! Use sempre o CSS inline (ao lado das tags do código-fonte). Quando o CSS é incorporado externamente ou aparece antes da tag body, ele pode ter o código alterado por webmails.
3. Equilibre imagens e texto
Depois de estruturar o layout em HTML, basta dosar imagens e texto. Em primeiro lugar, as imagens não podem ser “pesadas” ou em grande quantidade, pois os e-mails tendem a considerá-las como spam, vindo a bloquear a visualização. A largura ideal das imagens deve ser de 520 a 600 pixels, e os padrões de quebra de linha do HTML auxiliam a reduzir o peso de cada uma delas.
Apesar de toda a precaução, uma ou outra imagem pode não carregar. Logo, insira a tag “alt”, com uma descrição acerca do conteúdo da imagem ou do link a que ela se refere para orientar o usuário
Bom, agora que você ficou por dentro de algumas dicas para melhorar a performance dos seus e-mails, resta testar tudo. E caso as peças funcionem corretamente em navegadores como Internet Explorer e Firefox, as chances são grandes de que elas funcionem nos demais.
E então, tudo pronto para usar o HTML para criar peças e e-mails? Na próxima etapa, você provavelmente se interessará em medir a taxa de conversão do seu e-mail marketing!
Compartilhe esse artigo