# Branding de newsletter: cabeçalhos, cartões sociais e edições [Canonical HTML page](https://gradiently.design/pt-pt/guide/newsletter-branding) Uma caixa de entrada é uma lista de nomes e assuntos até alguém te abrir. Depois tens o tempo de atenção de um cabeçalho para provar que esta é a newsletter em que se inscreveram. ## The short version - O branding de newsletter é um nome, um cabeçalho, uma paleta e uma tipografia consistentes no próprio email, no arquivo web e nos cartões que partilhas para promover cada edição. - Um cabeçalho de email costuma desenhar-se com 1200×600 píxeis e mostrar-se com cerca de 600 píxeis de largura, por isso as palavras devem ser grandes e poucas. - Um cabeçalho de publicação do Substack tem 1456×816 píxeis e é também a imagem de pré-visualização quando uma edição é partilhada. - O sistema de cabeçalho mais fiável mantém o nome e a composição fixos e muda uma só coisa por edição, como o número da edição, um título ou uma cor sazonal. - Cada edição merece dois ou três cartões de promoção em tamanhos sociais, feitos com a mesma composição para poderem ser criados em minutos. O **branding de newsletter** é o que faz um leitor reconhecer a tua edição antes de a ler: o mesmo cabeçalho no topo de cada email, uma paleta e um tipo de letra que passam para o arquivo web e cartões nas redes sociais que parecem vir da mesma publicação. Desenha o cabeçalho do email com 1200×600 píxeis e o cabeçalho de publicação do Substack com 1456×816, e mantém uma composição fixa em que só mudam os detalhes da edição. Os leitores voltam a publicações que parecem estáveis, e um visual estável torna também cada edição mais rápida de produzir. ## Tamanhos de imagem para newsletters | Elemento | Tamanho | Notas | | --- | --- | --- | | Cabeçalho de email | 1200×600 px | Mostrado com cerca de 600 px de largura na maioria das caixas de entrada | | Cabeçalho de publicação do Substack | 1456×816 px | É também a pré-visualização de partilha da edição | | Pré-visualização de ligação (Open Graph) | 1200×630 px | Para um arquivo alojado por ti ou uma página de destino | | Imagem de história do Medium | 1400×788 px | Se publicares em vários sítios | | Publicação no X | 1600×900 px | Cartão de promoção de cada edição | | Retrato no Instagram e LinkedIn | 1080×1350 px | Cartão de promoção e cartões de citação | | Assinatura de email | 600×200 px | Um pequeno banner com ligação à inscrição | Desenha o cabeçalho com o dobro da largura de exibição para continuar nítido em ecrãs de alta densidade. - Cabeçalho de email 1200×600: 1200 × 600 - Cabeçalho Substack 1456×816: 1456 × 816 - Cartão de promoção 1080×1350: 1080 × 1350 - Cartão X 1600×900: 1600 × 900 Quatro formas, uma publicação. O cabeçalho de email é o mais largo e mais baixo, por isso leva menos texto. Os tamanhos de cada plataforma, com mais detalhe, estão em [tamanho do cabeçalho do Substack](https://gradiently.design/pt-pt/guide/substack-header-size) e [design de cabeçalho de email](https://gradiently.design/pt-pt/guide/email-header-design). Se também publicas no LinkedIn, a capa da sua newsletter segue regras próprias, tratadas em [capa de newsletter do LinkedIn](https://gradiently.design/pt-pt/guide/linkedin-newsletter-cover). ## Desenha um cabeçalho que aguente todas as edições O cabeçalho (masthead) é o topo fixo da tua newsletter: o nome, talvez uma linha curta sobre o que é e os detalhes da edição. As revistas impressas usam a ideia há mais de um século porque funciona. Os leitores encontram o nome sempre no mesmo sítio e o conteúdo por baixo pode mudar à vontade. Um cabeçalho largo de newsletter por email com A Cozinha Lenta, Edição 48, Domingo, e uma breve descrição Um cabeçalho de email: o nome grande, edição e dia pequenos por cima, uma promessa numa linha por baixo. 1. **Fixa o nome e a sua posição** O mesmo tipo de letra, o mesmo tamanho, o mesmo sítio em todas as edições. É a parte que os leitores aprendem. 2. **Escolhe o que muda** Escolhe uma variável: o número da edição, a data, um título ou uma cor sazonal. Uma chega. 3. **Mantém o texto longe das margens** Algumas aplicações de email cortam ou redimensionam os cabeçalhos. Mantém as palavras nos 80 por cento centrais. 4. **Escreve um texto alternativo a sério** Alguns leitores têm as imagens desativadas por predefinição. Um texto alternativo como “A Cozinha Lenta, edição 48” mantém o cabeçalho a funcionar sem a imagem. Se mudares uma só coisa por edição, escolhe algo com significado. Uma carta de culinária semanal pode mudar de cor com as estações; uma carta de finanças mensal pode pôr no cabeçalho o número mais importante do mês. - Edições de primavera: `linear-gradient(120deg, #fef3c7 0%, #a7f3d0 100%)` - Edições de verão: `linear-gradient(120deg, #fde68a 0%, #fb923c 100%)` - Edições de outono: `linear-gradient(120deg, #fed7aa 0%, #9a3412 100%)` - Edições de inverno: `linear-gradient(120deg, #e0e7ff 0%, #475569 100%)` Quatro fundos sazonais atrás de um cabeçalho fixo. Os leitores sentem o ano a avançar enquanto a publicação continua a mesma. ## Uma paleta e uma tipografia que se leem na caixa de entrada A maior parte de uma newsletter é texto, por isso a tipografia importa mais do que o cabeçalho. Usa um tipo de letra de corpo legível, um tipo de título distinto para o nome e uma cor de destaque para ligações e botões. Mantém o texto corrido escuro sobre claro: muitos leitores usam o modo escuro e as aplicações de email invertem as cores de formas que não controlas totalmente. - Papel: #fbf7f0 - Tinta: #1f1a17 - Título ferrugem: #7c2d12 - Ligação âmbar: #d97706 - Divisória: #e7dccb Uma paleta editorial quente. Papel e Tinta tratam da leitura; o ferrugem é para o nome, o âmbar só para ligações. ### Parte-se nas caixas de entrada - Palavras importantes embutidas numa imagem sem texto alternativo - Texto corrido cinzento claro e fino - Um cabeçalho só de texto e sem espaço para respirar - Imagens de fundo atrás do texto corrido ### Sobrevive nas caixas de entrada - Texto real para tudo o que importa - Texto corrido com forte contraste nos modos claro e escuro - Um cabeçalho com um nome claro e espaço à volta - Gradientes só na imagem do cabeçalho Os clientes de email são rigorosos com o CSS, por isso os gradientes pertencem à imagem do cabeçalho e não ao código. [Gradientes em email](https://gradiently.design/pt-pt/guide/gradients-in-email) explica que abordagens sobrevivem em que aplicações. ## Cartões de promoção para cada edição A maioria das newsletters cresce com partilhas e publicações sociais, e uma ligação simples com uma pré-visualização genérica é ignorada. Faz dois ou três cartões por edição a partir de um modelo fixo: um com o título da edição, um com uma frase tirada de dentro dela e um cartão de inscrição que reutilizas. Um cartão de promoção vertical com Porque é que o teu pão sabe a pouco, A Cozinha Lenta número 48 O cartão da edição para Instagram e LinkedIn: título, número da edição e onde ler. Um cartão de citação horizontal com O sal é um problema de tempo, da edição desta semana Uma frase destacada para X e Bluesky. Curta, específica e um pouco surpreendente funciona melhor. - **Cartão da edição:** o título e o número, publicado no dia em que sai. - **Cartão de citação:** uma frase de dentro, publicada um ou dois dias depois. Vê [design de cartões de citação](https://gradiently.design/pt-pt/guide/quote-card-design). - **Cartão de inscrição:** o que os leitores recebem e com que frequência, fixado no teu perfil. - **Cartão de marco:** a edição 50, 100 ou um ano de envios. Se escreves semanalmente, é a parte que vale a pena automatizar. No Gradiently Pro podes manter uma lista de edições numa folha de cálculo e criar em massa um cartão para cada linha, ou desenhar um cartão e redimensioná-lo para todos os formatos num só passo. A tinta automática escolhe texto claro ou escuro para cada linha a partir das cores do próprio fundo, por isso um título continua legível seja qual for a cor da estação. [Escrever texto para visuais](https://gradiently.design/pt-pt/guide/writing-copy-for-visuals) ajuda com as próprias palavras. ## Faz um visual só teu As plataformas de newsletters dão a toda a gente o mesmo punhado de temas, por isso um cabeçalho distintivo é um dos poucos sítios onde te podes distinguir. Um Mark do Gradiently é um fundo vivo com que mais ninguém pode exportar depois de o teres reivindicado, o que serve a uma publicação que quer o seu cabeçalho inconfundível à medida que cresce. ## FAQ ### Que tamanho deve ter o cabeçalho de uma newsletter por email? Desenha-o com 1200×600 píxeis. A maioria das caixas de entrada mostra-o com cerca de 600 píxeis de largura, e o ficheiro maior mantém-no nítido em ecrãs de alta densidade. ### Que tamanho tem a imagem de cabeçalho do Substack? O cabeçalho de uma publicação do Substack tem 1456×816 píxeis. É também a imagem de pré-visualização quando a publicação é partilhada. ### Como faço a minha newsletter parecer profissional? Mantém um cabeçalho com o teu nome no mesmo sítio em cada edição, usa um tipo de título e um tipo de corpo legível, e limita a cor a um único destaque para as ligações. ### Devo mudar o cabeçalho da newsletter a cada edição? Mantém o nome e a composição fixos e muda apenas um elemento, como o número da edição, o título ou uma cor sazonal. Os leitores reconhecem a parte fixa. ### Os gradientes funcionam em newsletters por email? Põe os gradientes na imagem do cabeçalho e não em CSS, porque muitas aplicações de email ignoram gradientes CSS. Mantém o texto corrido como texto real com forte contraste.