E-mails marketing parecem diferentes no Outlook
Ultima atualização: Setembro 25, 2024
Disponível com qualquer uma das seguintes assinaturas, salvo menção ao contrário:
Marketing Hub Professional , Enterprise |
Content Hub Professional , Enterprise |
Marketing Hub Basic (versão anterior) |
Se você estiver usando o editor de e-mail clássico atualizado para redigir seus e-mails de marketing, você pode notar discrepâncias na maneira como seu e-mail é renderizado no Outlook, devido a Suporte limitado do Outlook para CSS.
Se você notar que o posicionamento ou espaçamento do e-mail parece incorreto no Outlook, siga as etapas abaixo para a solução de problemas.
Saiba mais sobre design de e-mail no HubSpot Comunidade de Designers.
Observe: O Suporte da HubSpot não oferece suporte a modelos de e-mail codificados personalizados. Se você estiver usando um modelo codificado personalizado, procure o provedor que criou o modelo. Você também pode se conectar com outros usuários e designers do HubSpot no Comunidade.
Espaçamento
Há dois métodos para ajustar o espaçamento em torno de imagens no Outlook: usando hspace ou vspace, e usando tabelas.
Usando hspace e vspace
O atributo HTML vspacedefine espaço vertical e adicionará espaçamento igual à parte superior e inferior da sua imagem. O atributo hspace define espaço horizontal e adicionará espaçamento igual à direita e à esquerda da sua imagem.
- Na sua conta HubSpot, acesse Marketing > E-mail marketing.
-
Passe o mouse sobre o nome do e-mail com um modelo codificado personalizado, então clique Editar.
-
Clique no módulo de conteúdo.
- No final do código da imagem, adicione um ou ambos os códigos a seguir:
hspace="10" vspace="10"
, substituindo10
com o espaçamento desejado.
Usando tabelas
Você pode usar uma tabela de três colunas para conter uniformemente sua imagem, espaçamento e texto:
- Na sua conta HubSpot, acesse Marketing > E-mail marketing.
-
Passe o mouse sobre nome do e-mail com um modelo codificado personalizado, então clique Editar.
-
Na barra de ferramentas do editor de rich text, clique em Inserir > Tabela. Crie uma tabela 3x1.
-
Na barra de ferramentas do editor de rich text, clique em Avançado, então selecione Código fonte.
-
Especifique uma largura na célula vazia, como
<td width="10">
, para a quantidade de espaçamento que você gostaria entre a imagem e o texto. -
Especifique uma família de fontes, tamanho de fonte, cor de fonte e altura de linha, como
style="font-family: sans-serif; font-size:15px; line-height: 1.5em; color: #000000"
pois o Outlook adicionará seu próprio estilo quando não especificado.
Solucionar problemas de linhas horizontais inesperadas que aparecem em seu e-mail
Devido a um bug conhecido em algumas versões do Outlook, uma linha horizontal pode aparecer entre as seções do seu e-mail. Embora não haja uma maneira consistente de corrigir o problema, você pode tentar as seguintes etapas de solução de problemas:
- Defina a cor de fundo do seu e-mail para que seja a mesma cor do corpo.
- Atualize o tamanho da fonte e a altura da linha do seu conteúdo para números pares.
- Incluir o seguinte Estilos CSS na seção de cabeçalho do seu modelo de e-mail:
ms-text-size-adjust: none; mso-line-height-rule: exactly;