Segundo dados do TopRankBlog, 64% dos tomadores de decisão nas empresas abrem e-mails primeiro no disposivito mobile. E como a maioria das ferramentas profissionais de e-mail marketing disponibiliza templates responsivos que pode ser personalizados, não tem nenhuma desculpa para você não observar isso.
O objetivo da ação é…
Gerar mais vendas? Aumentar engajamento com a marca? Divulgar evento que a empresa vai participar? O que você quer comunicar nessa ação?
Não é um livro, é um prefácio
Seja rápido, resuma, envie o que interessa. Nada de textos longos, excesso de imagens em tamanhos abusivos. O usuário está na rua com o celular na mão, vai conseguir rolar a tela mais facilmente do que redimensionar para enxergar sua imagem.
Cuide das imagens
O local onde as imagens ficarão (no seu web site ou no banco de imagens da ferramenta), como elas aparecerão na peça e também o que acontece caso elas não sejam carregadas deve ser observado. Existem muitos sites de imagens gratuitas ou que podem ser utilizadas como apoio ao seu conteúdo. Alguns especialistas sugerem que na falta de uma imagem adequada para ilustrar seu conteúdo, uma imagem de um animal de estimação tem bom efeito sobre a audiência em geral.
Construção do HTML da peça
Criar um HTML para e-mail é muito distinto de criar um template para sites. Os principais provedores de e-mail são muito limitados, por isso, precisamos ter alguns cuidados na parte de criação de nosso e-mail.
- Inserir uma tabela
- Fatiar imagens
- Inserir imagens no banco de imagens
- Inserir imagens do banco na peça
- Inserir links
Dica: Muitos provedores e gerenciadores de e-mail não aceitam CSS incorporado e externo, somente CSS inline.
O que é CSS (inline, incorporado e externo)?
CSS inline: É o CSS definido na própria tag ou linha onde deseja aplicar o efeito.
Exemplo: <p style="font-family:Arial">Meu parágrafo em Arial</p>
CSS incorporado: É o CSS que fica entre as tags e , que delimitam o cabeçalho do documento HTML.
Exemplo: <style type="text/css"> p{ font-family:Arial; } </style>
CSS externo: É um outro arquivo com todas as definições CSS e ele é chamado (linkado) no documento HTML.
Exemplo: <link href="estilo.css" rel="stylesheet" type="text/css" media="screen" />
Mas e se sua ferramenta oferecer templates padronizados e responsivos, utilize! Comece por ali, veja o que funciona e o que não funciona, ou contrate uma empresa ou especialista para desenvolver alguns modelos sob medida!
Photo credit: Bureau of Educational & Cultural Affairs / Foter / CC BY-NC-ND