Open Graph y Twitter Cards: cómo se ve tu enlace al compartirlo o citarlo
Pega un enlace en un chat, en una publicación social o en una respuesta de IA y aparece una pequeña tarjeta de vista previa: un título, una breve descripción, una imagen. Esa tarjeta no se adivina; la controlan las etiquetas Open Graph y Twitter Card del <head> de tu página. Si las pones bien, tu enlace se ve cuidado y con ganas de hacer clic. Si las omites, obtienes una vista previa en blanco o rota.
Las etiquetas que importan
<meta property="og:title" content="El título de tu página">
<meta property="og:description" content="Un resumen de una línea.">
<meta property="og:image" content="https://example.com/preview.png">
<meta property="og:url" content="https://example.com/pagina">
<meta name="twitter:card" content="summary_large_image">
- og:title / og:description: el titular y el resumen de la tarjeta.
- og:image: la imagen de vista previa. Un tamaño de 1200×630 es el seguro para la tarjeta grande.
- og:url: la dirección canónica de la página.
- twitter:card:
summary_large_imageda el diseño con imagen grande;summary, el pequeño.
Por qué importa para el GEO
Esto va de cómo se presenta tu página cuando viaja. Tanto si la comparte una persona como si una IA la muestra con una vista previa, estas etiquetas deciden cómo se representa: un título y una imagen claros consiguen más clics y hacen que tu fuente parezca creíble. No cambian si la IA puede leer tu página (de eso se encargan los otros pasos), pero dan forma a cómo aparece cuando se la cita.
En resumen
Añade og:title, og:description, una og:image de 1200×630, og:url y una twitter:card a tu <head>. Es un bloque que se pone una sola vez y hace que cada vez que comparten o citan tu página se vea intencionada: el complemento de presentación de los pasos para «ser comprensible» de nuestra introducción al GEO.
Prueba nuestra herramienta gratuita: Vista previa de OGP y metaetiquetas →