Quando você cola um link em uma mensagem, um tweet, uma publicação no LinkedIn ou um canal do Slack, a plataforma monta um cartão de pré-visualização — uma imagem grande, um título, um trecho. Essa imagem é a imagem Open Graph (OG), e ela trabalha mais do que o seu título. Em um feed que rola rápido, é a imagem que faz o polegar parar. Uma pré-visualização em branco ou quebrada passa a impressão de desleixo e é ignorada.
Veja como criar uma que conquista o clique, no tamanho certo e com um texto que dá para ler de verdade.
O tamanho: 1200×630
A imagem OG padrão tem 1200×630 pixels, uma proporção de 1.91:1. Facebook, LinkedIn, Slack, Discord e a maioria dos sistemas de pré-visualização de link são feitos em torno dela. Acerte esse tamanho e você está coberto em quase todo lugar.
Alguns tamanhos relacionados aparecem dependendo de onde o link cai:
| Plataforma / uso | Tamanho | Proporção |
|---|---|---|
| Open Graph (padrão) | 1200×630 | 1.91:1 |
| Twitter/X card grande | 1200×628 | ~1.91:1 |
| Miniatura do YouTube | 1280×720 | 16:9 |
| Quadrado (feeds/IG) | 1080×1080 | 1:1 |
| Story / vertical | 1080×1920 | 9:16 |
Você não precisa de todos esses para uma publicação de blog — 1200×630 é o cavalo de batalha. Mas se também estiver criando uma miniatura de vídeo ou uma publicação social quadrada, ajuda gerar o formato certo em vez de recortar mal uma imagem para encaixar.
Regras de texto: legível no tamanho de miniatura
O erro que arruína imagens OG é tratá-las como um cartaz que você vai ver em tela cheia. Não vai. A maioria das pessoas vê o cartão a talvez um terço do tamanho real, no celular, no meio da rolagem. Projete para isso.
- Texto grande, poucas palavras. Um título curto — de cinco a oito palavras — que seja legível quando o cartão encolhe. Se você precisa apertar os olhos em tamanho cheio, ele é ilegível no feed.
- Contraste forte. Texto claro sobre fundo escuro ou saturado, ou o contrário. Texto sobre uma foto cheia de detalhes, sem um fundo de apoio, some.
- Mantenha o essencial centralizado. Plataformas diferentes recortam as bordas de maneiras ligeiramente diferentes. Deixe texto e logos longe das margens externas para nada ser cortado.
- Uma ideia por imagem. A imagem OG é uma isca, não um resumo. Título, talvez um subtítulo, pronto.
Fundos que fazem o texto saltar
Um gradiente liso é a escolha confiável. Ele dá ao texto uma base limpa para se apoiar, tem aparência moderna e nunca briga com as palavras como faz uma foto cheia de detalhes. Um gradiente de escuro para um pouco mais escuro, com texto claro, é praticamente à prova de falhas.
A ferramenta de Imagem OG foi construída exatamente em torno disso: escolha um tamanho predefinido (OG 1200×630, Twitter, YouTube, quadrado ou story), escolha um fundo em gradiente e adicione seu título e subtítulo. Você obtém um cartão de compartilhamento que se lê com clareza em qualquer tamanho, sem abrir um aplicativo de design completo.
O HTML que faz a imagem aparecer
Criar a imagem é metade do trabalho. A plataforma precisa saber onde encontrá-la. Adicione estas tags ao <head> da sua página:
<meta property="og:image" content="https://seusite.com/og.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:title" content="Seu título">
<meta property="og:description" content="Uma frase clara.">
<meta name="twitter:card" content="summary_large_image">
A linha twitter:card definida como summary_large_image é o que garante o cartão grande no X em vez de uma miniatura minúscula. URLs absolutas (com https://) importam — caminhos relativos costumam falhar ao resolver quando um rastreador busca sua página.
Depois de publicar, teste. Cole sua URL no depurador de pré-visualização de link de alguma plataforma (Sharing Debugger do Facebook, Post Inspector do LinkedIn) para confirmar que a imagem carrega e para limpar qualquer versão antiga em cache. As plataformas guardam pré-visualizações em cache de forma agressiva, então se você atualizou a imagem e ainda vê a antiga, o botão de re-rastrear do depurador é a solução.
Crie, não faça upload
Tudo roda no seu navegador — a imagem é composta com Canvas localmente e nunca é enviada a um servidor. É gratuito, sem cadastro, sem marca d'água estampada no seu cartão de compartilhamento, e funciona offline após a primeira visita. Gere a 1200×630, configure as meta tags, passe uma vez por um depurador, e seus links começam a cumprir seu papel.