¿Qué son las etiquetas Open Graph?

Las etiquetas Open Graph son meta etiquetas que controlan cómo aparecen tus páginas web cuando se comparten en plataformas de redes sociales. Definen el título, descripción e imagen que aparecen en la tarjeta de compartido.

¿Qué tamaño de imagen debo usar para og:image?

El tamaño recomendado para og:image es 1200x630 píxeles (relación de aspecto 1.91:1). El tamaño mínimo es 600x315 píxeles. Usa archivos JPG o PNG de alta calidad menores de 8MB.

¿Cuánto deben durar mi og:title y og:description?

Los títulos OG deben ser de 40-60 caracteres para visualización óptima. Las descripciones OG deben ser alrededor de 200 caracteres. Mantén tu información más importante al principio de ambos.

¿Estas vistas previas coinciden exactamente con lo que aparece en redes sociales?

Las vistas previas son aproximaciones muy cercanas. Sin embargo, la visualización real puede variar ligeramente según actualizaciones de plataforma, tipos de dispositivo y configuraciones de usuario individual.

¿Cuál es la diferencia entre Open Graph y Twitter Cards?

Open Graph fue creado por Facebook y es usado por la mayoría de plataformas sociales. Twitter Cards es el formato de metadatos propietario de Twitter. Sin embargo, Twitter usará etiquetas Open Graph si las etiquetas de Twitter Card no están presentes.

¿Cómo agrego etiquetas Open Graph a mi sitio web?

Agrega meta etiquetas Open Graph a la sección de tu HTML. La mayoría de plataformas CMS tienen plugins SEO que facilitan esto.

¿Por qué mi imagen no se muestra en la vista previa?

Verifica: (1) La URL es correcta y públicamente accesible, (2) La imagen usa HTTPS no HTTP, (3) El formato es JPG o PNG, (4) La imagen cumple requisitos de tamaño mínimo, (5) El servidor permite hotlinking.

¿Necesito diferentes etiquetas OG para cada plataforma social?

No, las etiquetas Open Graph funcionan en todas las plataformas. Facebook, LinkedIn, Pinterest y otros leen las mismas etiquetas og:. Twitter puede usar etiquetas OG como respaldo.

Vista Previa de Open Graph

Previsualiza cómo aparece tu contenido en plataformas de redes sociales

Título OG (og:title)

El título que aparece cuando se comparte tu página (40-60 caracteres recomendados)

Descripción OG (og:description)

Descripción mostrada en compartidos sociales (200 caracteres recomendados)

URL de Imagen OG (og:image)

Imagen mostrada en compartidos sociales (1200x630px recomendado)

URL de Página (og:url)

La URL canónica de tu página

Tipo OG (og:type)

Nombre del Sitio (og:site_name)

Cómo Usar la Herramienta de Vista Previa Open Graph

Previsualiza cómo se mostrarán tus meta etiquetas Open Graph cuando tu contenido se comparta en redes sociales.

Pasos:

Ingresa el título OG de tu página
Agrega tu descripción OG
Proporciona la URL de tu imagen OG
Ingresa la URL de tu página y selecciona el tipo de contenido
Opcionalmente agrega el nombre de tu sitio
Ve vistas previas en tiempo real para Facebook, Twitter y LinkedIn
Ajusta tus etiquetas OG hasta que las vistas previas se vean perfectas

Herramienta de Vista Previa Open Graph Gratuita

Nuestra herramienta de vista previa de Open Graph gratuita muestra cómo aparecerán tus meta etiquetas OG cuando se compartan en Facebook, Twitter y LinkedIn. Ingresa tu og:title, og:description, og:image y otras propiedades de Open Graph para ver vistas previas en tiempo real. Perfecto para creadores de contenido, mercadólogos y desarrolladores. Las etiquetas meta de Open Graph controlan cómo aparecen tus páginas web cuando se comparten en redes sociales. Todas las vistas previas se generan localmente en tu navegador.

Características de Vista Previa Open Graph

Vista previa de Facebook en tiempo real

Vista previa de tarjeta de Twitter en tiempo real

Vista previa de LinkedIn en tiempo real

Previsualiza visualización de og:title

Previsualiza truncamiento de og:description

Previsualiza renderizado de og:image

Soporte para todos los valores og:type

Actualizaciones instantáneas mientras escribes

Maquetas precisas de plataformas sociales

No requiere registro

Vistas previas ilimitadas gratuitas

Enfocado en privacidad

Por Qué Previsualizar Etiquetas Open Graph

Asegurar que tu contenido se vea genial cuando se comparte

Probar diferentes títulos y descripciones

Verificar que las imágenes se muestren correctamente

Optimizar para tasas de clics máximas

Evitar errores vergonzosos en compartidos sociales

Mejorar participación en redes sociales

Ahorrar tiempo probando en plataformas reales

Perfeccionar tu presencia social antes de publicar

Casos de Uso Comunes

Probar etiquetas OG de publicaciones de blog

Optimizar compartidos sociales de páginas de productos

Previsualizar títulos de artículos

Probar imágenes de productos para compartidos

Verificar implementación OG de página de inicio

Optimizar presencia social de páginas de destino

Probar tarjetas sociales de artículos de noticias

Previsualizar compartidos de contenido de video

Control de calidad para lanzamientos de sitios web

Optimización social de marketing de contenido

Verificar etiquetas OG después de actualizaciones de CMS

Probar diferentes variaciones de imagen

Herramientas relacionadas

Generador de Robots.txt para Rastreadores de IA - Bloquea Bots de IA

Generador gratuito de robots.txt para rastreadores de IA. Bloquea GPTBot, ChatGPT-User, CCBot, Claude-Web, Google-Extended, Bytespider y otros rastreadores de IA. Genera reglas robots.txt al instante.

Probar ahora

Generador de Slugs en Masa - Convierte Múltiples Títulos a Slugs de URL Gratis

Herramienta gratuita de generador de slugs en masa para convertir múltiples títulos en slugs de URL optimizados para SEO a la vez. Procesa listas de títulos, personaliza el separador y las opciones de mayúsculas, y copia todos los slugs al instante.

Probar ahora

Verificador de Etiqueta Canonical - Validar y Extraer URLs Canonical de HTML

Herramienta gratuita de verificación de etiqueta canonical. Extrae y valida URLs canonical del contenido HTML head. Verifica etiquetas canonical faltantes, duplicadas o inválidas. Asegura la canonicalización SEO adecuada con validación instantánea y advertencias detalladas.

Probar ahora

Generador de Etiquetas Canonical - Crear Etiquetas URL Canónicas para SEO Gratis

Herramienta gratuita generador de etiquetas canonical para crear etiquetas HTML de enlace canónico para tus páginas web. Valida URLs, genera etiquetas canónicas correctas y previene problemas de contenido duplicado. Perfecto para optimización SEO.

Probar ahora

Generador de Esquema FAQ - Crear Esquema JSON-LD FAQPage para SEO Gratis

Herramienta gratuita generador de esquema FAQ para crear datos estructurados JSON-LD FAQPage para mejor visibilidad en motores de búsqueda. Agrega pares de preguntas y respuestas, genera marcado de esquema válido y mejora tu SEO con resultados enriquecidos en búsqueda de Google. Perfecto para páginas FAQ, centros de ayuda y bases de conocimiento.

Probar ahora

Verificador de Estructura de Encabezados - Analiza Etiquetas H1-H6 para SEO

Herramienta gratuita para verificar estructura de encabezados. Analiza la jerarquía HTML de encabezados (H1-H6), detecta múltiples H1s, encuentra niveles omitidos y optimiza tu estructura de página para SEO y accesibilidad.

Probar ahora