Vista previa de redes sociales
Etiquetas Open Graph + Twitter Card con una tarjeta de vista previa al estilo Facebook/Twitter
Cuatro plataformas, una verdad sobre su tarjeta para compartir
Facebook, X, LinkedIn y WhatsApp interpretan sus etiquetas OG de forma distinta — vea las cuatro maquetas y corrija la más débil antes de publicar.
Un formulario, dos juegos de etiquetas
Las etiquetas Open Graph para Facebook, LinkedIn y Slack y las Twitter Card para X se generan juntas a partir de un mismo título, descripción, imagen y URL.
Vistas previas de tarjeta antes de publicar
Las tarjetas de vista previa renderizan la imagen a 1.91:1 con dominio, título y descripción: el diseño exacto que ven los usuarios al compartir el enlace, antes de lanzar nada.
Las dos variantes de tarjeta
Elige summary_large_image para una imagen a todo lo ancho o la tarjeta compacta summary, y el generador emite el valor twitter:card y las etiquetas correspondientes.
Preguntas frecuentes
¿Por qué generar juntas las etiquetas de Open Graph y Twitter Card?
Twitter/X recurre automáticamente a tus etiquetas Open Graph cuando faltan etiquetas twitter:* específicas, así que las tarjetas de compartir reales se construyen a partir de un mismo conjunto de campos; completarlas por separado solo duplicaría el mismo título, descripción e imagen.
¿Qué tamaño de imagen debería usar?
1200×630px (una proporción aproximada de 1,91:1) es el tamaño recomendado y seguro para tarjetas "summary_large_image" en Facebook, Twitter/X, LinkedIn y Slack; las imágenes más pequeñas o con recortes extraños pueden recortarse de forma impredecible en cada plataforma.
¿Se sube mi contenido a algún sitio?
No: todo se ejecuta en tu navegador con JavaScript puro. Nada de lo que escribes se envía nunca a un servidor.
Qué lee cada plataforma
| Plataforma | Fuente principal | Proporción de imagen |
|---|---|---|
| Facebook / LinkedIn | og:title, og:description, og:image | 1.91:1 (mínimo 200×200) |
| X / Twitter | twitter:card, si no alternativa OG | 2:1 large, 1:1 summary |
| og:title/image (la descripción suele ocultarse) | recorte casi cuadrado |
Marca imágenes con tamaño insuficiente, etiquetas de dimensiones ausentes (que obligan a re-rastreos) y títulos que superan el punto de corte de cada red.
Herramientas relacionadas
¿Qué es una vista previa de redes sociales?
Cuando alguien comparte un enlace en Facebook, X, LinkedIn o Slack, la plataforma lee las metaetiquetas —Open Graph en la mayoría de las redes, Twitter Cards en X— y construye una tarjeta con imagen, título y descripción. Sin esas etiquetas, la tarjeta se ve mal o solo muestra una URL desnuda, lo que perjudica los clics. Esta herramienta genera ambos conjuntos de etiquetas a partir de un único formulario y muestra tarjetas de vista previa en vivo, para que veas exactamente cómo se verá tu enlace antes de compartirlo en cualquier sitio. Los equipos de marketing, los equipos de contenido y los propietarios de sitios lo usan antes de cada lanzamiento.
Lo que genera
- 🖼️ Etiquetas Open Graph y Twitter Card a partir de un mismo conjunto de campos
- 📱 Tarjeta de vista previa estilo Facebook/Twitter en vivo mientras escribes
- 🗂️ Tipo de tarjeta summary o imagen grande para X
- 🔗 Soporte de og:url y og:site_name
- 📋 Un bloque de etiquetas combinado y listo para pegar
Cuándo revisar antes de compartir
- Lanzar un producto o una página que se compartirá ampliamente
- Verificar el aspecto de un enlace de artículo antes de una campaña
- Comprobar si la imagen elegida aguanta bien el recorte a 1,91:1
- Auditar un sitio cuyas tarjetas de compartir llevan meses rotas
Todo se genera en tu navegador; no se sube ningún contenido. Una peculiaridad de las plataformas que conviene saber: las redes sociales guardan en caché los metadatos de una URL, así que tras añadir las etiquetas puede que necesites refrescar la caché con la herramienta de depuración de la plataforma para que aparezca la nueva tarjeta.
Última actualización · 2026-09-01
Herramientas relacionadas
Generador de meta etiquetas
Etiquetas de title, description, keywords, canonical y robots con vista previa en vivo de Google
Vista previa SERP
Comprueba exactamente cómo se verán tu título y tu descripción en los resultados de Google, con avisos de truncamiento precisos al píxel.
Generador de enlaces UTM
Crea enlaces de campaña limpios y bien codificados en segundos, con plantillas de un toque para Facebook Ads, Google Ads y más.