Codificação HTML e CSS em e-mails

Índice
Quem se dedica ao email marketing deve saber criar emails em html.
Veremos algumas recomendações para o design, codificação e entrega de e-mails em formato HTML e para fazer seu boletim informativo ter uma boa aparência na maioria dos clientes de e-mail.
O envio de emails a partir de Newsletters é uma boa forma de comunicação entre editores e leitores, mas se o fizermos também no formato HTML, permitirá enriquecer o documento com elementos visuais que tornam o email mais atractivo, acesso direto a outras localizações e nós Isso nos permitirá medir as aberturas de e-mail, rastrear e contar os links que você visita, medir os interesses do leitor, etc.
Ao enviar um e-mail em texto simples não podemos utilizar todas estas funcionalidades, pelo contrário, obtemos outras vantagens como um menor nível de spam por não incluir tags HTML e por isso torna mais fácil para os clientes de e-mail uma visualização perfeita do conteúdo do email em todos os clientes.
Codificar HTML para e-mails pode causar muitas dores de cabeça, porque os clientes de e-mail desktop e baseados na web não estão em conformidade com nenhum padrão da web, não interpretam bem o código HTML e folhas de estilo ou interpretam-nos à sua própria maneira. Adicionando ou removendo código para o e-mail recebido, portanto, o design do e-mail que o destinatário recebe pode ser bem diferente do design do editor que enviou esse e-mail.
HTML sobre CSSTente usar tags HTML e suas propriedades o máximo possível em vez de folhas de estilo, já que muitas das propriedades e seletores CSS são restritas por clientes da web.
Usando tabelas para layoutSim, voltamos às mesas. Os padrões da web dizem que as tabelas não devem ser usadas para fazer o layout de uma página da web, mas esta não é uma página da web, mas um e-mail e é aconselhável usá-las em vez dese quisermos que nossa Newsletter seja bem exibida na maioria dos leitores de e-mail. E é que os clientes de e-mail não suportam muitas das propriedades necessárias para projetar com divisões.
Use atributos de tabela e célula para exibir a tabela em vez de usar propriedades CSS. Por exemplo, atribua border = "0", valign = "top", align = "left" (ou center), cellpadding = "0", cellspacing = "0" e assim por diante. Isso fará com que a tabela tenha uma boa aparência em clientes de e-mail antigos.
Use uma tabela como um contêiner para todas as tabelas e elementos internos (por exemplo, para o cabeçalho, conteúdo e rodapé).
Tente não aninhar muitas tabelas e evite usar a propriedade "colspan", pois esta propriedade não é bem compreendida por alguns clientes de desktop.
Tamanho e resolução. Certamente você está acostumado a codificar páginas da web em 800 × 600 ou em 1024 × 768 aproximadamente, mas para o design de e-mails em HTML pode não funcionar muito bem já que a maioria dos clientes mostra o e-mail em uma espécie de "painel de visualização" que normalmente faz parte do espaço total disponível.
A melhor coisa a fazer é definir a largura para cerca de 500-600px ou dar um tamanho em porcentagens, que é como costumo fazer para que se adapte ao espaço que você tem disponível.
Usando Cascading Style Sheets (CSS)O uso de folhas de estilo em documentos HTML para e-mail é limitado e dependendo de qual cliente permitirá mais ou menos propriedades. O ideal é que os estilos sejam aplicados à própria tag (estilos embutidos) em vez de declarar as classes dentro da tag Head como você faria em uma página da web …
Por exemplo, é recomendado usar

ao invés de

.
Se usarmos imagens, é melhor usar o caminho completo para o domínio onde a imagem está hospedada.Gostou e ajudou este tutorial?Você pode recompensar o autor pressionando este botão para dar a ele um ponto positivo

Você vai ajudar o desenvolvimento do site, compartilhando a página com seus amigos

wave wave wave wave wave