Aprenda NumClique > Curiosidades > Desenvolvimento Web

Como enviar e-mails HTML com CSS incorporado

newsletter-html-cssHá alguns dias, um cliente me pediu para fazer uma newsletter para sua empresa. Seria minha primeira experiência com e-mails HTML. Até aí, tudo tranquilo… fazer o layout, o html e o css é uma tarefa bastante fácil. O que eu não contava era com o fato dos webmails não estarem carregando o CSS que eu tinha feito para a news… Logo pensei… A casa caiu… nunca fiz implementações de layout com tabelas… será que eu teria que regredir e fazer este tipo de implementação?

Pedi orientação para algumas pessoas sobre o lance da newsletter e o que muitos disseram era sobre a chamada do CSS no topo da página com o endereço absoluto… #BIG FAIL… nada… estava carregando somente textos e sem estilo algum… nos clientes de e-mail, tudo bem… carregava bem direitinho, mas nos webmails (Gmail, Hotmail, Yahoo! Mail…) necas… não carregava nada além de texto…

O que fazer para resolver isso?

Para contornar este problema e ter seu layout no e-mail carregado bem direitinho… é bastante simples… basta que você incorpore o CSS no próprio HTML, dentro do cabeçalho (HEAD)… Simples assim!

Quais as vantagens de fazer a newsletter assim?

Se o webmail da pessoa que receber estiver com o bloqueio de imagens habilitado, ele saberá do que se trata seu e-mail, pois ele será carregado em forma de texto sem o menor problema. A grande desvantagem do uso das tabelas, é que, se a pessoa não habilitar as imagens, só aparecerão quadrados, que muitas vezes serão deletados sem serem abertos…

Enfim… é isso… em caso de dúvidas… deixa aí nos comentários que na medida do possível daremos um help!

Publicado em

28
de janeiro de 2009

Twitter: @joares

Posts relacionados

Comentários