Voltar à Implementação de Schema

Meta Tags e Open Graph

Guia técnico completo para otimização de pesquisa IA

O Que São Meta Tags?

Meta tags são fragmentos de código no seu HTML que descrevem o conteúdo da sua página. São invisíveis para visitantes mas visíveis para motores de pesquisa e plataformas IA. Pense nelas como etiquetas que explicam do que a sua página trata.

Para otimização GEO, meta tags ajudam os motores IA a compreender o contexto do seu conteúdo, propósito e como exibi-lo quando partilhado. Meta tags adequadas melhoram a descoberta e apresentação do seu conteúdo.

Meta Tags Essenciais

Meta Description

Um resumo breve do conteúdo da sua página. Aparece em resultados de pesquisa e respostas de motores IA. 150-160 caracteres é ideal.

<meta name="description" content="Learn how to optimize your website for AI search engines with Bloffee's complete GEO optimization platform. Improve your content for ChatGPT, Claude, and other AI tools." />

Melhores Práticas: Escreva descrições únicas para cada página. Inclua palavras-chave primárias naturalmente. Torne-a convincente e precisa.

Title Tag

O título da sua página aparece em separadores de navegador, resultados de pesquisa e quando partilhado. 50-60 caracteres recomendados. Inclua a sua marca e palavra-chave principal.

<title>Complete Guide to Meta Tags & Open Graph</title>

URL Canonical

Informa motores de pesquisa da versão preferida da sua página. Previne problemas de conteúdo duplicado. Essencial para GEO.

<link rel="canonical" href="https://geo-score.online/learn/technical/meta-tags-complete" />

Robots Meta Tag

Controla como motores de pesquisa e bots IA interagem com a sua página. Use "index, follow" para permitir acesso completo.

<meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1" />

Tags Open Graph

Tags Open Graph controlam como o seu conteúdo aparece quando partilhado em redes sociais. Originalmente criado pelo Facebook, agora usado por muitas plataformas incluindo ferramentas IA.

Exemplo Completo de Open Graph

<meta property="og:title" content="Complete Guide to Meta Tags" /> <meta property="og:description" content="Master meta tags and Open Graph for GEO optimization." /> <meta property="og:type" content="article" /> <meta property="og:url" content="https://geo-score.online/learn/technical/meta-tags-complete" /> <meta property="og:image" content="https://geo-score.online/images/meta-tags-guide.jpg" /> <meta property="og:image:width" content="1200" /> <meta property="og:image:height" content="630" /> <meta property="og:site_name" content="Bloffee" /> <meta property="og:locale" content="en_US" /> <meta property="article:published_time" content="2025-01-10T00:00:00.000Z" /> <meta property="article:modified_time" content="2025-01-10T12:00:00.000Z" /> <meta property="article:author" content="Bloffee" />

Requisitos de Imagem Open Graph

A sua og:image é crucial. Aparece quando o conteúdo é partilhado. Siga estas especificações:

  • Tamanho recomendado: 1200 x 630 pixels
  • Tamanho mínimo: 600 x 314 pixels
  • Tamanho máximo de ficheiro: 8 MB
  • Formato: JPG ou PNG
  • Proporção: 1.91:1

Tags Twitter Card

Twitter Cards funcionam de forma similar ao Open Graph mas são específicos do Twitter/X. Melhoram como os seus links aparecem na plataforma.

Exemplo de Twitter Card

<meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:site" content="@bloffee" /> <meta name="twitter:creator" content="@bloffee" /> <meta name="twitter:title" content="Complete Guide to Meta Tags" /> <meta name="twitter:description" content="Master meta tags and Open Graph for GEO." /> <meta name="twitter:image" content="https://geo-score.online/images/meta-tags-guide.jpg" />

Tipos de Twitter Card

  • summary: Miniatura de imagem quadrada pequena
  • summary_large_image: Imagem banner grande (recomendado)
  • app: Para promoções de apps móveis
  • player: Para conteúdo de vídeo/áudio

Meta Tags Avançadas para GEO

Informação de Autor

Ajude os motores IA a compreender autoria e autoridade do conteúdo.

<meta name="author" content="Bloffee Team" /> <link rel="author" href="https://geo-score.online/about" />

Idioma e Localização

Especifique idioma do conteúdo para sites internacionais.

<html lang="en"> <meta property="og:locale" content="en_US" /> <meta property="og:locale:alternate" content="nl_NL" /> <meta property="og:locale:alternate" content="fr_FR" />

Charset e Viewport

Tags técnicas essenciais para renderização adequada.

<meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />

Modelo Completo de Meta Tags

Use este modelo como ponto de partida para todas as suas páginas:

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- Primary Meta Tags --> <title>Your Page Title | Brand Name</title> <meta name="title" content="Your Page Title | Brand Name"> <meta name="description" content="Clear description of your page content in 150-160 characters."> <meta name="author" content="Your Name or Company"> <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1"> <link rel="canonical" href="https://yoursite.com/page-url"> <!-- Open Graph / Facebook --> <meta property="og:type" content="article"> <meta property="og:url" content="https://yoursite.com/page-url"> <meta property="og:title" content="Your Page Title"> <meta property="og:description" content="Clear description for social sharing."> <meta property="og:image" content="https://yoursite.com/image.jpg"> <meta property="og:image:width" content="1200"> <meta property="og:image:height" content="630"> <meta property="og:site_name" content="Your Brand"> <meta property="og:locale" content="en_US"> <!-- Twitter --> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:url" content="https://yoursite.com/page-url"> <meta name="twitter:title" content="Your Page Title"> <meta name="twitter:description" content="Clear description for Twitter."> <meta name="twitter:image" content="https://yoursite.com/image.jpg"> </head> <body> <!-- Your content --> </body> </html>

Testar as Suas Meta Tags

Sempre teste meta tags antes de publicar:

Facebook Sharing Debugger

Teste tags Open Graph: developers.facebook.com/tools/debug/

Twitter Card Validator

Teste Twitter Cards: cards-dev.twitter.com/validator

LinkedIn Post Inspector

Teste partilha LinkedIn: linkedin.com/post-inspector/

Dicas Rápidas de Meta Tags

  • Escreva meta descriptions únicas para cada página
  • Mantenha títulos com menos de 60 caracteres
  • Use imagens de alta qualidade para og:image (1200x630px)
  • Sempre inclua URLs canonical
  • Teste com ferramentas de debugging antes de publicar
  • Atualize og:image quando redesenhar ou fazer rebranding

Recursos Relacionados

Guia Completo de Meta Tags e Open Graph para Pesquisa IA