# Layout de texto para posts sociais: título, detalhe e ação

[Canonical HTML page](https://gradiently.design/pt-pt/guide/text-hierarchy-social)

A maioria dos posts que parecem carregados tem as palavras certas na ordem errada e nos tamanhos errados. Três níveis, algumas regras de colocação e um telemóvel à distância de um braço resolvem quase todos.

## The short version

- Um layout de texto claro para posts de redes sociais tem três níveis: um título, uma linha de detalhe e uma chamada para ação.
- Num post com 1080 píxeis de largura, um título de 90 a 140 px, uma linha de detalhe de 48 a 64 px e uma chamada para ação de cerca de 40 px leem-se bem num telemóvel.
- Cada nível deve ser claramente menor do que o de cima, mais ou menos metade a dois terços do tamanho, para a ordem ser óbvia de relance.
- Mantém o título em cerca de oito palavras e põe-no onde o olhar aterra primeiro, normalmente o terço superior ou central.
- A chamada para ação é o texto mais discreto do post, porque a legenda e os botões da própria plataforma já convidam ao passo seguinte.

O melhor **layout de texto para posts de redes sociais** usa três níveis e não mais: um **título** que diz a única coisa, uma linha de **detalhe** que responde à pergunta óbvia seguinte e uma pequena **chamada para ação** que diz o que fazer a seguir. Cada nível é claramente menor do que o de cima e fica num sítio previsível. Quem faz scroll dá a um post um instante, e três níveis é mais ou menos o que um instante aguenta.

## Exemplo: hierarquizar as palavras de um post

Uma florista quer anunciar as encomendas para o Dia da Mãe. O primeiro rascunho tem tudo num tamanho parecido: o nome da loja, “O Dia da Mãe está a chegar”, “Encomenda ramos online já”, “Entregas em toda a cidade”, “Encomenda até quinta” e o endereço do site. Seis linhas a competir significa que nada é lido.

Hierarquizado, fica assim: título *Encomenda até quinta.* (aquilo em que as pessoas têm de agir), detalhe *Ramos atados à mão, entregues no domingo* (o quê e quando), chamada para ação *Link na bio* (onde). O nome da loja passa para uma pequena etiqueta ou desaparece, porque o perfil já o mostra.

Um post de florista em que o nome da loja, um anúncio e vários detalhes competem em tamanhos parecidos

Antes: todas as linhas lutam pela atenção e o prazo fica enterrado.

O mesmo post da florista com um título grande a dizer Encomenda até quinta e uma linha mais pequena sobre a entrega ao domingo

Depois: um título, uma linha de detalhe e a chamada para ação deixada à legenda.

## Tamanhos de letra para título, detalhe e chamada para ação

Os tamanhos abaixo são para qualquer post com 1080 píxeis de largura, o que cobre os formatos vertical, quadrado e story do Instagram. A regra por baixo é mais útil do que os números: cada nível deve ter cerca de metade a dois terços do tamanho do de cima, ou o olhar não os distingue.

| Nível | Função | Tamanho a 1080 px de largura | Comprimento |
| --- | --- | --- | --- |
| Pré-título (opcional) | Contexto: uma categoria, data ou nome de série | 28 a 32 px, maiúsculas, espaçado | Uma a quatro palavras |
| Título | A única coisa que queres que fique na memória | 90 a 140 px, negrito ou seminegrito | Até cerca de oito palavras |
| Detalhe | O seguimento: quando, onde, quanto, para quem | 48 a 64 px, normal | Uma linha, duas no máximo |
| Chamada para ação | O passo seguinte | 40 a 44 px, médio | Duas a quatro palavras |

O pré-título é um quarto nível de bónus. Usa-o para contexto, nunca para um segundo título.

O peso ajuda tanto como o tamanho. Um título a negrito e uma linha de detalhe normal separam-se bem mesmo quando os tamanhos estão mais próximos do que gostarias. Mais sobre tamanhos para telemóveis em [tamanho de letra para redes sociais](https://gradiently.design/pt-pt/guide/font-size-for-social-media), e a teoria geral em [hierarquia visual](https://gradiently.design/pt-pt/guide/visual-hierarchy).

## Onde colocar cada nível

As pessoas leem um post como leem uma página: de cima para baixo, do início ao fim da linha. Por isso o título vai no alto ou no meio, o detalhe fica logo por baixo e a chamada para ação vai no fim, perto da base. Mantém os três juntos como um só grupo; espalhá-los pelos cantos obriga o olhar a procurar.

- Post vertical 1080×1350: 1080 × 1350
- Post quadrado 1080×1080: 1080 × 1080
- Story 1080×1920: 1080 × 1920
- Post de LinkedIn 1200×1200: 1200 × 1200

Quatro formatos comuns. No story, mantém os três níveis entre cerca de 250 px do topo e 250 px da base, onde fica a interface.

- **Vertical 1080×1350**: título no terço superior ou centrado, detalhe por baixo, chamada para ação perto da base com uma margem de pelo menos 80 px.
- **Quadrado 1080×1080**: centra o grupo ou alinha-o a um lado; a grelha do perfil mostra uma pré-visualização cortada de cada post, por isso mantém o título longe das margens superior e inferior.
- **Story 1080×1920**: título logo abaixo da linha de segurança superior, chamada para ação acima do campo de resposta. [Zonas de segurança das redes sociais](https://gradiently.design/pt-pt/guide/social-media-safe-zones) tem o mapa.
- **Primeiro slide de carrossel**: só o título, mais uma pequena seta ou a indicação “Desliza”. Os detalhes vão para o slide dois; [design de carrosséis do Instagram](https://gradiently.design/pt-pt/guide/instagram-carousel-design) cobre o resto.

## Erros comuns de layout de texto em posts de redes sociais

### Evitar

- Título e detalhe quase com o mesmo tamanho
- O nome da marca como texto maior
- Uma chamada para ação mais forte do que o título
- Texto empurrado para os cantos e margens
- Cinco ou mais linhas de texto corrido num slide
- Centrar parágrafos longos

### Fazer

- Uma descida clara de tamanho entre níveis
- A mensagem como texto maior; o logótipo pequeno
- Uma chamada para ação discreta, perto do detalhe
- Margens generosas, de 80 a 100 px
- Conteúdo longo repartido por slides de carrossel
- Texto alinhado à esquerda quando passa de duas linhas

A chamada para ação merece uma palavra. No Instagram, a legenda e os botões de gosto, comentário e partilha ficam mesmo debaixo da imagem, e “link na bio” é entendido por todos. Por isso a chamada para ação na própria imagem pode ser pequena. Só a faças forte quando a ação é todo o objetivo, como o prazo de uns saldos.

## Como compor o texto de um post social em cinco passos

1. **Escreve tudo e depois hierarquiza** Põe primeiro a única coisa. Tudo o resto é o detalhe, a chamada para ação ou a legenda.
2. **Corta o título para oito palavras ou menos** Se não cabe a 90 px em três linhas, é demasiado longo. Um [tipo de letra de títulos](https://gradiently.design/pt-pt/guide/headline-fonts) robusto faz uma linha curta acertar mais.
3. **Define os tamanhos como degraus** Título, depois cerca de metade para o detalhe, depois menor outra vez para a chamada para ação.
4. **Agrupa e coloca** Empilha os três níveis juntos com espaçamento coerente, alinhados a uma borda ou ao centro.
5. **Testa ao tamanho do telemóvel** Afasta a tela até o post ter a largura de um telemóvel à distância de um braço. Se a ordem não for óbvia, aumenta os degraus.

Um post vertical de saldos com 40% de desconto em letra muito grande, um pequeno pré-título a dizer Só este fim de semana e uma linha de detalhe sobre velas

Quando o número é a notícia, passa a ser o título e as palavras passam a ser o detalhe.

## Manter todos os níveis legíveis num fundo carregado

A hierarquia só funciona se os três níveis se puderem ler. O título costuma estar bem porque é grande; o detalhe e a chamada para ação é que falham no contraste, sobretudo sobre um gradiente ou uma foto. Coloca o grupo sobre a zona mais calma e verifica primeiro a linha mais pequena. [Texto sobre um gradiente](https://gradiently.design/pt-pt/guide/text-on-gradient) entra nas técnicas.

No Gradiently, o Mark por trás de um design sabe onde estão as palavras. A sua zona mais calma move-se para trás do texto e a tinta automática escolhe letra clara ou escura para cada linha, por isso uma pequena chamada para ação continua tão legível como o título. Define a hierarquia uma vez e depois faz uma versão para story ou LinkedIn a partir do mesmo design em vez de o refazeres.

## FAQ

### Quanto texto deve ter um post de Instagram?

Um título de até cerca de oito palavras e uma linha de detalhe é o ideal. As explicações mais longas pertencem à legenda ou a slides extra de carrossel.

### Que tamanho de letra deve ter um título num post de redes sociais?

Num post com 1080 píxeis de largura, 90 a 140 px para o título, 48 a 64 px para uma linha de detalhe e cerca de 40 px para uma chamada para ação.

### Onde deve ficar a chamada para ação num post social?

Perto da base, junto à linha de detalhe e dentro da área segura. Num story, mantém-na acima do campo de resposta.

### O texto dos posts sociais deve ser centrado ou alinhado à esquerda?

Centra os títulos curtos de uma a três linhas. Alinha à esquerda tudo o que for mais longo, porque linhas centradas irregulares são mais difíceis de ler.