Afegeix les etiquetes bàsiques d'Open Graph

Què comprova aquesta auditoria

Escaneja el <head> de la pàgina per buscar quatre etiquetes meta: og:title, og:description, og:image i og:url. Aquestes són les propietats Open Graph mínimes que cada plataforma social, de missatgeria i de xat important llegeix quan algú enganxa el teu enllaç.

Per què importa

Quan les etiquetes falten, la previsualització de l’enllaç a Facebook, LinkedIn, X, Slack, Discord, iMessage, WhatsApp i Telegram cau a una URL nua amb potser un títol de pàgina escrapejat: sense imatge de previsualització, sense descripció. El clic en una targeta sense previsualització és una fracció del d’una targeta amb una imatge de 1200×630.

Open Graph també són les dades que Google utilitza per al panell “Sobre aquest resultat” i per a les targetes de citació de l’AI search. Una pàgina sense etiquetes OG apareix com un enllaç pla mentre que els competidors apareixen com a targetes completes.

Com solucionar-ho

Posa les quatre etiquetes al <head> de cada pàgina pública. Els valors poden reflectir el teu <title> i meta description, però haurien d’estar afinats per a ús social: una mica més atractius per al clic, amb una imatge escollida a mà.

<head>
  <meta property="og:title" content="Auditoria SEO gratuïta en 60 segons, MetricSpot">
  <meta property="og:description" content="Mira el que veuen els agents d'IA i Google al teu lloc. 91 comprovacions, sense registre.">
  <meta property="og:image" content="https://metricspot.com/og/home.png">
  <meta property="og:url" content="https://metricspot.com/">
  <meta property="og:type" content="website">
</head>

Astro / Next.js, genera els valors per pàgina des del frontmatter:

---
const { title, description, ogImage } = Astro.props;
const url = Astro.url.href;
---
<meta property="og:title" content={title} />
<meta property="og:description" content={description} />
<meta property="og:image" content={new URL(ogImage, Astro.site).href} />
<meta property="og:url" content={url} />

WordPress, Yoast SEO, Rank Math i SEOPress emeten aquestes etiquetes automàticament. Obre’n un, configura els valors socials per defecte a SEO → Social i sobreescriu-los per entrada quan calgui.

Regles d’imatge. PNG o JPG, ≥1200×630 (1.91:1), menys de 5 MB. Consulta la pàgina dedicada imatge Open Graph per al detall de mida/format.

Prova-ho abans de publicar: enganxa l’URL al Sharing Debugger de Facebook i al Post Inspector de LinkedIn, i clica “Scrape Again” per buidar la memòria cau.

Preguntes freqüents

Necessito tant etiquetes Open Graph com Twitter Card?

X (abans Twitter) cau a Open Graph si no hi ha etiquetes twitter:, així que només OG cobreix la major part de la superfície. Afegeix etiquetes Twitter Card només si vols una imatge o resum diferent a X: consulta Twitter Cards.

I si la meva pàgina ja té `<title>` i meta description?

Els cercadors llegeixen <title> i <meta name="description">. Les plataformes socials llegeixen og:title i og:description. Són camps separats amb intencions diferents (snippets de cerca vs. previsualitzacions per compartir), així que duplica’ls en lloc de saltar-te les versions OG.

Per què la meva previsualització segueix sortint malament després d’afegir les etiquetes?

Facebook, LinkedIn i Slack guarden les previsualitzacions escrapejades a la cau de manera agressiva, de vegades durant setmanes. Passa l’URL pel debugger de la plataforma i clica el botó “Re-scrape”. Els teus canvis no apareixeran fins que la cau es buidi.