Como limitar a assinatura HTML do Outlook Mobile a uma única imagem de logotipo
🔍 WiseChecker

Como limitar a assinatura HTML do Outlook Mobile a uma única imagem de logotipo

Ao configurar uma assinatura de e-mail no Outlook Mobile, o aplicativo pode converter automaticamente seu HTML cuidadosamente projetado em um bloco confuso de código bruto ou várias imagens quebradas. Esse problema ocorre porque o Outlook Mobile não suporta tabelas HTML complexas, várias imagens ou CSS incorporado como a versão desktop. Este artigo explica como simplificar sua assinatura HTML para uma única imagem de logotipo que seja exibida corretamente em qualquer dispositivo móvel. Você aprenderá a estrutura HTML exata a ser usada, como testá-la e o que evitar.

Principais conclusões: Criando uma assinatura pronta para dispositivos móveis com uma imagem

  • Use uma única tag <img> com largura e altura inline: Impede que o Outlook Mobile estique ou dimensione o logotipo incorretamente.
  • Hospede a imagem em uma URL HTTPS pública: O Outlook Mobile bloqueia imagens HTTP por padrão, portanto, seu logotipo deve ser servido por uma conexão segura.
  • Evite tags <table>, <div> e <style>: Esses elementos fazem com que o Outlook Mobile remova a assinatura ou exiba o código HTML bruto em vez da imagem.

ADVERTISEMENT

Por que o Outlook Mobile rejeita assinaturas HTML complexas

O Outlook Mobile usa um renderizador HTML limitado que remove CSS, JavaScript e a maioria das tags estruturais. Quando o aplicativo encontra uma assinatura com tabelas aninhadas, várias imagens ou estilos de fonte, ele remove esses elementos completamente ou mostra o código HTML fonte bruto ao destinatário. Esse comportamento é proposital para reduzir riscos de segurança e manter as mensagens leves em redes móveis.

A limitação principal é que o Outlook Mobile renderiza de forma confiável apenas uma única imagem inline com atributos básicos. Quaisquer imagens adicionais, links ou formatação provavelmente serão descartados. Para um logotipo corporativo que deve aparecer consistentemente em todas as respostas e encaminhamentos, você precisa de uma assinatura que contenha apenas uma tag <img>.

O que o Outlook Mobile suporta vs. remove

O Outlook Mobile preserva os seguintes elementos HTML em assinaturas: <img> com atributos src, width, height e alt; texto simples; e quebras de linha simples (<br>). Ele remove ou quebra os seguintes: <table>, <tr>, <td>, <div>, <span>, <style>, <link>, <script>, <font> e quaisquer classes ou IDs CSS. Conhecer esse limite é o primeiro passo para criar uma assinatura que funcione.

Passos para criar uma assinatura com uma única imagem para o Outlook Mobile

  1. Faça upload do seu logotipo para um servidor HTTPS público
    Sua imagem de logotipo deve estar acessível pela internet via HTTPS. Use um servidor web da empresa, um serviço de armazenamento em nuvem com link público ou uma plataforma de hospedagem de imagens dedicada. A URL deve começar com https://. O Outlook Mobile bloqueia imagens HTTP para evitar avisos de conteúdo misto. O arquivo de imagem deve ter menos de 100 KB para carregar rapidamente em redes móveis.
  2. Redimensione a imagem para as dimensões corretas
    Use um editor de imagens para definir a largura do logotipo em 200 pixels e a altura proporcional à proporção original. Um logotipo com mais de 300 pixels de largura pode ser cortado pelo Outlook Mobile em telas menores. Salve o arquivo como PNG ou JPEG. Não use formatos GIF ou BMP, pois o Outlook Mobile pode não renderizá-los de forma confiável.
  3. Escreva o código HTML mínimo da assinatura
    Abra um editor de texto simples, como o Bloco de Notas. Digite o seguinte código exatamente, substituindo a URL e as dimensões pelos seus próprios valores:

    <img src="https://suaempresa.com/logo.png" width="200" height="60" alt="Logotipo da Sua Empresa">

    Não adicione outras tags, quebras de linha ou espaços ao redor da tag <img>. A assinatura deve conter apenas esta única linha de HTML.

  4. Copie o HTML para as configurações de assinatura do Outlook Mobile
    No seu iPhone ou dispositivo Android, abra o Outlook Mobile. Toque na sua foto de perfil ou no ícone da conta no canto superior esquerdo. Toque no ícone de engrenagem para abrir as Configurações. Role para baixo e toque em Assinatura. Na conta de e-mail que deseja modificar, toque em Assinatura. Exclua qualquer conteúdo existente. Cole a tag <img> única que você criou. Toque em Salvar no canto superior direito.
  5. Envie um e-mail de teste para verificar a assinatura
    Componha um novo e-mail para seu próprio endereço de trabalho ou uma conta de teste. Não adicione texto no corpo. Envie a mensagem. Abra o e-mail recebido em um cliente de e-mail desktop e no aplicativo Outlook Mobile. Verifique se o logotipo aparece como uma única imagem, sem ícone de link quebrado ou código HTML bruto ao redor.

ADVERTISEMENT

O que fazer se a assinatura ainda aparecer incorretamente

O Outlook Mobile mostra o código HTML em vez da imagem

Isso acontece quando a assinatura contém caracteres ou tags extras. Abra a assinatura novamente no Outlook Mobile. Exclua tudo. Cole apenas a tag <img> única. Não adicione uma linha em branco antes ou depois. Salve e teste novamente.

O logotipo aparece como um ícone de imagem quebrada

A URL da imagem não está acessível ou está bloqueada. Verifique se a URL começa com https:// e se o arquivo está publicamente acessível. Abra a URL em um navegador móvel para confirmar se carrega. Se a URL funcionar no navegador, mas não na assinatura, o servidor pode estar bloqueando hotlinking. Configure seu servidor web para permitir solicitações de origens cruzadas ou mova a imagem para um host diferente.

A imagem está muito grande ou esticada

O Outlook Mobile ignora os atributos width e height se o arquivo de imagem em si tiver mais de 500 pixels de largura. Redimensione a imagem de origem para exatamente 200 pixels de largura usando um editor de imagens. Faça upload do arquivo redimensionado e atualize a URL src na assinatura.

A assinatura aparece no Outlook desktop, mas não no mobile

O Outlook Mobile não sincroniza assinaturas com a versão desktop. Você deve configurar a assinatura separadamente em cada dispositivo. Siga os mesmos passos em cada iPhone ou dispositivo Android onde deseja que o logotipo apareça.

Assinatura com uma única imagem vs. assinatura HTML completa: principais diferenças

Item Assinatura com uma única imagem Assinatura HTML completa
Renderização no Outlook Mobile Exibe o logotipo de forma confiável sempre Frequentemente mostra HTML bruto ou um espaço em branco
Complexidade Uma linha de código, sem CSS ou tabelas Múltiplas tabelas, fontes, cores e imagens
Tamanho do arquivo no e-mail Menos de 100 KB para a imagem Pode exceder 500 KB com ativos incorporados
Tempo de configuração 5 minutos por dispositivo 30 minutos mais testes em vários clientes
Risco de quebra após atualizações Baixo — apenas um elemento pode quebrar Alto — as atualizações do Outlook Mobile frequentemente removem HTML complexo

Agora você pode criar uma assinatura do Outlook Mobile que contém apenas uma única imagem de logotipo e é exibida corretamente em cada resposta e encaminhamento. Após configurar a assinatura, teste-a enviando uma mensagem para um colega usando uma plataforma móvel diferente. Para controle avançado, considere usar regras de transporte do Microsoft Exchange para anexar uma assinatura amigável para dispositivos móveis no lado do servidor, em vez de depender das configurações do lado do cliente.

ADVERTISEMENT