Generador de Open Graph

Genera etiquetas meta de Open Graph y Twitter Card para compartir en redes sociales. Vista previa en vivo de cómo tu enlace aparecerá en Facebook, Twitter y LinkedIn.

Open Graph

0/95
0/200

Image

Recommended: 1200×630 px (1.91:1 ratio)

Twitter Card

Live Preview

Fill in the fields to see how your link will look when shared

Paste these tags inside the <head> of your HTML document.

All processing happens in your browser. No data is sent to any server. Your URLs, titles, and image links are never stored or transmitted.

Cómo usar Generador de Open Graph

  1. 1Rellena el título, descripción y URL de tu página.
  2. 2Agrega una URL de imagen para la vista previa social.
  3. 3Configura los ajustes de Twitter Card.
  4. 4Copia las etiquetas meta generadas a tu encabezado HTML.
ZenovayAnalytics

Analytics sin ningún aviso de cookies.

  • Seguimiento de visitantes en tiempo real
  • Privacidad primero, sin aviso de cookies
  • Configurado en dos minutos
Descubre Zenovay

Preguntas frecuentes

¿Qué es el protocolo de Open Graph?
Open Graph (OG) es un protocolo creado por Facebook que permite a las páginas web controlar cómo aparecen cuando se comparten en redes sociales. Al agregar etiquetas meta OG a tu encabezado HTML, especificas el título, descripción, imagen y URL que plataformas como Facebook, LinkedIn y Twitter muestran en vistas previas de enlaces.
¿Cuáles son las propiedades de Open Graph requeridas versus opcionales?
Requeridas: og:title, og:type, og:image y og:url. Recomendadas: og:description, og:site_name, og:locale. Opcionales: og:image:width, og:image:height, og:image:alt. Para artículos: article:author, article:published_time, article:section. Existen más propiedades para tipos de contenido específicos.
¿Cuáles son las mejores prácticas para og:image?
Tamaño recomendado: 1200x630 píxeles para visualización óptima en todas las plataformas. Usa imágenes de alta calidad con relación de aspecto 1.91:1. Mantén el tamaño del archivo por debajo de 8MB. Usa URLs absolutas, no rutas relativas. Incluye og:image:width y og:image:height para renderizado más rápido. Prueba con la herramienta de depuración de uso compartido de Facebook.
¿Cómo pruebo mis etiquetas de Open Graph?
Usa Facebook Sharing Debugger (developers.facebook.com/tools/debug/) para probar y actualizar datos OG en caché. Twitter Card Validator (cards-dev.twitter.com/validator) para pruebas específicas de Twitter. LinkedIn Post Inspector (linkedin.com/post-inspector/) para LinkedIn. Estas herramientas muestran exactamente cómo aparecerá tu vista previa de enlace.
¿Cuál es la diferencia entre Twitter Cards y Open Graph?
Twitter Cards usan etiquetas meta con prefijo twitter:. Open Graph usa etiquetas con prefijo og:. Twitter volverá a las etiquetas OG si no hay etiquetas específicas de Twitter. Etiquetas solo de Twitter: twitter:card (resumen o resumen_imagen_grande), twitter:site, twitter:creator. Mejor práctica: incluye tanto etiquetas OG como de Twitter para máxima compatibilidad.