{"id":4341,"date":"2017-03-12T08:09:00","date_gmt":"2017-03-12T11:09:00","guid":{"rendered":"https:\/\/luizeof.com.br\/?p=4341"},"modified":"2019-10-21T11:59:45","modified_gmt":"2019-10-21T14:59:45","slug":"cuidado-css-html-email-marketing","status":"publish","type":"post","link":"https:\/\/powertic.com\/pt-br\/cuidado-css-html-email-marketing\/","title":{"rendered":"(Opini\u00e3o) Cuidado com o CSS e HTML no E-mail Marketing"},"content":{"rendered":"<p>O HTML e o CSS &nbsp;s\u00e3o essenciais para a web mas podem se tornar os vil\u00f5es das&nbsp;suas campanhas de e-mail marketing. Veja algumas dicas para que eles n\u00e3o te atrapalhem.<\/p>\n<p>Vivemos na era do excesso no e-mail marketing, onde muitas vezes nossas pe\u00e7as de e-mail s\u00e3o mais elaboradas do que nosso pr\u00f3prio site. Veja, grandes players da web est\u00e3o indo em dire\u00e7\u00e3o ao minimalismo focando essencialmente no conte\u00fado.<\/p>\n<h2>Grandes players est\u00e3o removendo o excesso<\/h2>\n<p>Podemos dar como exemplo as p\u00e1ginas AMP do Google e o Instant Articles do Facebook, que removem totalmente o layout do website e foca somente no conte\u00fado oferecido visando a experi\u00eancia do usu\u00e1rio.<\/p>\n<p>Aqui na Powertic n\u00f3s recomendamos sempre o minimalismo no que diz respeito ao envio de e-mail. Foque no conte\u00fado, no assunto e nas chamadas. Crie um bot\u00e3o vis\u00edvel e pronto. Se seu conte\u00fado \u00e9 bom o contato vai clicar &#8230; esque\u00e7a a hist\u00f3ria de &#8220;chamar a aten\u00e7\u00e3o&#8221;, isso j\u00e1 n\u00e3o cola mais.<\/p>\n<p>Um dos grandes problemas com Layout de e-mail \u00e9 como lidar com a renderiza\u00e7\u00e3o nos diversos clientes de e-mail que circulam por a\u00ed. Temos os webmails como o Yahoo, aplicativos Desktop como o Outlook e os Apps para dispositivos m\u00f3veis como o Inbox do Google. Cada um se comporta de uma maneira e renderiza o e-mail de modo diferente.<\/p>\n<h2>A dor de cabe\u00e7a do Outlook<\/h2>\n<p>A microsoft conseguiu fazer o aplicativo que ao mesmo tempo \u00e9 o mais amado e odiado de todos: O Outlook.<\/p>\n<p>Cada nova vers\u00e3o do Outlook tem uma nova firula que atrapalha n\u00f3s que criamos pe\u00e7as para e-mail marketing. Seja um novo motor de renderiza\u00e7\u00e3o baseado no Word (acredite, \u00e9 verdade) ou uma nova op\u00e7\u00e3o de privacidade que n\u00e3o vai carregar nosso tracking. O Outlook \u00e9 uma dor de cabe\u00e7a e por isso recomendamos e-mails em texto, sem muitas imagens e com o foco no conte\u00fado.<\/p>\n<h2>Mais trabalho para compilar o CSS<\/h2>\n<p>Outro ponto muito importante que muitos esquecem \u00e9 que um e-mail bem feito n\u00e3o tem CSS embutido, pois a maioria dos Clientes n\u00e3o aceitam tais regras. Por padr\u00e3o toda a formata\u00e7\u00e3o de um e-mail deve ser inline, dentro do pr\u00f3prio elementor HTML com o atributo style. Nada de CSS.<\/p>\n<p>Voc\u00ea pode ver uma lista completa de itens CSS aceitos pelos principais clientes <a href=\"https:\/\/www.campaignmonitor.com\/css\/\" target=\"_blank\" rel=\"noopener noreferrer\">aqui<\/a>.<\/p>\n<h2>Em Design, &nbsp;Menos \u00e9 mais<\/h2>\n<p>Todo mundo tem um amigo Designer e este sempre fala: Menos \u00e9 mais. A mesma regra se aplica ao e-mail marketing. Sabe aquela longa newsletter com 10 produtos do seu e-commerce? Esque\u00e7a. Ou aquele texto do seu blog que voc\u00ea manda 4 par\u00e1grafos por e-mail. Ningu\u00e9m L\u00ea.<\/p>\n<p>Fa\u00e7a e-mails curtos, pessoais, onde a pessoa vai ler n\u00e3o por ser uma armadilha mas por que voc\u00ea realmente conseguiu captar a aten\u00e7\u00e3o dela com algo que vale a pena.<\/p>\n<p>Cansei de ver campanhas onde os primeiros e-mails chegavam a 80% de abertura e&nbsp;4 ou 5 e-mails depois n\u00e3o chegava nem em 5%. A culpa \u00e9 do SMTP? do Mautic? do Servi\u00e7os de Hospedagem? N\u00e3o, a culpa \u00e9 do seu e-mail que n\u00e3o encanta mais. As pessoas est\u00e3o mais espertas com isso.<\/p>\n<p>Um grande abra\u00e7o e at\u00e9 a pr\u00f3xima!<\/p>","protected":false},"excerpt":{"rendered":"<p>O CSS que \u00e9 essencial para a web pode se tornar um vil\u00e3o nas suas campanhas de e-mail marketing. Veja algumas dicas para que ele n\u00e3o te atrapalhe.<\/p>","protected":false},"author":4,"featured_media":43139,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[20],"tags":[],"class_list":["post-4341","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-artigos-mautic"],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/powertic.com\/pt-br\/wp-json\/wp\/v2\/posts\/4341","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/powertic.com\/pt-br\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/powertic.com\/pt-br\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/powertic.com\/pt-br\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/powertic.com\/pt-br\/wp-json\/wp\/v2\/comments?post=4341"}],"version-history":[{"count":0,"href":"https:\/\/powertic.com\/pt-br\/wp-json\/wp\/v2\/posts\/4341\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/powertic.com\/pt-br\/wp-json\/wp\/v2\/media\/43139"}],"wp:attachment":[{"href":"https:\/\/powertic.com\/pt-br\/wp-json\/wp\/v2\/media?parent=4341"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/powertic.com\/pt-br\/wp-json\/wp\/v2\/categories?post=4341"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/powertic.com\/pt-br\/wp-json\/wp\/v2\/tags?post=4341"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}