O que são meta tags e tags Open Graph?
Meta tags são linhas curtas de HTML no <head> de uma página que descrevem a página para máquinas, e não para pessoas. Os buscadores leem o <title> e a meta description para os resultados de busca. Apps sociais e mensageiros leem as tags Open Graph (og:title, og:description, og:image) para montar o card de prévia que aparece quando alguém compartilha uma URL, e o X também lê suas próprias tags twitter:.
Um gerador de meta tags escreve tudo isso a partir de alguns campos, para você não precisar lembrar a sintaxe exata. Este também mostra como o link vai aparecer em sete plataformas e consegue verificar o HTML de uma página existente em busca de tags ausentes ou com problema.
Como gerar meta tags e conferir prévias de link
Gerar tags
- Título da página. O contador mostra os caracteres e a largura aproximada em pixels em relação ao limite de cerca de 580 px do Google no computador, com um aviso quando o título provavelmente será cortado ou está curto demais.
- Descrição. O contador avisa acima de 160 caracteres e abaixo de 70.
- URL da página (usada no link canônico e no
og:url), URL da imagem de compartilhamento (1200 x 630, https absoluta) e Texto alternativo da imagem. - Nome do site e Tipo: website, article, product, profile, video.other, music.song ou book.
- Tipo de card do X (Imagem grande ou Quadrado pequeno) e o seu @ no X.
- Cor do tema, Localidade (por exemplo
pt_BR,en_US,hi_IN) e Robots (index/noindex, follow/nofollow). - Confira as Prévias de link à direita. Use os botões para mostrar Todos ou só Google, Facebook, X, LinkedIn, WhatsApp, Slack ou iMessage.
- Clique em Copiar tags e cole o bloco no
<head>da sua página.
Verificar meu HTML
- Abra sua página publicada, veja o código-fonte (Ctrl+U, ou Cmd+Option+U no Mac), copie tudo e cole na aba Verificar meu HTML. Testar um exemplo mostra como funciona.
- Leia a pontuação ("x de y verificações aprovadas") e a lista: cada tag aparece como Encontrado, Verificar ou Ausente, com uma correção curta.
- As prévias passam a mostrar o que a página colada exibiria. Clique em Editar estas tags no gerador para carregá-las no formulário, corrigir e copiar um conjunto limpo.
Referência de meta tags: tamanhos e dimensões
| Tag | Usada por | Orientação |
|---|---|---|
<title> | Google, aba do navegador, alternativa para compartilhamentos | Cerca de 50-60 caracteres; o Google corta pela largura (cerca de 580 px no computador) |
meta name="description" | Trecho do Google, alternativa para compartilhamentos | Cerca de 120-155 caracteres; o Google pode reescrever |
link rel="canonical" | Buscadores | A única URL principal da página, absoluta |
og:title, og:description | Facebook, LinkedIn, WhatsApp, Slack, iMessage e a maioria dos apps | Iguais ao título e à descrição, a não ser que você queira uma versão específica para compartilhamento |
og:image | Todas as prévias de link | 1200 x 630 px (1.91:1), JPG ou PNG, URL https absoluta, com tamanho razoavelmente pequeno (algumas centenas de KB carregam rápido) |
og:image:alt | Leitores de tela em alguns apps | Uma descrição curta da imagem |
og:type, og:site_name, og:locale | Apps sociais | Normalmente website ou article; o nome da sua marca; por exemplo pt_BR |
twitter:card | X | summary_large_image para um card largo, summary para um quadrado pequeno |
meta name="robots" | Buscadores | Deixe como index, follow, a não ser que a página deva ficar fora da busca |
meta name="theme-color" | Navegadores de celular | Colore a barra do navegador em alguns celulares |
O bloco gerado também inclui meta charset e meta viewport, de que toda página precisa. Os limites e as regras de exibição das plataformas mudam, então trate as contagens de caracteres como orientações válidas no momento em que este texto foi escrito.
Quem precisa de um gerador de meta tags
- Sites de pequenos negócios feitos à mão ou numa hospedagem simples, em que ninguém adicionou as tags de compartilhamento e os links aparecem como URLs puras no WhatsApp.
- Blogueiros escrevendo um título e uma imagem pensados para compartilhamento em cada artigo.
- Desenvolvedores que querem um bloco de head correto e pronto para copiar numa landing page ou num projeto pessoal.
- Profissionais de marketing conferindo uma página de campanha antes de um e-mail ou anúncio sair, para a prévia não mostrar a imagem errada.
- Criadores lançando a página de um curso ou produto que querem que ela fique certa quando os fãs compartilharem nos stories do Instagram, no X ou no LinkedIn.
Dicas e erros comuns com meta tags
- Use URLs de imagem https absolutas.
/images/og.jpgouhttp://costumam falhar; o verificador aponta os dois. - Mantenha o texto importante no centro da imagem. O WhatsApp e alguns apps cortam para um quadrado ou uma miniatura menor. Faça uma com o gerador de imagem OG.
- Escreva um título e uma descrição únicos por página. Repetições pelo site deixam todos os resultados iguais.
- Coloque a palavra-chave principal no começo do título, mas escreva para pessoas; títulos entupidos de palavras-chave são reescritos.
- Não deixe o noindex ligado sem querer depois do lançamento; o verificador avisa quando encontra.
- Conte com o cache. Depois de mudar as tags, as plataformas podem mostrar a prévia antiga por um tempo. Facebook e LinkedIn têm ferramentas de depuração próprias para atualizar; as outras atualizam com o tempo.
- Confira o tamanho das descrições com o contador de caracteres quando escrever várias de uma vez.
Gerador vs depuradores das plataformas e plugins de CMS
O Depurador de Compartilhamento do Facebook, o Post Inspector do LinkedIn e ferramentas parecidas buscam sua página publicada e mostram exatamente o que aquela plataforma vê, e podem atualizar o cache dela. Use-os depois de publicar. Eles só cobrem a própria plataforma e precisam que a página esteja on-line.
Plugins de SEO para WordPress e outros CMSs escrevem essas tags automaticamente, o que é a melhor opção se você usa esses sistemas. Este gerador fica no meio: funciona antes de a página ir ao ar, mostra sete prévias lado a lado e entrega HTML puro para qualquer site, incluindo páginas feitas à mão e hospedagens estáticas.
Como funciona: nada é buscado nem enviado
As tags e as prévias são montadas no seu navegador. O verificador analisa o HTML que você cola e nunca acessa o seu site, então também funciona com páginas de homologação protegidas por login. Nada é enviado ao Biolinko. A única requisição externa é a própria imagem de compartilhamento, que o seu navegador carrega da URL que você informa para mostrá-la nas prévias.
Prévias de link e o seu link na bio
A URL do seu link na bio provavelmente é o link que você mais compartilha, em bios, DMs, assinaturas de e-mail e no WhatsApp. Uma página do Biolinko como biolinko.me/yourname define o próprio título, descrição e imagem de compartilhamento a partir do seu perfil, então gera uma prévia limpa em todo lugar sem você editar nenhum código. Veja link na bio para pequenos negócios ou crie sua página grátis.
Atualizado em 8 de outubro de 2026