Blog de OG Preview

Guía de etiquetas Open Graph 2026

En 2026, las etiquetas Open Graph (OG) siguen siendo la piedra angular de compartir en redes sociales, pero su papel ha evolucionado. Lo que antes era una forma sencilla de controlar las vistas previas de título e imagen, OG es ahora parte de un ecosistema que incluye las Twitter Cards y el esquema JSON-LD.

Las principales plataformas como Facebook, LinkedIn y X (Twitter) siguen dependiendo en gran medida de las etiquetas OG para representar el contenido. Sin embargo, las reglas se han vuelto más matizadas: los títulos meta de menos de 60 caracteres funcionan mejor, y las dimensiones de imagen de 1200×630px son ahora el estándar universal.

Hoy en día, las buenas prácticas incluyen no solo configurar og:title y og:image, sino también og:description (150–200 caracteres), og:url (enlace canónico), og:type (article/product) y og:site_name. Que falte cualquiera de estas puede provocar una representación inconsistente o un recurso a texto sin estilo.

Herramientas como OG Preview te permiten ver estas tarjetas una al lado de la otra antes de publicar y, en el modo Obtener URL, comprobar qué etiquetas expone ya una página, de modo que puedas detectar lo que falta mientras aún controlas la página.

Optimización de las vistas previas en redes sociales

¿Por qué algunas publicaciones se comparten mucho más que otras? A menudo no es el contenido, es la vista previa. Una vista previa social bien elaborada actúa como una valla publicitaria digital: es lo primero (y a veces lo único) que ven los usuarios antes de hacer clic.

Optimizar para las vistas previas significa equilibrar claridad y curiosidad. El título debe ser contundente pero veraz; la imagen debe llamar la atención al tamaño de miniatura; y la descripción tiene que responder «¿por qué debería importarme?» en unos pocos segundos.

Las publicaciones con imágenes personalizadas tienden a obtener mucha más interacción que las que usan fragmentos generados automáticamente. Aún mejor: las plantillas de marca coherentes (colores, tipografías, ubicación del logotipo) generan reconocimiento y confianza con el tiempo.

Usa OG Preview para comparar diferentes combinaciones de imagen y texto en la vista previa en vivo antes de publicar, y luego haz seguimiento de los clics con parámetros UTM o tu panel de analítica para afinar tu enfoque.

Etiquetas OG frente a Twitter Cards

Muchos suponen que las etiquetas Open Graph y las Twitter Cards son intercambiables. No lo son. Aunque ambas controlan cómo aparece el contenido cuando se comparte, usan espacios de nombres diferentes y tienen comportamientos de reserva distintos.

Las Twitter Cards dependen principalmente del espacio de nombres twitter:: twitter:title, twitter:description, twitter:image. Si faltan, X generalmente recurre a tus etiquetas OG, pero no siempre de forma coherente.

La solución pragmática es incluir ambos conjuntos de etiquetas. Por ejemplo:

Esto maximiza la compatibilidad entre plataformas. Muchas herramientas de CMS añaden ambas de forma predeterminada, pero si escribes el código a mano, no olvides las variantes de Twitter.

Por qué importan las vistas previas sociales

Las vistas previas sociales no son decorativas: son el apretón de manos antes del clic. Muchos usuarios deciden si abren un enlace basándose únicamente en la imagen de vista previa y el titular, antes de leer nada más.

Una vista previa vaga o defectuosa (una imagen que falta, un título truncado) transmite baja calidad o un mantenimiento deficiente. Una vista previa limpia, con identidad de marca y atractiva genera credibilidad y aumenta la tasa de clics.

Para creadores, especialistas en marketing y desarrolladores por igual: si tu vista previa se ve descuidada, la gente asumirá que tu sitio también lo está, sin importar lo pulido que esté el backend.

Trata las vistas previas como parte de tu flujo de trabajo editorial: previsualízalas y apruébalas antes de pulsar publicar, con el mismo cuidado que das a los titulares o a las imágenes destacadas.

Errores comunes con las etiquetas OG

Incluso los equipos experimentados cometen estos errores recurrentes:

1. Falta og:url: sin ella, las plataformas no pueden validar el enlace canónico, lo que puede provocar confusión por contenido duplicado.
2. Rutas de imagen relativas: usa siempre URLs absolutas (https://yoursite.com/image.jpg). Los rastreadores sociales no resuelven las rutas relativas.
3. Olvidar og:type: el valor predeterminado es "website", pero "article" o "product" pueden desbloquear vistas previas más ricas.
4. No probar después de los cambios: las plataformas almacenan en caché de forma agresiva. Usa el Facebook Debugger o el Twitter Validator para forzar una actualización después de editar.
5. Ignorar la vista previa móvil: el escritorio y el móvil se representan de forma diferente. Comprueba ambos: la mayor parte del tráfico social prioriza el móvil.

Corrige estos y ya estarás por delante de la mayoría de los sitios web. Pequeños detalles, gran impacto.