Qué es
og:image es una etiqueta meta, <meta property="og:image" content="https://tudominio.com/imagen.jpg">, que indica a las redes sociales y apps de mensajería exactamente qué imagen mostrar en la tarjeta de vista previa cuando se comparte el enlace de tu página. A diferencia de las etiquetas de título y descripción, aquí normalmente no hay ningún respaldo automático en el que valga la pena confiar — sin esta etiqueta, la mayoría de las plataformas simplemente muestran una vista previa de texto plano sin ninguna imagen, lo cual destaca como notablemente menos atractivo junto a otros enlaces compartidos que sí tienen una.
La imagen debe indicarse con su dirección web completa y directa (no una ruta relativa), y estar alojada en una ubicación de acceso público sin necesidad de iniciar sesión.
En qué afecta
Un enlace compartido con una vista previa visual recibe notablemente más atención y clics que uno que aparece como texto sin más, simplemente porque ocupa más espacio visual y se percibe como más sustancial en un feed social o un hilo de chat lleno de contenido. Esto es cierto en prácticamente todas las plataformas que generan vistas previas de enlaces — la imagen suele ser el elemento visual más grande de toda la tarjeta de vista previa.
Una og:image ausente es también uno de los huecos más habituales al compartir en redes, precisamente porque es fácil configurar las etiquetas de título y descripción (que son solo texto) y olvidar que la imagen necesita su propia etiqueta, correctamente formateada y por separado.
Cómo solucionarlo
- Elige una imagen que represente bien la página, con una proporción amplia, más o menos horizontal (1200×630 píxeles es un tamaño habitualmente recomendado).
- Sube la imagen a algún lugar de tu propia web para que tenga una dirección web estable y directa.
- Añade
<meta property="og:image" content="https://tudominio.com/ruta/a/imagen.jpg">a la sección<head>de la página, usando la dirección completa, no una relativa. - Si usas un creador de webs, busca un campo para subir una "Imagen para compartir en redes" en esa página concreta, en lugar de editar código directamente.
- Pruébalo con el Sharing Debugger de Facebook o el Post Inspector de LinkedIn — estas herramientas también ayudan a limpiar la vista previa guardada en caché (desactualizada) de una plataforma si estás actualizando una imagen que ya se había compartido antes.