Problemas comuns de exibição de email com o Outlook

Marketing_Lite_Plus_Professional_Enterprise

Embora nossos modelos sejam projetados para renderizar corretamente em todos os clientes de email, alguns problemas comuns de exibição de campanha podem surgir quando um assinante visualiza um email HTML no Outlook, especialmente nas versões de 2007, 2010 ou 2013. Isso ocorre porque essas três versões do Outlook usam o Microsoft Word para renderizar emails que oferecem suporte limitado a HTML e CSS.

Este artigo discutirá problemas comuns de exibição que os usuários experimentaram com o Outlook e nossas recomendações para solucionar esses problemas.

As margens não são exibidas

Todas as versões do Outlook (exceto Outlook.com) e Gmail não suportam margens. Em vez disso, recomendamos o uso do bloco de conteúdo espaçador:

Você também pode tentar colocar uma borda para criar espaço em torno dos seus blocos de conteúdo.

A borda é compatível em todas as versões do Outlook e em outros provedores de serviços de email populares. Você pode adicionar bordas a um bloco de conteúdo selecionando o contêiner ou a estrutura no designer de email e ajustando o preenchimento no menu à direita. No entanto, a borda pode fazer com que seu conteúdo pareça restrito quando visualizado em um dispositivo móvel.

A altura da linha não é suportada de forma consistente

O Outlook 2007, 2010, 2013 e Office 365 não oferecem suporte consistente à altura da linha. Algumas versões do Outlook oferecem suporte ao valor percentual da altura da linha (por exemplo, 140%), enquanto outras oferecem suporte a um número inteiro (por exemplo, 4). Recomendamos fornecer ambos os valores se você estiver criando um email do zero e escrevendo seu próprio CSS. Se você estiver usando o designer de email de arrastar e soltar, isso será definido automaticamente para você.

As imagens aparecem distorcidas

O Outlook não reduzirá as imagens de 1000 ou mais pixels de largura. Em vez disso, a imagem será exibida em seu tamanho real, fazendo com que a largura do seu modelo se expanda e fique distorcida. Recomendamos o uso de imagens com entre 400 e 650 pixels de largura.

Observe que, no designer, as imagens são automaticamente reduzidas para 1300 pixels de largura. Isso é o dobro da largura do email, que tem 650 pixels de largura.

Saiba mais sobre como adicionar imagens às suas campanhas

GIFs aparecem como imagens planas

GIFs animados são suportados no cliente de área de trabalho do Outlook 365, aplicativos móveis do Outlook e Outlook.com.

O Outlook 2007, 2010 e 2013 não mostrará animações. Em vez disso, eles mostrarão apenas o primeiro quadro. Se o seu GIF tiver um negócio, título ou call-to-action, verifique se ele está incluído nesse quadro. Para entender como adicionar um GIF em sua campanha, clique aqui

Botões duplicados

Serviços de email como Gmail, Apple Mail e Yahoo renderizam o estilo de botão usando CSS e HTML padrão. Como o Outlook não o faz, fornecemos uma correção para que o Outlook renderize o raio da borda, as bordas e as bordas ao redor do botão corretamente.

No entanto, uma vez que um email é encaminhado por um assinante clicando no botão Avançar em seu provedor de serviços de email, ou se o email é redirecionado através de um Windows ou servidor Exchange, essa correção será lida como um elemento HTML válido, resultando em um botão duplicado.

Infelizmente, não há uma correção para evitar que isso aconteça. Para contornar isso, você pode criar uma imagem de um botão e enviá-la para o seu email como qualquer outra imagem. Em seguida, você pode adicionar seu link para que, quando os contatos clicarem nessa imagem, eles sejam redirecionados para o URL de sua preferência.

Designer de Email: Botões no Outlook

Uma opção de formatação adicional, o botão "Suporte do Outlook", permite que você melhore os botões exibidos no Outlook, inserindo um elemento de código VML especial. O botão "Suporte do Outlook" será ativado por padrão.

In_the_Email_Designer_the_Support_of_Outlook_button_is_under_Global_Settings_then_Button.png

Email Designer e HTML: a imagem de plano de fundo não é exibida

As imagens de fundo que não são exibidas são um problema comum em muitos provedores de email diferentes. Recomendamos que você coloque uma cor substituta caso seu email seja exibido em uma versão do Outlook que não ofereça suporte a imagens de plano de fundo.

Isso se aplica se você criar um email com seu HTML e o Email Designer (lançado em 2022). Observe que, ao usar o Email Designer (lançado em 2022), você pode adicionar uma imagem de plano de fundo na guia "Configurações globais" > "Configurações gerais", além de uma cor de plano de fundo substituta: 

To_set_up_a_fallback_color_in_the_email_designer_go_to_Global_Settings_tab_then_General_settings_and_choose_a_background_color.png

O Designer Clássico não oferece suporte a imagens de plano de fundo.

Designer clássico: alinhamento de texto

O Outlook não oferece suporte ao alinhamento de texto "Justificar".

Infelizmente, não há uma correção para forçar o Outlook a oferecer suporte ao alinhamento de texto justificado.

Observe que o Email Designer (lançado em 2022) não tem a opção de justificar e, portanto, não é um problema quando enviado para o Outlook

Designer clássico: texto quebrado em botões

Botões com texto quebrado ou texto que se divide em uma segunda linha são devido a um problema de renderização do Outlook. Para evitar esse problema, você pode aumentar o padding para que seu botão seja maior do que o tamanho da fonte. Se o problema persistir, recomendamos criar uma imagem do seu botão e usá-la em vez disso (consulte "Botões duplicados" acima).

Designer clássico: os botões exibem fonte incorreta

O Outlook pode renderizar o tipo de fonte incorreto e voltar para Times New Roman. Isso é causado por um espaço adicionado no início e/ou no final do texto do botão. Para evitar esse problema, recomendamos remover esse espaçamento. Se isso não funcionar, você pode criar um novo botão ou criar uma imagem de um botão para usar em sua campanha.

Designer clássico: os links não são clicáveis

Em relação ao alinhamento de imagens, apenas algumas versões do Outlook renderizarão imagens da mesma maneira. Se você tiver uma imagem dentro de um bloco de texto com links na mesma linha da sua imagem, esses links não poderão ser clicados no Outlook 2007 e 2013.

Observe que você não pode adicionar imagens a caixas de texto no Email Designer (lançado em 2022) e, portanto, observe um problema quando enviado para o Outlook.

Por exemplo, o texto com hiperlink abaixo não será clicável para assinantes que usam qualquer versão do Outlook:

example_link.png

Para evitar isso, com o Designer Clássico, recomendamos remover a imagem do bloco de texto e usar um bloco de imagem para evitar isso.

Esse artigo foi útil?
Usuários que acharam isso útil: 35 de 372