Guia
Markdown para HTML para email
Escreva em Markdown, envie HTML real. Eis porque é que o email precisa de uma saída diferente de uma página web, e como a obter.
Porque é que o HTML normal se quebra no email
Os clientes de email não são navegadores. Muitos removem ou ignoram blocos <style>, folhas de estilo externas e a maioria do CSS moderno. HTML que parece perfeito numa página web pode chegar a uma caixa de entrada com tipos de letra predefinidos, sem espaçamento e com tabelas quebradas.
A abordagem fiável é colocar estilos diretamente em cada elemento com o atributo style. É isso que o modo de saída Seguro para email faz.
O que o conversor altera
Ao escolher Seguro para email (estilos inline) em Opções, o seu Markdown é convertido como habitualmente, e depois são adicionados estilos inline a cada elemento:
<p style="margin:0 0 16px;font-size:16px;line-height:26px;color:#333333;">
Hello from Markdown.
</p>- Títulos, parágrafos, links, listas, citações, código, tabelas e linhas horizontais recebem tamanhos, margens e cores explícitos.
- As classes de destaque de sintaxe são desativadas, porque os clientes de email descartam estilos baseados em classes.
- A saída é um fragmento. Cole-o no corpo do seu editor de email ou de newsletter.
Como usar
- Abra o conversor com a saída Seguro para email selecionada.
- Cole ou escreva o seu Markdown.
- Verifique a pré-visualização, depois escolha Copiar HTML.
- Cole-o no editor de HTML ou de código-fonte da sua ferramenta de email.
Antes de enviar
- Use URLs de imagem absolutos (
https://…) e escreva sempre texto alternativo. Caminhos relativos não funcionam numa caixa de entrada. - Envie um teste para si próprio. Gmail, Outlook e Apple Mail apresentam cada um de forma ligeiramente diferente, especialmente o Outlook no Windows.
- Mantenha simples. Conteúdo de coluna única converte-se de forma fiável. Layouts complexos com várias colunas precisam de um modelo de email dedicado.
- Tenha atenção ao modo escuro. Alguns clientes invertem as cores automaticamente, por isso verifique o contraste em ambos.
- Mantenha a sanitização ativa a não ser que confie totalmente na fonte do seu Markdown.
O que não faz
O conversor estiliza conteúdo, não layouts: não há cabeçalho, rodapé, botão, ou sistema de colunas. Use-o para o corpo de texto de uma mensagem e combine-o com o modelo da sua plataforma de email para o resto.