Tamanhos de e-mail: as dimensões ideais para seus modelos [2022]

Já se perguntou quais são os tamanhos de e-mail ideais para seus modelos de newsletter? Você precisa escolher uma largura e altura específica para eles?

Bem, a resposta curta é sim. A resposta longa é um pouco mais complexa. Mas não se preocupe, porque vamos explorar tudo o que você precisa saber sobre as dimensões ideais e quantos pixels (px) eles precisam ter para renderizar corretamente.

Para você ter uma ideia, hoje veremos os tamanhos essenciais, incluindo:

• Largura e altura do modelo
• Tamanho do arquivo da campanha
• Cabeçalho do e-mail
• Blocos de conteúdo e rodapé

Sem mais delongas, vamos vê-los!

Dimensões do modelo de e-mail: visão geral

Se você estiver com pressa para descobrir os melhores tamanhos para seus boletins informativos , consulte a tabela abaixo:

Agora, vamos dar uma olhada mais detalhada neles!

Tamanho do e-mail - Anatomia do elemento

Aqui está um exemplo de boletim informativo por e-mail e os elementos que examinaremos:

Esta campanha tem uma largura de 664 px e uma altura de 2549 px. O design do e-mail é exibido bem nas caixas de entrada do Gmail e do Outlook e é renderizado corretamente em dispositivos móveis. No que diz respeito ao tamanho do arquivo, são 57,8 KB, que está dentro dos limites de tamanho ideais.

Antes de prosseguirmos, lembre-se de que seu design pode ser exibido de forma diferente dependendo da resolução e do tamanho da tela de seus assinantes . Então, agora que sabemos o que vamos examinar, vamos começar a explorar esses tamanhos “ideais” um por um!

Melhores tamanhos de e-mail: largura, altura e peso

Começando com as dimensões cruciais do modelo de e-mail HTML , vamos descobrir a melhor largura, altura e “peso” necessários para evitar problemas com clientes de e-mail populares como Gmail, Outlook.com, Yahoo Mail e muito mais.

Largura do e-mail

A maioria das dicas de marketing destaca que a largura ideal deve ser de 600 px . Então o que isso quer dizer? Todos os seus modelos não precisam ser mais do que isso para serem eficientes?

Bem não. Embora 600 px seja a largura padrão do modelo de email, você pode ter modelos mais amplos. A razão para isso é que os clientes de e-mail de hoje são muito mais avançados do que no passado. Portanto, exibir modelos mais amplos não é mais um problema.

No entanto, embora você possa experimentar a largura, saiba que o Gmail pode não exibir cores de plano de fundo para designs com mais de 640 px. Isso pode ser uma chatice para suas campanhas, portanto, a maneira mais fácil de evitá-lo é usar layouts com largura máxima de 640 px .

Abaixo, você pode ver uma mensagem de e-mail da Apple com uma largura de 736 px:

Se você quiser usar modelos mais amplos, certifique-se de aproveitar várias ferramentas de visualização de e-mail para garantir que a largura escolhida não cause problemas.

Além disso, é bom saber que a maioria dos construtores de templates de e-mail, como Moosend e Mailchimp, oferecem designs que têm, por padrão, 600 px de largura, para que você não precise se preocupar com os tamanhos dos templates de e-mail.

Altura do e-mail

Agora vamos falar sobre a altura do modelo de email . Aqui, você pode chegar a 1500 px ou mais , dependendo do conteúdo que deseja apresentar.

Você pode ficar “selvagem” com esse tamanho de e-mail, mas lembre-se de que seu assinante deve ser capaz de digerir a mensagem sem rolar até o infinito para chegar ao ponto!

Idealmente, seu modelo deve ter entre 1500 e 3000 px . Se você acha que 3000 px não é muito, vamos ver um exemplo da vida real do The Citizenry:

O exemplo acima tem uma altura de 2230 px, que os assinantes podem verificar em alguns pergaminhos.

É claro que muitos profissionais de marketing por e-mail escolherão alturas maiores para suas campanhas. Ao mostrar ao seu público tudo o que você tem a oferecer, não esqueça que nossa atenção é muito curta, tendo diminuído significativamente nos últimos 15 anos!

Portanto, uma altura de 2000-25000 px é melhor do que fazer com que seu destinatário percorra um modelo infinito para chegar ao seu CTA!

Peso do e-mail

Bem, agora que você conhece a largura e a altura da sua campanha, vamos falar um pouco sobre o melhor tamanho de arquivo para seu modelo .

Geralmente, você deseja criar mensagens que chegarão à caixa de entrada de seus assinantes sem nenhum problema. Uma linha de assunto com spam geralmente é a causa do acionamento de filtros de spam. Mas você sabia que o tamanho do seu arquivo de e-mail também pode ser a causa da baixa capacidade de entrega de e-mail?

Para evitar isso, você deve manter o “peso” do seu e-mail bem leve. Isso significa que você precisa ter campanhas de e-mail com um corpo entre 20 e 102 KB .

Aqui estão três maneiras rápidas de evitar problemas de renderização:

• Apontar para um tamanho máximo de arquivo de e-mail de 102 KB
• Use elementos visuais (GIFs, imagens) com sabedoria
• Deixe de fora anexos grandes

Recorte da caixa de entrada

Mas o que acontece quando seu email tem mais de 102 KB? Bem, se você enviá-lo para um endereço do Gmail, o cliente de e-mail recortará sua mensagem .

O recorte de e-mail ocorre quando as campanhas ultrapassam o limite máximo de tamanho de arquivo. Como resultado, o Gmail ocultará ou “recortará” sua campanha, e os assinantes precisarão selecionar a opção “Visualizar mensagem inteira” para conferir.

Embora o Gmail mostre sua mensagem a eles, recortar suas campanhas não é ideal para a experiência do usuário. Adicionar uma etapa extra ao processo pode frustrar seus contatos e resultar em taxas de cliques e engajamento mais baixas .

A solução é simples: mantenha seus e-mails com menos de 102 KB (75 KB é simplesmente perfeito)!

Dimensões do elemento da campanha de e-mail

Agora que abordamos os tamanhos vitais de e-mail que você precisa conhecer, vamos descobrir as dimensões certas para seus componentes de e-mail , começando com o pré-cabeçalho de e-mail.

Pré-cabeçalho de e-mail

Em primeiro lugar, seu pré-cabeçalho de e-mail é a linha extra de cópia após suas linhas de assunto. Você pode verificar rapidamente olhando para sua caixa de entrada. Normalmente, eles se parecem com isso:

No entanto, o texto do pré-cabeçalho também é visível como uma mensagem curta na parte superior do boletim informativo por e-mail. Essas linhas de cópia podem fornecer aos seus leitores informações valiosas e até permitir que eles visualizem seus e-mails no navegador.

Aqui está um exemplo da Sigma Beauty:

Então, qual deve ser o tamanho do seu preheader de e-mail?

Quando se trata de largura, seu pré-cabeçalho será tão largo quanto o restante de sua campanha. Em termos de altura, porém, deve estar entre 20 px e 60 px .

Cabeçalho do e-mail

Passando para um dos elementos mais importantes de suas campanhas, o cabeçalho do email! Como você deve ter notado, as campanhas podem ter diferentes tamanhos de cabeçalho de e-mail. Vejamos alguns exemplos.

Aqui está um de Wendell August Forge:

(600×98px)

E um de The Blonde Abroad:

(600×255px)

Ambos os cabeçalhos têm a mesma largura de 600 px. No entanto, quando se trata de altura, o segundo tem 255 pixels de altura.

Embora um cabeçalho menor como o de Wendell August Forge seja ideal tanto para desktop quanto para dispositivos móveis, ter um cabeçalho um pouco mais alto não será um problema (desde que você o teste primeiro!). Como regra, o cabeçalho da sua campanha de e-mail deve ter cerca de 60 a 70 px de altura . No entanto, se o seu logotipo contiver elementos adicionais ou um menu, ele poderá ter até 200 px .

Novamente, não se esqueça de verificar o painel de visualização do Gmail ou Outlook ou o modo de visualização da sua ferramenta de software de marketing por email! O Moosend, por exemplo, possui um recurso de desktop e mobile que permite que você verifique a aparência da sua campanha antes de enviá-la para sua lista de e-mail. Você pode facilmente se inscrever para uma conta e experimentá-la gratuitamente!

Blocos de conteúdo de e-mail

Agora vamos dar uma olhada nos tamanhos de e-mail de seus blocos de conteúdo. Esses blocos podem ter qualquer coisa, desde cópia de e-mail e imagens até GIFs, vídeos e CTAs!

Em relação à largura, seus blocos de conteúdo devem seguir o tamanho do modelo de email que você escolheu . No entanto, em termos de altura, há algumas coisas que você precisa ter em mente.

Em primeiro lugar, para oferecer a melhor experiência ao seu público, você precisa tornar seus blocos de conteúdo valiosos e curtos. Bloqueios de conteúdo longos resultarão em abandono de e-mail e tempos de leitura de e-mail baixos! E você não precisa de nada disso.

Abaixo, você encontrará uma campanha de email marketing de Julie Blanner com três blocos de conteúdo:

Cada bloco tem 344 px de altura e inclui uma imagem, uma cópia e uma frase de chamariz direta. Visualmente, cada bloco de continente é fácil de ler e interagir. O design minimalista do e-mail também ajuda o propósito do blogueiro.

No total, o conteúdo do e-mail de Julie Blanner tem 1032 px de altura, excluindo o bloco de assinatura do blogueiro. Se considerarmos todos os itens acima, é seguro dizer que seus blocos de conteúdo precisam ser curtos o suficiente para que seus assinantes os vejam em alguns pergaminhos.

Assim, podemos agora concluir que:

• Cada bloco de conteúdo deve ter cerca de 200-300 px de altura .
• A altura total de seus blocos de conteúdo deve ser de 800-1200 px .

Tamanho do rodapé do e-mail

Por último, mas não menos importante, temos os rodapés da sua campanha de e-mail , onde você pode encontrar botões de mídia social e de cancelamento de inscrição, links de sites e muito mais.

Assim como os cabeçalhos, os rodapés podem variar de tamanho dependendo de seus objetivos. Por exemplo, o tamanho do rodapé do Modcloth tem 600 px de largura e 361 px de altura:

O rodapé acima funciona bem com o design do email, pois fornece aos assinantes todas as informações necessárias que eles precisam ver antes de fechar o email. Em termos de altura, pode ser demorado, considerando que os rodapés de e-mail precisam ser um último recurso inteligente para capturar a atenção do seu assinante sem incomodá-lo.

Com isso em mente, o tamanho de e-mail ideal para seu rodapé deve ser em torno de 100 px . Se você precisar incluir mais elementos, como links de sites, certifique-se de que o comprimento total não seja superior a 300 px .

Tamanhos de componentes de e-mail adicionais

Além do pré-cabeçalho, cabeçalho, blocos de conteúdo e rodapé, você deve considerar seus banners, botões de CTA e tamanhos de imagem. Vamos ver!

Faixa de e-mail

Vamos falar de banners por um minuto. Primeiro, um banner de e-mail geralmente é uma imagem infundida por cópia encontrada no topo de sua campanha de marketing por e-mail. Um ótimo design de banner de e-mail pode animar seu público e dar a ele mais motivos para se envolver com sua mensagem.

Por exemplo, aqui está um exemplo de banner da Velasca:

O banner da marca inclui todas as informações necessárias para atrair a atenção do assinante . Ele tem seu logotipo, cópia clara, gráficos e um botão de CTA. Além disso, em termos de tamanho, o exemplo acima tem 600 px de largura e 612 px de altura, o que é bastante ideal com base nos dados a seguir.

Mais especificamente, de acordo com a Swift Digital, o tamanho de banner recomendado deve ser:

• 600-700 px de largura (320-385 px para dispositivos móveis)
• 1730 pixels de altura

Botões de CTA

Os profissionais de marketing por e-mail de comércio eletrônico geralmente adicionam botões coloridos de CTA para incentivar os clientes em potencial a agir. Os profissionais de marketing B2B, por outro lado, podem adicionar um hiperlink para levar seus assinantes ao site ou às páginas de destino.

Para garantir que seus botões estejam alinhados com o design do seu e-mail, vamos dar uma olhada em alguns dados interessantes sobre o tamanho do e-mail do botão CTA:

• A altura média do CTA é de 47,9 px
• A Apple sugere uma altura de 44 px
• O CTA médio tem 14 caracteres

Como você pode ver, a altura do botão de e-mail é importante para criar um CTA eficiente. Mas e a largura? Bem, os profissionais de marketing por e-mail optam por diferentes tamanhos de botão de e-mail com base em seus objetivos. Considere os exemplos a seguir.

O Kings Theatre tem um botão muito simples que mede 122,4 x 41,51 px:

Por outro lado, o Wizarding World opta por um CTA mais proeminente com 300 px de largura e 60 px de altura:

Idealmente, seus CTAs devem estar em harmonia com seu visual e design de e-mail para garantir que eles se destaquem sem serem excessivos.

E embora não haja uma largura e altura padrão para eles, você pode usar as descobertas do botão CTA acima como um guia para criar o seu de forma mais eficaz!

Tamanho da imagem do e-mail

Em primeiro lugar, o formato de arquivo de imagem mais popular lido pelos navegadores de e-mail inclui seu bom e velho JPG (ou JPEG), PNG e GIF . Mas e as dimensões? Bem, em termos de largura, suas imagens seguirão o tamanho do modelo definido. Portanto, se você tiver uma largura definida de 640 px, sua imagem seguirá o exemplo.

Em termos de comprimento, porém, você deve primeiro considerar o propósito da sua imagem. Se usados ​​como banners, eles devem ter entre 800-1730 px. Da mesma forma, se você usá-los como imagens de boletim informativo, deve chegar a 1200 px. No entanto, não há tamanhos padrão de imagem de e-mail que você precisa seguir.

Quando se trata de qualidade, você deve usar uma resolução de 72 dpi para aumentar o desempenho geral de seus visuais! E não se esqueça de otimizar suas imagens para telas retina (iPhones, iPads, etc.)!

Editores de e-mail como o Moosend oferecem opções adequadas para garantir que seus usuários da Apple tenham a melhor experiência em termos de qualidade de imagem.

Além das dimensões corretas, certifique-se de que suas imagens não sejam muito grandes. Você pode evitar o recorte usando ferramentas como TinyJPG ou Imagesmaller para comprimi-los. Se possível, tente manter a formatação PNG , pois é mais do que ideal para campanhas de e-mail.

Por último, mas não menos importante, lembre-se de que a maioria dos clientes de e-mail não utilizará a opção de largura total. Portanto, tenha cuidado ao criar as versões para desktop de suas mensagens como sua visualização, e o que seus assinantes veem pode ser diferente!

Melhores tamanhos de e-mail para criar seus modelos

Agora que você conhece os melhores tamanhos de modelo de email, pode criar campanhas que serão exibidas corretamente todas as vezes.

Embora você possa usar as dimensões acima como referências, não hesite em experimentá-las usando uma variedade de ferramentas de teste. Além disso, preste atenção aos seus usuários móveis e à necessidade de e-mails mais responsivos!

Com isso em mente, é hora de criar as newsletters de marketing por e-mail do melhor tamanho para o seu negócio!

E se você deseja uma ferramenta avançada para ajudá-lo, experimente o Moosend gratuitamente para criar e-mails responsivos que surpreenderão seu público!