Como personalizar um modelo de e-mail marketing

Hoje, estamos mergulhando nos modelos e em como usá-los com o editor flexível do Twilio SendGrid ou ajustar o HTML do modelo no construtor de e-mail de sua escolha. Enquanto alguns profissionais de marketing podem se sentir à vontade para projetar e codificar um belo e-mail a partir do zero, para aqueles de nós que não são web designers ou desenvolvedores de e-mail, os modelos de e-mail fornecem uma maneira poderosa e econômica de criar e-mails lindamente responsivos.

Neste post, mostrarei como escolher um modelo de e-mail pré-criado e as escolhas de design que faço ao longo do caminho.

Escolhendo um modelo de e-mail marketing

Se você está começando em Campanhas de Marketing, você tem uma variedade de opções de modelos. Mas antes de escolher um modelo, pergunte-se:

Qual é a finalidade do e-mail que você planeja enviar e a ação que deseja que seus destinatários executem?

Essa ação exige uma explicação com muito texto e um CTA ou você está tentando exibir visualmente seus produtos com várias imagens? Fique de olho na estrutura e no formato que funcionará bem com o seu conteúdo.

A sua marca é ousada e barulhenta, elegante e pitoresca, moderna e elegante? É útil encontrar um modelo que se assemelhe à sua marca. Embora você possa alterar imagens, texto e cores para combinar com sua marca, é útil ter um modelo que se alinhe ao estilo que você deseja alcançar.

Escolhi o template Ingrid and Anders Welcome Series 2 à esquerda ( disponível para download aqui ) porque pretendo enviar um e-mail promocional de uma joalheria.

Embora as cores e imagens não representem a marca da joalheria, o visual de boutique se encaixa na sensação geral da marca e as várias imagens e seções de cópia funcionam bem para o conteúdo que pretendo enviar.

Customização para sua marca

Aqui está minha abordagem passo a passo para ir do modelo acima para a visualização de e-mail à direita, mantendo a marca, a mensagem e a ação desejada em mente ao longo do caminho.

Etapa 1: cabeçalho

Comecei colocando o logotipo da joalheria no cabeçalho. Seus destinatários de e-mail mostraram que confiam e estão interessados ​​em um relacionamento com sua marca. Garantir que o que eles veem quando abrem seu e-mail seja familiar e esperado é fundamental para manter essa confiança.

• • Largura: A largura do cabeçalho precisa ser de pelo menos 600 pixels para que se estenda por toda a largura do email.
  • Alinhamento: A maioria das empresas alinha seu cabeçalho à esquerda ou centraliza-o.
  • HTML: Para alterar o logotipo em HTML, troque o link no atributo img class . O link deve ser colocado no atributo src (veja abaixo). Não se esqueça de incluir as aspas ao redor do link.

Etapa 2: imagens

Escolha imagens relacionadas à cópia e à sua marca. As joias são um produto tão visual, então eu queria que as imagens ocupassem muito mais o e-mail do que a cópia.

A primeira imagem do meu e-mail está relacionada à cópia e ao recebimento de um presente de feriado. Imagens que apresentam pessoas ajudam os destinatários a se conectarem emocionalmente com o conteúdo. A segunda imagem destaca uma oferta especial de joias para ajudar a direcionar os visitantes ao site. Encontrei essas imagens na iStock, mas existem muitos outros recursos para encontrar ótimas imagens .

Ao incluir imagens em seu e-mail, lembre-se de:

• Incluir texto alternativo: alguns ESPs ocultam imagens em e-mails. Incluir texto alternativo ajuda os destinatários a entender a ideia por trás da imagem, mesmo que não possam vê-la.
• Imagens de links: esperamos que tudo seja clicável, incluindo imagens. Neste e-mail, a foto dos brincos de diamante, principalmente, precisa ser clicável para a descrição deste produto no site.
• Tamanho da imagem: Assim como o cabeçalho, verifique se a largura das imagens é de pelo menos 600 pixels.
• HTML: Semelhante à imagem do seu logotipo, procure a img class e o atributo src ao alternar as imagens no modelo. Para incluir texto alternativo, adicione o atributo alt à img class e descreva sua imagem. Para adicionar um link à sua imagem, inclua o atributo href na tag img class .

Etapa 3: fonte

As campanhas de marketing permitem que os usuários importem fontes para que você não precise sacrificar os padrões da marca em seus e-mails. Você pode adicionar sua fonte editando o cabeçalho HTML (encontrado em “Avançado” na navegação à esquerda). Aqui estão as instruções passo a passo sobre como adicionar uma fonte.

Alguns ESPs suportam apenas um punhado de fontes, então é uma boa ideia escolher uma fonte padrão como Arial, Times New Roman ou Verdana. Escolha um que corresponda ao seu site o mais próximo possível. Dessa forma, se a fonte da sua marca não for compatível, você terá um backup pronto para uso.

Etapa 4: Copiar

Para este boletim informativo, meu objetivo é levar o destinatário ao site para criar uma lista de desejos ou fazer compras, então não quero que eles permaneçam no e-mail por muito tempo. É por isso que meu texto é curto e direto ao ponto, levando diretamente aos botões de call to action.

• Ao escrever seu e-mail , volte ao objetivo de sua mensagem e pergunte a si mesmo: que ação você deseja que seus destinatários realizem?

Passo 5: Cores

Alinhe seus e-mails à sua marca usando cores semelhantes ao seu site. Seus e-mails não precisam ser exatamente como seu site, mas tente usar pelo menos uma ou duas cores em seu e-mail para vincular sua marca. Para este e-mail, alterei a cor da fonte para a mesma do site e incluí imagens com um toque de ouro para combinar com o logotipo.

• • Plano de fundo do e-mail: se você examinar sua caixa de entrada, notará que a maioria dos e-mails tem uma cor de fundo branca ou neutra e, ocasionalmente, preta. Recomendamos aderir a uma dessas cores para o pano de fundo do seu e-mail. Cores brilhantes ou fortes podem parecer esmagadoras e distrair seus destinatários do conteúdo real do e-mail. À direita, estão as cores que usei para o plano de fundo e o texto deste e-mail.
  • Rodapé: Uma ótima maneira de alinhar seu e-mail com sua marca é usar a mesma cor de fundo do rodapé e cor da fonte do seu site. Isso ajuda a criar continuidade entre seus e-mails e seu site.
  • Botões de CTA: Esses botões geralmente são o elemento mais brilhante e ousado do seu email. Eles devem chamar a atenção e motivar o destinatário a agir.
  • HTML: Para alterar a cor de planos de fundo, bordas ou fontes em HTML, procure a cor Hex de 6 dígitos. Você encontrará o código hexadecimal em elementos e atributos como style , span style , background-color , bgcolor , color e border-color . É provável que seu modelo tenha vários atributos para a mesma cor para poder comunicar a cor a todos os provedores de e-mail. Certifique-se de alterar todas as seções que listam a cor. Confira este exemplo do design e código do botão CTA.

Passo 6: Teste!

Depois de configurar seu e-mail, teste-o enviando uma visualização para você mesmo. Aqui estão algumas coisas para verificar em sua visualização:

• É responsivo para dispositivos móveis? Revise seu e-mail em seu desktop e telefone para verificar se o e-mail é responsivo para dispositivos móveis.
• Todos os links funcionam? Clique em todos os links e imagens vinculadas. Verifique se os botões de CTA são grandes o suficiente para clicar com o dedo.
• Sua marca é reconhecível? Compare seu e-mail e seu site lado a lado. Sua marca deve brilhar em seu e-mail.

Nas campanhas de marketing, você também pode testar diferentes elementos (veja a imagem abaixo) e ver se um link de texto simples ajuda a atrair mais cliques do que um botão de CTA colorido. Isso fornecerá dados para fazer backup de suas escolhas de design para envios futuros. Para obter uma lista completa de itens a serem revisados ​​antes de enviar seu e-mail, consulte Sua lista de verificação de teste de pré-envio de e-mail .

Os modelos pré-criados são uma ótima solução que economiza tempo para aqueles que não são especialistas em design e desenvolvimento de e-mail. É fácil personalizar esses modelos para refletir a marca e a mensagem da sua empresa sem a necessidade de entrar nas ervas daninhas do HTML do e-mail.

Para dezenas de modelos responsivos e personalizáveis, inscreva-se em uma conta gratuita de Campanhas de marketing.