Como fazer com que as mensagens tenham uma boa aparência no Outlook?

Algumas versões do Microsoft Outlook podem ter abordagens diferentes para exibir mensagens de e-mail. Este artigo descreve as discrepâncias mais comuns.

Observe que não temos controle sobre como o Outlook exibe as mensagens. No entanto, gostaríamos de fornecer algumas dicas sobre como minimizar as alterações de exibição feitas por este aplicativo.

Linhas são adicionadas automaticamente à mensagem.

As linhas herdam a cor do fundo no corpo do e-mail, portanto, você pode começar por ajustar a cor do fundo. Além disso, colocar tudo em uma única seção em vez de dividir em diferentes seções pode ajudar (apenas não as torne muito longas). Às vezes, ajustar o tamanho da fonte também ajuda.

GIFs animados não são exibidos.

GIFs animados não são suportados em versões do Outlook anteriores a 2019. Se você deseja usar GIFs em sua mensagem, certifique-se de que as informações mais importantes estejam no primeiro quadro do GIF para que sejam visíveis também para os usuários de versões mais antigas do Outlook.

Padding e margens não são exibidos.

Certas versões do Outlook removerão o enchimento em diversas situações. Uma das mais comuns envolve o enchimento de imagens, que, quando ignorado, pode fazer com que o texto apareça colado à imagem. Para contornar isso, adicione uma borda na mesma cor do fundo à imagem em vez de usar enchimento.

As versões para desktop do Outlook não suportam a estilização das tags <div>, o que significa que algumas quebras de linha não serão respeitadas. A interpolação também será ignorada.

Meu fundo e estilização não são exibidos.

O Outlook não suporta algumas opções de estilização. Por exemplo, bordas arredondadas não funcionarão.

O Outlook também remove a estilização de links se você adicionar um URL sem o “http://” ou “https://” nos seus links (como links de protocolo personalizado, por exemplo).

O Outlook não suporta os seguintes estilos CSS:

  • background-attachment
  • background-image
  • background-position
  • background-repeat
  • clear
  • display
  • float
  • list-style-image
  • list-style-position
  • text-transform
  • word-spacing

Portanto, se você usar uma imagem como um fundo, por exemplo, ela não será exibida no Outlook.

Minha imagem não está sendo exibida.

O Outlook possui um limite máximo de altura de rolagem, que é de 2000 pixels. Se uma imagem tiver uma altura maior do que isso, a opção de exibir imagens não será exibida para essa imagem.

Além disso, parágrafos maiores serão cortados.

Minha fonte não está sendo exibida.

O Outlook suporta um número fixo de fontes – sugerimos sempre definir uma fonte fallback para qualquer fonte personalizada que você esteja adicionando. Uma fonte de fallback é uma fonte que será carregada quando a webfont selecionada não puder ser exibida em um determinado cliente de e-mail. Algumas fontes seguras incluem:

  • Courier
  • Courier New
  • New Arial
  • Arial black
  • Veranda
  • Tahoma Georgia
  • Times New Roman

Problemas com a largura da mensagem.

Uma largura amigável ao Outlook é de 550 a 600 pixels – mensagens mais largas podem não ser exibidas corretamente no Outlook.

Algumas versões para desktop do Outlook tentam empilhar o conteúdo das colunas, exibindo os modelos de e-mail responsivos que são destinados a serem exibidos em dispositivos móveis. Se você deseja evitar isso, selecione a opção Manter colunas lado a lado em dispositivos móveis nas propriedades da visualização móvel da mensagem.

As imagens têm tamanhos diferentes.

O Microsoft Outlook ajusta automaticamente a resolução da imagem para 96 dpi, portanto, certifique-se de ajustar a imagem antes de fazer o upload para Arquivos e imagens.

Meu link não está sendo envolvido.

Algumas versões do Outlook podem não agrupar links longos, a menos que isso seja selecionado nas configurações do Outlook.

Outras coisas para lembrar

  • Quanto mais antiga a versão do Outlook, menos provável é que ela suporte alguns estilos HTML5.
  • As versões para desktop não são atualizadas tão rapidamente quanto as versões de navegador, portanto, haverá discrepâncias dependendo da versão que você está usando.
  • Teste a mensagem na pre-visualização de caixa de entrada para ver como ela será renderizada pelo Outlook.
  • Use links para a versão online da mensagem para permitir que os assinantes visualizem a mensagem sem alterações no navegador.
  • Certifique-se de que o texto não tenha sido copiado de um editor externo – muita formatação não suportada, que pode não ser visível no criador, pode ser lida pelo Outlook e bagunçar o layout.

Recursos populares