POST
DO DIEGO
DEV WEB
30
Cargo:
Criador do
Tableless.com.br e
coordenador de
Front-end na Locaweb
Contato:
diego@
tabeless.com.br
Twitter:
@diegoeis
DIEGO EIS
squeça tudo o que você
sabe sobre CSS 3, HTML 5,
Javascript e qualquer outra
novidade que tenha surgido
nos últimos dez anos. Para
fazer um newsletter, você
não vai usar nada disso.
Criar e-mail marketing é algo chato e,
provavelmente, não vai ficar do jeito que
você quer na primeira nem na segunda vez.
Se você reclama do Internet Explorer quando
vai fazer seu código é porque ainda não
lidou com os clientes de e-mail. É um mundo
totalmente diferente do que conhecemos e
com que estamos acostumados.
Eu sei que você gostaria que eu estivesse
exagerando, mas não estou. Cada cliente
de e-mail tem suas restrições de segurança
e seu suporte específico aos padrões web.
Clientes de e-mail online, como o Gmail, têm
preocupações que um cliente instalado, como
o Outlook, não precisa ter. É por isso que
sempre temos de voltar à base, com o mínimo
de features possível.
Quando digo que você precisa voltar aos
velhos tempos, eu não estou brincando. O que
funciona perfeitamente em todos os clientes
de e-mail são as tabelas. É com elas que
você vai estruturar seu layout. Nada de float.
Float não funciona no Outlook. Background-
image também não funciona. E se você já está
achando que o Outlook é o problema, espere
até descobrir que o Gmail simplesmente
remove qualquer tag <style> que estiver no
documento e só aceita estilos inline, com o
atributo style direto na tag. Nesse cenário,
não tem quem seja melhor, só há piores.
Com as tabelas, você poderá usar as
propriedades font e text, com todos seus
respectivos valores. Logo, você já consegue
formatar a tipografia do seu e-mail, contanto
que use apenas fontes do sistema, porque a
propriedades font-face funciona apenas em
aparelhos que rodam iOS e no Apple Mail.
E os seletores do CSS? Sem seletores a
gente não consegue fazer muita coisa, né?
Pois é… Vamos continuar sem fazer muita
coisa. O seletor mais básico, que chamamos
“selector encadeado“, feito assim
“div p”, pode não funcionar no Gmail. Em
todos os outros clientes, esse seletor
funciona perfeitamente.
A propriedade width funciona em
tudo. Height só não funciona no Outlook
2007/2010 e 2013. Já o padding e margin,
podem ser usados à vontade. Contanto
que sejam em tabelas, porque em divs não
funcionarão no Outlook.
Lembre-se: nesse ambiente incerto de
e-mails, não acredite apenas em serviços
online para testar seus e-mails. Envie
mensagens para você mesmo, teste em todos
os clientes que puder. Essa é a melhor forma
de obter um resultado decente.
E
[
DE ACORDOCOM
OLITMUS, SERVIÇO
PARA TESTAR
E-MAILMARKETING,
WEBSITES E
DIVERSOS
BROWSERS, O
CLIENTEDE E-MAIL
DO IPHONE ÉO
MAISPOPULAR.
OOUTLOOKVEM
EMSEGUNDO
LUGAR. DEPOIS,
VEMOCLIENTE
DOANDROID,
SEGUIDOPOR
IPAD, APPLEMAIL,
YAHOO! MAIL E
GMAIL
]
E-MAILMARKETING:
O INFERNO
PARTE 1
LW
REVISTA LOCAWEB