Blog de Email Marketing

Templates

Métodos para criação de templates de email marketing

Juliana Padron Por Juliana Padron em 09.12.2015

Criar um email marketing não é a mesma coisa que criar um website, um hotsite ou uma landing page. Apesar do formato do email marketing também ser em HTML, o mesmo que das páginas web, sua forma de desenvolvimento é muito diferente porque precisa considerar as limitações de suporte a HTML e CSS dos diversos programas de email que existem.

Criação de email marketing vs. Criação de sites

Assim como um site de pequeno porte, você pode criar o design do email marketing em qualquer software gráfico de sua preferência: Photoshop, Illustrator, Fireworks, Corel Draw, InDesign e até mesmo Power Point.

Depois da criação do design do template, será preciso transformá-lo em HTML, que é o formato correto do email marketing para que seu conteúdo seja exibido no corpo do email do destinatário, e não como anexo.

Existem duas maneiras de se desenvolver o HTML da arte do template de email marketing: recortando a arte inteira em pedaços de imagens menores ou formatando o HTML manualmente, “copiando” os elementos de design e reproduzindo-os em código HTML, formatando direto no código as fontes, cores e outras características previstas no design que o HTML suporte reproduzir.

Só é importante ter em mente que, ao programar o HTML, não se pode usar o mesmo método de desenvolvimento de websites.

  Websites Email marketing
Estrutura do HTML Tableless Tabelas
Formatação dos elementos CSS externo, CSS incorporado ao head CSS inline
Imagens GIF, JPEG, PNG (mais recomendado) GIF, JPEG (mais recomendado), PNG

Para desenvolver o HTML de sites, usamos um método de estrutura chamado tableless, isto é, sem tabelas. Pensamos em “caixas” ou “blocos” para diagramar os elementos e usamos certas propriedades de CSS para posicioná-los um ao lado do outro.

Porém, em email marketing, não podemos usar tableless porque a maioria dos programas de email não suporta as propriedades de CSS que serão necessárias para formatar as caixinhas de conteúdo, como as de posicionamento, margem e tamanho. É por isso que precisamos diagramar todos os elementos em tabelas, da mesma forma como os sites eram construídos na década de 90 (fico em depressão ao perceber que vários webdesigners que lerão isso nem eram nascidos nessa época).

Apenas recortar a imagem do template em pedaços para inseri-los em células de tabela do HTML é o método mais fácil e rápido de se criar o email marketing, porém, como alguns programas de email ainda bloqueiam as imagens das mensagens, o seu template sofrerá com essa barreira de visualização ao ser entregue para seus destinatários.

Além disso, um template todo em imagens não pode ser responsivo e pode ter um tamanho final muito pesado para o destinatário visualizar no smartphone ou no tablet, quando estiver em uma conexão móvel, por exemplo.

Já no método da formatação manual do código HTML, os textos e cores sólidas são especificados no código e, mesmo quando houver o bloqueio das imagens do email marketing, o conteúdo poderá ser compreendido pelo destinatário, que poderá visualizar os textos e saber do que trata a mensagem. Isso pode ser até um incentivo para que o destinatário habilite a exibição das imagens, caso se interesse pelo conteúdo pré-visualizado.

Comparativo entre os métodos de recorte e formatação manual para criar o email marketing

  Recorte de imagens Formatação manual
Tempo de desenvolvimento 🙂 🙁
Bloqueio de imagens 🙁 🙂
Disponibilidade para busca futura no email 🙁 🙂
Vulnerabilidade de imagens 🙁 🙂
Adaptação para mobile 🙁 🙂
Pontuação de spam 🙁 🙂
Tamanho da mensagem 🙁 🙂
Tempo para entrega e download pelo destinatário 🙁 🙂

Portanto, o melhor método para criar o email marketing, depois de seu design pronto, é a formatação manual do HTML, que pode ser feita em qualquer editor de HTML, desde o mais simples como o Bloco de Notas até um software avançado como o Dreamweaver.

Para facilitar a formatação manual do HTML na criação do email marketing, ainda na etapa do design, é importante pensar na diagramação tendo em mente que ela terá que ser, posteriormente, reproduzida em tabelas no HTML, de forma a otimizar a leitura do email marketing em dispositivos mobile e também levando em consideração as limitações dos programas de email, como o fato do Outlook não suportar imagens de fundo, por exemplo.

A melhor forma de diagramação do email marketing é em uma coluna única, sem muitos elementos dispostos lado a lado. A disposição de blocos de elementos na vertical, um abaixo do outro, favorece a visualização do email marketing em smartphones porque os elementos podem ocupar toda ou boa parte da largura da tela.

No fim das contas, criar um template de email marketing é saber que “menos é mais”. Planeje o conteúdo para ser rapidamente compreendido, pois as pessoas dificilmente lêem emails, apenas “passam os olhos” sobre eles para tentar identificar algo que lhes chame a atenção. Crie seu template da maneira mais eficiente possível e, sempre que puder, escolha programar manualmente o HTML do email marketing.

Assine Nossa Newsletter


Por favor informe um endereço de email válido.

Acompanhe Nossas Publicações